@@ -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
@@ -41,6 +42,7 @@ import androidx.compose.foundation.layout.systemBarsPadding
41
42
import androidx.compose.foundation.layout.windowInsetsPadding
42
43
import androidx.compose.foundation.layout.wrapContentSize
43
44
import androidx.compose.foundation.rememberScrollState
45
+ import androidx.compose.foundation.shape.CircleShape
44
46
import androidx.compose.foundation.verticalScroll
45
47
import androidx.compose.material.icons.Icons
46
48
import androidx.compose.material.icons.automirrored.filled.ArrowBack
@@ -50,8 +52,8 @@ import androidx.compose.material.icons.filled.MoreVert
50
52
import androidx.compose.material.icons.filled.Replay10
51
53
import androidx.compose.material.icons.filled.SkipNext
52
54
import androidx.compose.material.icons.filled.SkipPrevious
53
- import androidx.compose.material.icons.rounded.PauseCircleFilled
54
- import androidx.compose.material.icons.rounded.PlayCircleFilled
55
+ import androidx.compose.material.icons.outlined.Pause
56
+ import androidx.compose.material.icons.outlined.PlayArrow
55
57
import androidx.compose.material3.CircularProgressIndicator
56
58
import androidx.compose.material3.Icon
57
59
import androidx.compose.material3.IconButton
@@ -71,7 +73,6 @@ import androidx.compose.runtime.rememberCoroutineScope
71
73
import androidx.compose.ui.Alignment
72
74
import androidx.compose.ui.Modifier
73
75
import androidx.compose.ui.draw.clip
74
- import androidx.compose.ui.graphics.Color
75
76
import androidx.compose.ui.graphics.ColorFilter
76
77
import androidx.compose.ui.layout.ContentScale
77
78
import androidx.compose.ui.platform.LocalContext
@@ -200,7 +201,7 @@ private fun PlayerBackground(
200
201
) {
201
202
ImageBackgroundColorScrim (
202
203
url = episode?.podcastImageUrl,
203
- color = Color . Black . copy(alpha = 0.68f ),
204
+ color = MaterialTheme .colorScheme.surface. copy(alpha = 0.9f ),
204
205
modifier = modifier,
205
206
)
206
207
}
@@ -236,7 +237,7 @@ fun PlayerContentWithBackground(
236
237
onRewindBy = onRewindBy,
237
238
onNext = onNext,
238
239
onPrevious = onPrevious,
239
- onAddToQueue = onAddToQueue
240
+ onAddToQueue = onAddToQueue,
240
241
)
241
242
}
242
243
}
@@ -279,7 +280,9 @@ fun PlayerContent(
279
280
if (usingVerticalStrategy) {
280
281
TwoPane (
281
282
first = {
282
- PlayerContentTableTopTop (uiState = uiState)
283
+ PlayerContentTableTopTop (
284
+ uiState = uiState,
285
+ )
283
286
},
284
287
second = {
285
288
PlayerContentTableTopBottom (
@@ -618,13 +621,6 @@ private fun TopAppBar(
618
621
}
619
622
}
620
623
621
- @Composable
622
- private fun PlayerCarousel (
623
- modifier : Modifier = Modifier
624
- ) {
625
-
626
- }
627
-
628
624
@Composable
629
625
private fun PlayerImage (
630
626
podcastImageUrl : String ,
@@ -655,11 +651,13 @@ private fun PodcastDescription(
655
651
text = title,
656
652
style = titleTextStyle,
657
653
maxLines = 1 ,
654
+ color = MaterialTheme .colorScheme.onSurface,
658
655
modifier = Modifier .basicMarquee()
659
656
)
660
657
Text (
661
658
text = podcastName,
662
659
style = MaterialTheme .typography.bodyMedium,
660
+ color = MaterialTheme .colorScheme.onSurface,
663
661
maxLines = 1
664
662
)
665
663
}
@@ -743,50 +741,60 @@ private fun PlayerButtons(
743
741
verticalAlignment = Alignment .CenterVertically ,
744
742
horizontalArrangement = Arrangement .SpaceEvenly
745
743
) {
746
- val buttonsModifier = Modifier
744
+ val sideButtonsModifier = Modifier
747
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
+ )
748
758
.semantics { role = Role .Button }
749
759
750
760
Image (
751
761
imageVector = Icons .Filled .SkipPrevious ,
752
762
contentDescription = stringResource(R .string.cd_skip_previous),
753
- contentScale = ContentScale .Fit ,
754
- colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.onSurface ),
755
- modifier = buttonsModifier
763
+ contentScale = ContentScale .Inside ,
764
+ colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.onSurfaceVariant ),
765
+ modifier = sideButtonsModifier
756
766
.clickable(enabled = isPlaying, onClick = onPrevious)
757
767
)
758
768
Image (
759
769
imageVector = Icons .Filled .Replay10 ,
760
770
contentDescription = stringResource(R .string.cd_replay10),
761
- contentScale = ContentScale .Fit ,
771
+ contentScale = ContentScale .Inside ,
762
772
colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.onSurface),
763
- modifier = buttonsModifier
773
+ modifier = sideButtonsModifier
764
774
.clickable {
765
775
onRewindBy(Duration .ofSeconds(10 ))
766
776
}
767
777
)
768
778
if (isPlaying) {
769
779
Image (
770
- imageVector = Icons .Rounded . PauseCircleFilled ,
780
+ imageVector = Icons .Outlined . Pause ,
771
781
contentDescription = stringResource(R .string.cd_pause),
772
782
contentScale = ContentScale .Fit ,
773
- colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.primaryContainer),
774
- modifier = Modifier
775
- .size(playerButtonSize)
776
- .semantics { role = Role .Button }
783
+ colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.onPrimaryContainer),
784
+ modifier = primaryButtonModifier
785
+ .padding(8 .dp)
777
786
.clickable {
778
787
onPausePress()
779
788
}
780
789
)
781
790
} else {
782
791
Image (
783
- imageVector = Icons .Rounded . PlayCircleFilled ,
792
+ imageVector = Icons .Outlined . PlayArrow ,
784
793
contentDescription = stringResource(R .string.cd_play),
785
794
contentScale = ContentScale .Fit ,
786
- colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.primaryContainer),
787
- modifier = Modifier
788
- .size(playerButtonSize)
789
- .semantics { role = Role .Button }
795
+ colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.onPrimaryContainer),
796
+ modifier = primaryButtonModifier
797
+ .padding(8 .dp)
790
798
.clickable {
791
799
onPlayPress()
792
800
}
@@ -795,19 +803,19 @@ private fun PlayerButtons(
795
803
Image (
796
804
imageVector = Icons .Filled .Forward10 ,
797
805
contentDescription = stringResource(R .string.cd_forward10),
798
- contentScale = ContentScale .Fit ,
806
+ contentScale = ContentScale .Inside ,
799
807
colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.onSurface),
800
- modifier = buttonsModifier
808
+ modifier = sideButtonsModifier
801
809
.clickable {
802
810
onAdvanceBy(Duration .ofSeconds(10 ))
803
811
}
804
812
)
805
813
Image (
806
814
imageVector = Icons .Filled .SkipNext ,
807
815
contentDescription = stringResource(R .string.cd_skip_next),
808
- contentScale = ContentScale .Fit ,
809
- colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.onSurface ),
810
- modifier = buttonsModifier
816
+ contentScale = ContentScale .Inside ,
817
+ colorFilter = ColorFilter .tint(MaterialTheme .colorScheme.onSurfaceVariant ),
818
+ modifier = sideButtonsModifier
811
819
.clickable(enabled = hasNext, onClick = onNext)
812
820
)
813
821
}
@@ -873,6 +881,11 @@ fun PlayerScreenPreview() {
873
881
podcastName = " Podcast" ,
874
882
),
875
883
isPlaying = false ,
884
+ queue = listOf (
885
+ PlayerEpisode (),
886
+ PlayerEpisode (),
887
+ PlayerEpisode (),
888
+ )
876
889
),
877
890
),
878
891
displayFeatures = emptyList(),
0 commit comments