tint the library header with the now playing surface colour

This commit is contained in:
austinried
2026-10-04 00:29:54 +00:00
parent 702bbe133a
commit da7af592d6
4 changed files with 182 additions and 164 deletions
@@ -21,6 +21,7 @@ import androidx.compose.foundation.layout.consumeWindowInsets
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.navigationBars
import androidx.compose.runtime.Composable
import androidx.compose.runtime.CompositionLocalProvider
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableFloatStateOf
@@ -55,6 +56,8 @@ import com.subtracks.ui.playback.NowPlayingRoute
import com.subtracks.ui.playback.QueueRoute
import com.subtracks.ui.settings.AddSourceRoute
import com.subtracks.ui.settings.SettingsRoute
import com.subtracks.ui.theme.LocalPlayerSurfaceColor
import com.subtracks.ui.theme.playerSurfaceColor
import com.subtracks.ui.theme.rememberArtworkColors
import kotlinx.coroutines.Job
import kotlinx.coroutines.flow.SharingStarted
@@ -143,9 +146,13 @@ private fun MainNavigation() {
nowPlayingProgress = 0f
}
}
val miniArt = playbackController.coverArt(playback.item, thumbnail = true)
val miniArtwork = rememberArtworkColors(miniArt)
val playerSurface = playerSurfaceColor(miniArtwork)
val density = LocalDensity.current
val navBarInset = with(density) { WindowInsets.navigationBars.getBottom(this).toDp() }
CompositionLocalProvider(LocalPlayerSurfaceColor provides playerSurface) {
Box(Modifier.fillMaxSize()) {
Column(Modifier.fillMaxSize()) {
NavHost(
@@ -254,11 +261,10 @@ private fun MainNavigation() {
}
if (playerVisible) {
val miniArt = playbackController.coverArt(playback.item, thumbnail = true)
MiniPlayer(
state = playback,
coverArt = miniArt,
artwork = rememberArtworkColors(miniArt),
artwork = miniArtwork,
onExpand = { settleNowPlaying(true) },
onPlayPause = playbackController::togglePlayPause,
onNext = playbackController::next,
@@ -314,6 +320,7 @@ private fun MainNavigation() {
)
}
}
}
BackHandler(enabled = showingQueue) { showingQueue = false }
BackHandler(enabled = nowPlayingOpen && !showingQueue) {
@@ -51,6 +51,7 @@ import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.draw.clipToBounds
import androidx.compose.ui.geometry.Rect
import androidx.compose.ui.graphics.isSpecified
import androidx.compose.ui.graphics.lerp
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.input.nestedscroll.nestedScroll
@@ -68,6 +69,7 @@ import com.subtracks.data.model.Artist
import com.subtracks.data.model.CoverArtRef
import com.subtracks.data.model.Playlist
import com.subtracks.data.model.SongListItem
import com.subtracks.ui.theme.LocalPlayerSurfaceColor
import org.koin.compose.viewmodel.koinViewModel
import kotlin.math.abs
import kotlin.math.roundToInt
@@ -167,6 +169,10 @@ fun LibraryScreen(
val titleFraction = scrollBehavior.state.collapsedFraction
val statusBarTop = with(density) { WindowInsets.statusBars.getTop(this).toDp() }
val headerColor =
LocalPlayerSurfaceColor.current.let {
if (it.isSpecified) it else MaterialTheme.colorScheme.surfaceContainerHigh
}
Column(
modifier =
@@ -179,7 +185,7 @@ fun LibraryScreen(
modifier =
Modifier
.fillMaxWidth()
.background(MaterialTheme.colorScheme.surfaceContainerHigh)
.background(headerColor)
.padding(top = statusBarTop),
) {
Box(
@@ -36,13 +36,13 @@ import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.geometry.CornerRadius
import androidx.compose.ui.geometry.Size
import androidx.compose.ui.graphics.lerp
import androidx.compose.ui.unit.dp
import com.subtracks.data.model.CoverArtRef
import com.subtracks.playback.PlaybackState
import com.subtracks.ui.components.CoverArt
import com.subtracks.ui.theme.ArtworkColors
import com.subtracks.ui.theme.ArtworkTheme
import com.subtracks.ui.theme.playerSurfaceColor
@Composable
fun MiniPlayer(
@@ -63,7 +63,7 @@ fun MiniPlayer(
ArtworkTheme(artwork) {
Surface(
color =
artwork?.let { lerp(it.scheme.surfaceContainerHigh, it.gradientHigh, 0.5f) }
artwork?.let(::playerSurfaceColor)
?: MaterialTheme.colorScheme.surfaceContainerHigh,
contentColor = MaterialTheme.colorScheme.onSurface,
modifier =
@@ -7,6 +7,7 @@ import androidx.compose.material3.darkColorScheme
import androidx.compose.runtime.Composable
import androidx.compose.runtime.Immutable
import androidx.compose.runtime.State
import androidx.compose.runtime.compositionLocalOf
import androidx.compose.runtime.getValue
import androidx.compose.runtime.produceState
import androidx.compose.runtime.remember
@@ -205,6 +206,10 @@ fun ArtworkTheme(
}
}
val LocalPlayerSurfaceColor = compositionLocalOf { Color.Unspecified }
fun playerSurfaceColor(artwork: ArtworkColors): Color = lerp(artwork.scheme.surfaceContainerHigh, artwork.gradientHigh, 0.5f)
@Composable
fun HeroGradient(
colors: ArtworkColors?,