@@ -18,6 +18,7 @@ package com.example.jetcaster.ui.player
18
18
19
19
import androidx.compose.foundation.ExperimentalFoundationApi
20
20
import androidx.compose.foundation.Image
21
+ import androidx.compose.foundation.background
21
22
import androidx.compose.foundation.basicMarquee
22
23
import androidx.compose.foundation.clickable
23
24
import androidx.compose.foundation.layout.Arrangement
@@ -42,6 +43,7 @@ import androidx.compose.foundation.layout.windowInsetsPadding
42
43
import androidx.compose.foundation.layout.wrapContentSize
43
44
import androidx.compose.foundation.rememberScrollState
44
45
import androidx.compose.foundation.text.selection.SelectionContainer
46
+ import androidx.compose.foundation.shape.CircleShape
45
47
import androidx.compose.foundation.verticalScroll
46
48
import androidx.compose.material.icons.Icons
47
49
import androidx.compose.material.icons.automirrored.filled.ArrowBack
@@ -51,8 +53,8 @@ import androidx.compose.material.icons.filled.MoreVert
51
53
import androidx.compose.material.icons.filled.Replay10
52
54
import androidx.compose.material.icons.filled.SkipNext
53
55
import androidx.compose.material.icons.filled.SkipPrevious
54
- import androidx.compose.material.icons.rounded.PauseCircleFilled
55
- import androidx.compose.material.icons.rounded.PlayCircleFilled
56
+ import androidx.compose.material.icons.outlined.Pause
57
+ import androidx.compose.material.icons.outlined.PlayArrow
56
58
import androidx.compose.material3.CircularProgressIndicator
57
59
import androidx.compose.material3.Icon
58
60
import androidx.compose.material3.IconButton
@@ -202,7 +204,7 @@ private fun PlayerBackground(
202
204
) {
203
205
ImageBackgroundColorScrim (
204
206
url = episode?.podcastImageUrl,
205
- color = Color . Black . copy(alpha = 0.68f ),
207
+ color = MaterialTheme .colorScheme.surface. copy(alpha = 0.9f ),
206
208
modifier = modifier,
207
209
)
208
210
}
@@ -238,7 +240,7 @@ fun PlayerContentWithBackground(
238
240
onRewindBy = onRewindBy,
239
241
onNext = onNext,
240
242
onPrevious = onPrevious,
241
- onAddToQueue = onAddToQueue
243
+ onAddToQueue = onAddToQueue,
242
244
)
243
245
}
244
246
}
@@ -281,7 +283,9 @@ fun PlayerContent(
281
283
if (usingVerticalStrategy) {
282
284
TwoPane (
283
285
first = {
284
- PlayerContentTableTopTop (uiState = uiState)
286
+ PlayerContentTableTopTop (
287
+ uiState = uiState,
288
+ )
285
289
},
286
290
second = {
287
291
PlayerContentTableTopBottom (
@@ -617,13 +621,6 @@ private fun TopAppBar(
617
621
}
618
622
}
619
623
620
- @Composable
621
- private fun PlayerCarousel (
622
- modifier : Modifier = Modifier
623
- ) {
624
-
625
- }
626
-
627
624
@Composable
628
625
private fun PlayerImage (
629
626
podcastImageUrl : String ,
@@ -654,11 +651,13 @@ private fun PodcastDescription(
654
651
text = title,
655
652
style = titleTextStyle,
656
653
maxLines = 1 ,
654
+ color = MaterialTheme .colorScheme.onSurface,
657
655
modifier = Modifier .basicMarquee()
658
656
)
659
657
Text (
660
658
text = podcastName,
661
659
style = MaterialTheme .typography.bodyMedium,
660
+ color = MaterialTheme .colorScheme.onSurface,
662
661
maxLines = 1
663
662
)
664
663
}
@@ -742,50 +741,60 @@ private fun PlayerButtons(
742
741
verticalAlignment = Alignment .CenterVertically ,
743
742
horizontalArrangement = Arrangement .SpaceEvenly
744
743
) {
745
- val buttonsModifier = Modifier
744
+ val sideButtonsModifier = Modifier
746
745
.size(sideButtonSize)
746
+ .background(
747
+ color = MaterialTheme .colorScheme.surfaceContainerHighest,
748
+ shape = CircleShape
749
+ )
750
+ .semantics { role = Role .Button }
751
+
752
+ val primaryButtonModifier = Modifier
753
+ .size(playerButtonSize)
754
+ .background(
755
+ color = MaterialTheme .colorScheme.primaryContainer,
756
+ shape = CircleShape
757
+ )
747
758
.semantics { role = Role .Button }
748
759
749
760
Image (
750
761
imageVector = Icons .Filled .SkipPrevious ,
751
762
contentDescription = stringResource(R .string.cd_skip_previous),
752
- contentScale = ContentScale .Fit ,
753
- colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.onSurface ),
754
- modifier = buttonsModifier
763
+ contentScale = ContentScale .Inside ,
764
+ colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.onSurfaceVariant ),
765
+ modifier = sideButtonsModifier
755
766
.clickable(enabled = isPlaying, onClick = onPrevious)
756
767
)
757
768
Image (
758
769
imageVector = Icons .Filled .Replay10 ,
759
770
contentDescription = stringResource(R .string.cd_replay10),
760
- contentScale = ContentScale .Fit ,
771
+ contentScale = ContentScale .Inside ,
761
772
colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.onSurface),
762
- modifier = buttonsModifier
773
+ modifier = sideButtonsModifier
763
774
.clickable {
764
775
onRewindBy(Duration .ofSeconds(10 ))
765
776
}
766
777
)
767
778
if (isPlaying) {
768
779
Image (
769
- imageVector = Icons .Rounded . PauseCircleFilled ,
780
+ imageVector = Icons .Outlined . Pause ,
770
781
contentDescription = stringResource(R .string.cd_pause),
771
782
contentScale = ContentScale .Fit ,
772
- colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.primaryContainer),
773
- modifier = Modifier
774
- .size(playerButtonSize)
775
- .semantics { role = Role .Button }
783
+ colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.onPrimaryContainer),
784
+ modifier = primaryButtonModifier
785
+ .padding(8 .dp)
776
786
.clickable {
777
787
onPausePress()
778
788
}
779
789
)
780
790
} else {
781
791
Image (
782
- imageVector = Icons .Rounded . PlayCircleFilled ,
792
+ imageVector = Icons .Outlined . PlayArrow ,
783
793
contentDescription = stringResource(R .string.cd_play),
784
794
contentScale = ContentScale .Fit ,
785
- colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.primaryContainer),
786
- modifier = Modifier
787
- .size(playerButtonSize)
788
- .semantics { role = Role .Button }
795
+ colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.onPrimaryContainer),
796
+ modifier = primaryButtonModifier
797
+ .padding(8 .dp)
789
798
.clickable {
790
799
onPlayPress()
791
800
}
@@ -794,19 +803,19 @@ private fun PlayerButtons(
794
803
Image (
795
804
imageVector = Icons .Filled .Forward10 ,
796
805
contentDescription = stringResource(R .string.cd_forward10),
797
- contentScale = ContentScale .Fit ,
806
+ contentScale = ContentScale .Inside ,
798
807
colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.onSurface),
799
- modifier = buttonsModifier
808
+ modifier = sideButtonsModifier
800
809
.clickable {
801
810
onAdvanceBy(Duration .ofSeconds(10 ))
802
811
}
803
812
)
804
813
Image (
805
814
imageVector = Icons .Filled .SkipNext ,
806
815
contentDescription = stringResource(R .string.cd_skip_next),
807
- contentScale = ContentScale .Fit ,
808
- colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.onSurface ),
809
- modifier = buttonsModifier
816
+ contentScale = ContentScale .Inside ,
817
+ colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.onSurfaceVariant ),
818
+ modifier = sideButtonsModifier
810
819
.clickable(enabled = hasNext, onClick = onNext)
811
820
)
812
821
}
@@ -890,6 +899,11 @@ fun PlayerScreenPreview() {
890
899
podcastName = " Podcast" ,
891
900
),
892
901
isPlaying = false ,
902
+ queue = listOf (
903
+ PlayerEpisode (),
904
+ PlayerEpisode (),
905
+ PlayerEpisode (),
906
+ )
893
907
),
894
908
),
895
909
displayFeatures = emptyList(),
0 commit comments