mirror of
https://github.com/austinried/subtracks.git
synced 2026-11-11 07:29:14 +01:00
let the mini player colour run behind the nav bar again
This commit is contained in:
austinried
@@ -1,19 +1,15 @@
|
|||||||
package com.subtracks.ui.playback
|
package com.subtracks.ui.playback
|
||||||
|
|
||||||
import androidx.compose.foundation.background
|
|
||||||
import androidx.compose.foundation.basicMarquee
|
import androidx.compose.foundation.basicMarquee
|
||||||
import androidx.compose.foundation.clickable
|
import androidx.compose.foundation.clickable
|
||||||
import androidx.compose.foundation.interaction.MutableInteractionSource
|
import androidx.compose.foundation.interaction.MutableInteractionSource
|
||||||
import androidx.compose.foundation.layout.Arrangement
|
import androidx.compose.foundation.layout.Arrangement
|
||||||
import androidx.compose.foundation.layout.Column
|
import androidx.compose.foundation.layout.Column
|
||||||
import androidx.compose.foundation.layout.Row
|
import androidx.compose.foundation.layout.Row
|
||||||
import androidx.compose.foundation.layout.Spacer
|
|
||||||
import androidx.compose.foundation.layout.WindowInsets
|
|
||||||
import androidx.compose.foundation.layout.fillMaxWidth
|
import androidx.compose.foundation.layout.fillMaxWidth
|
||||||
import androidx.compose.foundation.layout.navigationBars
|
import androidx.compose.foundation.layout.navigationBarsPadding
|
||||||
import androidx.compose.foundation.layout.padding
|
import androidx.compose.foundation.layout.padding
|
||||||
import androidx.compose.foundation.layout.size
|
import androidx.compose.foundation.layout.size
|
||||||
import androidx.compose.foundation.layout.windowInsetsBottomHeight
|
|
||||||
import androidx.compose.foundation.shape.RoundedCornerShape
|
import androidx.compose.foundation.shape.RoundedCornerShape
|
||||||
import androidx.compose.material.icons.Icons
|
import androidx.compose.material.icons.Icons
|
||||||
import androidx.compose.material.icons.rounded.Pause
|
import androidx.compose.material.icons.rounded.Pause
|
||||||
@@ -30,7 +26,6 @@ import androidx.compose.runtime.remember
|
|||||||
import androidx.compose.ui.Alignment
|
import androidx.compose.ui.Alignment
|
||||||
import androidx.compose.ui.Modifier
|
import androidx.compose.ui.Modifier
|
||||||
import androidx.compose.ui.draw.clip
|
import androidx.compose.ui.draw.clip
|
||||||
import androidx.compose.ui.graphics.Color
|
|
||||||
import androidx.compose.ui.graphics.lerp
|
import androidx.compose.ui.graphics.lerp
|
||||||
import androidx.compose.ui.unit.dp
|
import androidx.compose.ui.unit.dp
|
||||||
import com.subtracks.data.model.CoverArtRef
|
import com.subtracks.data.model.CoverArtRef
|
||||||
@@ -51,79 +46,75 @@ fun MiniPlayer(
|
|||||||
) {
|
) {
|
||||||
val item = state.item ?: return
|
val item = state.item ?: return
|
||||||
ArtworkTheme(artwork) {
|
ArtworkTheme(artwork) {
|
||||||
Column(modifier.fillMaxWidth()) {
|
Surface(
|
||||||
Surface(
|
color =
|
||||||
color =
|
artwork?.let { lerp(it.scheme.surfaceContainerHigh, it.gradientHigh, 0.5f) }
|
||||||
artwork?.let { lerp(it.scheme.surfaceContainerHigh, it.gradientHigh, 0.5f) }
|
?: MaterialTheme.colorScheme.surfaceContainerHigh,
|
||||||
?: MaterialTheme.colorScheme.surfaceContainerHigh,
|
contentColor = MaterialTheme.colorScheme.onSurface,
|
||||||
contentColor = MaterialTheme.colorScheme.onSurface,
|
modifier =
|
||||||
|
modifier.fillMaxWidth().clickable(
|
||||||
|
interactionSource = remember { MutableInteractionSource() },
|
||||||
|
indication = null,
|
||||||
|
onClick = onExpand,
|
||||||
|
),
|
||||||
|
) {
|
||||||
|
Row(
|
||||||
modifier =
|
modifier =
|
||||||
Modifier.fillMaxWidth().clickable(
|
Modifier
|
||||||
interactionSource = remember { MutableInteractionSource() },
|
.fillMaxWidth()
|
||||||
indication = null,
|
.navigationBarsPadding()
|
||||||
onClick = onExpand,
|
.padding(start = 12.dp, end = 4.dp, top = 12.dp, bottom = 12.dp),
|
||||||
),
|
verticalAlignment = Alignment.CenterVertically,
|
||||||
|
horizontalArrangement = Arrangement.spacedBy(12.dp),
|
||||||
) {
|
) {
|
||||||
Row(
|
CoverArt(
|
||||||
modifier =
|
ref = coverArt,
|
||||||
Modifier
|
name = item.title,
|
||||||
.fillMaxWidth()
|
modifier = Modifier.size(56.dp).clip(RoundedCornerShape(6.dp)),
|
||||||
.padding(start = 12.dp, end = 4.dp, top = 12.dp, bottom = 12.dp),
|
)
|
||||||
verticalAlignment = Alignment.CenterVertically,
|
Column(Modifier.weight(1f)) {
|
||||||
horizontalArrangement = Arrangement.spacedBy(12.dp),
|
Text(
|
||||||
) {
|
text = item.title,
|
||||||
CoverArt(
|
style = MaterialTheme.typography.bodyMedium,
|
||||||
ref = coverArt,
|
color = MaterialTheme.colorScheme.onSurface,
|
||||||
name = item.title,
|
maxLines = 1,
|
||||||
modifier = Modifier.size(56.dp).clip(RoundedCornerShape(6.dp)),
|
modifier = Modifier.basicMarquee(),
|
||||||
)
|
)
|
||||||
Column(Modifier.weight(1f)) {
|
Text(
|
||||||
Text(
|
text = listOfNotNull(item.artist, item.album).joinToString(" • "),
|
||||||
text = item.title,
|
style = MaterialTheme.typography.bodySmall,
|
||||||
style = MaterialTheme.typography.bodyMedium,
|
color = MaterialTheme.colorScheme.onSurfaceVariant,
|
||||||
color = MaterialTheme.colorScheme.onSurface,
|
maxLines = 1,
|
||||||
maxLines = 1,
|
modifier = Modifier.basicMarquee(),
|
||||||
modifier = Modifier.basicMarquee(),
|
)
|
||||||
)
|
}
|
||||||
Text(
|
Row(verticalAlignment = Alignment.CenterVertically) {
|
||||||
text = listOfNotNull(item.artist, item.album).joinToString(" • "),
|
IconButton(onClick = onPlayPause, modifier = Modifier.size(56.dp)) {
|
||||||
style = MaterialTheme.typography.bodySmall,
|
if (state.isBuffering && state.isPlaying) {
|
||||||
color = MaterialTheme.colorScheme.onSurfaceVariant,
|
CircularProgressIndicator(
|
||||||
maxLines = 1,
|
color = MaterialTheme.colorScheme.onSurface,
|
||||||
modifier = Modifier.basicMarquee(),
|
strokeWidth = 3.dp,
|
||||||
)
|
modifier = Modifier.size(28.dp),
|
||||||
}
|
)
|
||||||
Row(verticalAlignment = Alignment.CenterVertically) {
|
} else {
|
||||||
IconButton(onClick = onPlayPause, modifier = Modifier.size(56.dp)) {
|
|
||||||
if (state.isBuffering && state.isPlaying) {
|
|
||||||
CircularProgressIndicator(
|
|
||||||
color = MaterialTheme.colorScheme.onSurface,
|
|
||||||
strokeWidth = 3.dp,
|
|
||||||
modifier = Modifier.size(28.dp),
|
|
||||||
)
|
|
||||||
} else {
|
|
||||||
Icon(
|
|
||||||
imageVector = if (state.isPlaying) Icons.Rounded.Pause else Icons.Rounded.PlayArrow,
|
|
||||||
contentDescription = if (state.isPlaying) "Pause" else "Play",
|
|
||||||
tint = MaterialTheme.colorScheme.onSurface,
|
|
||||||
modifier = Modifier.size(42.dp),
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
IconButton(onClick = onNext, enabled = state.hasNext, modifier = Modifier.size(56.dp)) {
|
|
||||||
Icon(
|
Icon(
|
||||||
imageVector = Icons.Rounded.SkipNext,
|
imageVector = if (state.isPlaying) Icons.Rounded.Pause else Icons.Rounded.PlayArrow,
|
||||||
contentDescription = "Next",
|
contentDescription = if (state.isPlaying) "Pause" else "Play",
|
||||||
tint = MaterialTheme.colorScheme.onSurface,
|
tint = MaterialTheme.colorScheme.onSurface,
|
||||||
modifier = Modifier.size(42.dp),
|
modifier = Modifier.size(42.dp),
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
IconButton(onClick = onNext, enabled = state.hasNext, modifier = Modifier.size(56.dp)) {
|
||||||
|
Icon(
|
||||||
|
imageVector = Icons.Rounded.SkipNext,
|
||||||
|
contentDescription = "Next",
|
||||||
|
tint = MaterialTheme.colorScheme.onSurface,
|
||||||
|
modifier = Modifier.size(42.dp),
|
||||||
|
)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Spacer(
|
|
||||||
Modifier.fillMaxWidth().windowInsetsBottomHeight(WindowInsets.navigationBars).background(Color.Black),
|
|
||||||
)
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user