diff --git a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/components/BottomSheet.kt b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/components/BottomSheet.kt index b9b8232..f62668d 100644 --- a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/components/BottomSheet.kt +++ b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/components/BottomSheet.kt @@ -28,7 +28,6 @@ import androidx.compose.runtime.rememberCoroutineScope import androidx.compose.runtime.saveable.rememberSaveable import androidx.compose.runtime.setValue import androidx.compose.ui.Modifier -import androidx.compose.ui.draw.shadow import androidx.compose.ui.geometry.Offset import androidx.compose.ui.graphics.graphicsLayer import androidx.compose.ui.input.nestedscroll.NestedScrollConnection @@ -50,8 +49,6 @@ import kotlinx.coroutines.launch fun BottomSheet( state: BottomSheetState, modifier: Modifier = Modifier, - peekHeight: Dp = 0.dp, - elevation: Dp = 8.dp, onDismiss: (() -> Unit)? = null, collapsedContent: @Composable BoxScope.() -> Unit, content: @Composable BoxScope.() -> Unit @@ -59,12 +56,11 @@ fun BottomSheet( Box( modifier = modifier .offset { - val y = (state.expandedBound - state.value + peekHeight) + val y = (state.expandedBound - state.value) .roundToPx() .coerceAtLeast(0) IntOffset(x = 0, y = y) } - .shadow(elevation = elevation) .pointerInput(state) { var initialValue = 0.dp val velocityTracker = VelocityTracker() diff --git a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/styling/ColorPalette.kt b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/styling/ColorPalette.kt index 63d386e..14645cd 100644 --- a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/styling/ColorPalette.kt +++ b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/styling/ColorPalette.kt @@ -8,6 +8,7 @@ data class ColorPalette( val background: Color, val elevatedBackground: Color, val lightBackground: Color, + val backgroundContainer: Color, val text: Color, val textSecondary: Color, val textDisabled: Color, @@ -32,6 +33,7 @@ val DarkColorPalette = ColorPalette( background = Color(0xff16171d), lightBackground = Color(0xff1f2029), elevatedBackground = Color(0xff1f2029), + backgroundContainer = Color(0xff2b2d3b), text = Color(0xffe1e1e2), textSecondary = Color(0xffa3a4a6), textDisabled = Color(0xff6f6f73), @@ -44,7 +46,6 @@ val DarkColorPalette = ColorPalette( orange = Color(0xffe9a033), magenta = Color(0xffbb4da4), cyan = Color(0xFF4DA5BB), - primaryContainer = Color(0xff4046bf), onPrimaryContainer = Color.White, iconOnPrimaryContainer = Color.White, @@ -55,12 +56,14 @@ val BlackColorPalette = DarkColorPalette.copy( background = Color.Black, lightBackground = Color(0xff0d0d12), elevatedBackground = Color(0xff0d0d12), + backgroundContainer = Color(0xff0d0d12) ) val LightColorPalette = ColorPalette( background = Color(0xfffdfdfe), lightBackground = Color(0xFFf8f8fc), elevatedBackground = Color(0xfffdfdfe), + backgroundContainer = Color(0xffeaeaf5), lightGray = Color(0xfff8f8f8), gray = Color(0xFFE5E5E5), darkGray = Color(0xFF838383), @@ -73,12 +76,8 @@ val LightColorPalette = ColorPalette( orange = Color(0xffe8730e), magenta = Color(0xffbb4da4), cyan = Color(0xFF4DBBB2), - primaryContainer = Color(0xff4046bf), onPrimaryContainer = Color.White, iconOnPrimaryContainer = Color.White, -// primaryContainer = Color(0xffecedf9), -// onPrimaryContainer = Color(0xff121212), -// iconOnPrimaryContainer = Color(0xff2e30b8), isDark = false ) diff --git a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/views/PlayerBottomSheet.kt b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/views/PlayerBottomSheet.kt index deef3db..aeaa929 100644 --- a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/views/PlayerBottomSheet.kt +++ b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/views/PlayerBottomSheet.kt @@ -3,7 +3,6 @@ package it.vfsfitvnm.vimusic.ui.views import androidx.compose.animation.ExperimentalAnimationApi import androidx.compose.foundation.Image import androidx.compose.foundation.background -import androidx.compose.foundation.clickable import androidx.compose.foundation.layout.* import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment @@ -20,94 +19,32 @@ import it.vfsfitvnm.vimusic.ui.styling.LocalAppearance @Composable fun PlayerBottomSheet( layoutState: BottomSheetState, - isShowingLyrics: Boolean, - onShowLyrics: () -> Unit, - isShowingStatsForNerds: Boolean, - onShowStatsForNerds: () -> Unit, - onShowMenu: () -> Unit, onGlobalRouteEmitted: () -> Unit, modifier: Modifier = Modifier, + content: @Composable BoxScope.() -> Unit, ) { val (colorPalette) = LocalAppearance.current BottomSheet( state = layoutState, - elevation = 16.dp, modifier = modifier, collapsedContent = { - Row( - horizontalArrangement = Arrangement.SpaceBetween, - verticalAlignment = Alignment.CenterVertically, + Box( modifier = Modifier - .fillMaxSize() .background(colorPalette.background) + .fillMaxSize() ) { - Row( - modifier = Modifier - .padding(horizontal = 8.dp) - ) { - Spacer( - modifier = Modifier - .padding(all = 8.dp) - .size(20.dp) - ) - - Spacer( - modifier = Modifier - .padding(all = 8.dp) - .size(20.dp) - ) - - Spacer( - modifier = Modifier - .padding(all = 8.dp) - .size(20.dp) - ) - } - Image( painter = painterResource(R.drawable.chevron_up), contentDescription = null, colorFilter = ColorFilter.tint(colorPalette.text), modifier = Modifier + .align(Alignment.Center) .padding(all = 8.dp) .size(18.dp) ) - Row( - modifier = Modifier - .padding(horizontal = 8.dp) - ) { - Image( - painter = painterResource(R.drawable.text), - contentDescription = null, - colorFilter = ColorFilter.tint(if (isShowingLyrics) colorPalette.text else colorPalette.textDisabled), - modifier = Modifier - .clickable(onClick = onShowLyrics) - .padding(all = 8.dp) - .size(20.dp) - ) - - Image( - painter = painterResource(R.drawable.information), - contentDescription = null, - colorFilter = ColorFilter.tint(if (isShowingStatsForNerds) colorPalette.text else colorPalette.textDisabled), - modifier = Modifier - .clickable(onClick = onShowStatsForNerds) - .padding(all = 8.dp) - .size(20.dp) - ) - - Image( - painter = painterResource(R.drawable.ellipsis_horizontal), - contentDescription = null, - colorFilter = ColorFilter.tint(colorPalette.text), - modifier = Modifier - .clickable(onClick = onShowMenu) - .padding(all = 8.dp) - .size(20.dp) - ) - } + content() } } ) { diff --git a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/views/PlayerView.kt b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/views/PlayerView.kt index 1469dea..1336dc7 100644 --- a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/views/PlayerView.kt +++ b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/views/PlayerView.kt @@ -14,6 +14,7 @@ import androidx.compose.animation.AnimatedContentScope import androidx.compose.animation.AnimatedVisibility import androidx.compose.animation.ExperimentalAnimationApi import androidx.compose.animation.SizeTransform +import androidx.compose.animation.core.animateDpAsState import androidx.compose.animation.fadeIn import androidx.compose.animation.fadeOut import androidx.compose.animation.slideInVertically @@ -38,7 +39,6 @@ import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.size import androidx.compose.foundation.layout.width import androidx.compose.foundation.rememberScrollState -import androidx.compose.foundation.shape.CircleShape import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.foundation.text.BasicText import androidx.compose.foundation.verticalScroll @@ -162,10 +162,7 @@ fun PlayerView( drawLine( color = colorPalette.text, - start = Offset( - x = offset, - y = 1.dp.toPx() - ), + start = Offset(x = offset, y = 1.dp.toPx()), end = Offset( x = ((size.width - offset) * progress) + offset, y = 1.dp.toPx() @@ -201,31 +198,26 @@ fun PlayerView( ) } - if (shouldBePlaying) { - Image( - painter = painterResource(R.drawable.pause), - contentDescription = null, - colorFilter = ColorFilter.tint(colorPalette.text), - modifier = Modifier - .clickable(onClick = binder.player::pause) - .padding(vertical = 8.dp) - .padding(horizontal = 16.dp) - .size(22.dp) - ) - } else { - Image( - painter = painterResource(R.drawable.play), - contentDescription = null, - colorFilter = ColorFilter.tint(colorPalette.text), - modifier = Modifier - .clickable { + Box( + modifier = Modifier + .clickable { + if (shouldBePlaying) { + binder.player.pause() + } else { if (binder.player.playbackState == Player.STATE_IDLE) { binder.player.prepare() } binder.player.play() } - .padding(vertical = 8.dp) - .padding(horizontal = 16.dp) + } + .padding(horizontal = 16.dp, vertical = 8.dp) + ) { + Image( + painter = painterResource(if (shouldBePlaying) R.drawable.pause else R.drawable.play), + contentDescription = null, + colorFilter = ColorFilter.tint(colorPalette.text), + modifier = Modifier + .align(Alignment.Center) .size(22.dp) ) } @@ -316,70 +308,105 @@ fun PlayerView( PlayerBottomSheet( layoutState = rememberBottomSheetState(64.dp, layoutState.expandedBound), - isShowingLyrics = isShowingLyrics, - onShowLyrics = { - isShowingStatsForNerds = false - isShowingLyrics = !isShowingLyrics - }, - isShowingStatsForNerds = isShowingStatsForNerds, - onShowStatsForNerds = { - isShowingLyrics = false - isShowingStatsForNerds = !isShowingStatsForNerds - }, - onShowMenu = { - menuState.display { - val resultRegistryOwner = LocalActivityResultRegistryOwner.current + onGlobalRouteEmitted = layoutState::collapseSoft, + content = { + Row( + verticalAlignment = Alignment.CenterVertically, + horizontalArrangement = Arrangement.End, + modifier = Modifier + .align(Alignment.BottomEnd) + .padding(horizontal = 8.dp) + .fillMaxHeight() + ) { + Image( + painter = painterResource(R.drawable.text), + contentDescription = null, + colorFilter = ColorFilter.tint(if (isShowingLyrics) colorPalette.text else colorPalette.textDisabled), + modifier = Modifier + .clickable { + isShowingStatsForNerds = false + isShowingLyrics = !isShowingLyrics + } + .padding(all = 8.dp) + .size(20.dp) + ) - BaseMediaItemMenu( - mediaItem = mediaItem, - onStartRadio = { - binder.stopRadio() - binder.player.seamlessPlay(mediaItem) - binder.setupRadio( - NavigationEndpoint.Endpoint.Watch(videoId = mediaItem.mediaId) - ) - }, - onGoToEqualizer = { - val intent = - Intent(AudioEffect.ACTION_DISPLAY_AUDIO_EFFECT_CONTROL_PANEL).apply { - putExtra( - AudioEffect.EXTRA_AUDIO_SESSION, - binder.player.audioSessionId - ) - putExtra( - AudioEffect.EXTRA_PACKAGE_NAME, - context.packageName - ) - putExtra( - AudioEffect.EXTRA_CONTENT_TYPE, - AudioEffect.CONTENT_TYPE_MUSIC + Image( + painter = painterResource(R.drawable.information), + contentDescription = null, + colorFilter = ColorFilter.tint(if (isShowingStatsForNerds) colorPalette.text else colorPalette.textDisabled), + modifier = Modifier + .clickable { + isShowingLyrics = false + isShowingStatsForNerds = !isShowingStatsForNerds + } + .padding(all = 8.dp) + .size(20.dp) + ) + + Image( + painter = painterResource(R.drawable.ellipsis_horizontal), + contentDescription = null, + colorFilter = ColorFilter.tint(colorPalette.text), + modifier = Modifier + .clickable { + menuState.display { + val resultRegistryOwner = LocalActivityResultRegistryOwner.current + + BaseMediaItemMenu( + mediaItem = mediaItem, + onStartRadio = { + binder.stopRadio() + binder.player.seamlessPlay(mediaItem) + binder.setupRadio( + NavigationEndpoint.Endpoint.Watch(videoId = mediaItem.mediaId) + ) + }, + onGoToEqualizer = { + val intent = + Intent(AudioEffect.ACTION_DISPLAY_AUDIO_EFFECT_CONTROL_PANEL).apply { + putExtra( + AudioEffect.EXTRA_AUDIO_SESSION, + binder.player.audioSessionId + ) + putExtra( + AudioEffect.EXTRA_PACKAGE_NAME, + context.packageName + ) + putExtra( + AudioEffect.EXTRA_CONTENT_TYPE, + AudioEffect.CONTENT_TYPE_MUSIC + ) + } + + if (intent.resolveActivity(context.packageManager) != null) { + val contract = + ActivityResultContracts.StartActivityForResult() + + resultRegistryOwner?.activityResultRegistry + ?.register("", contract) {} + ?.launch(intent) + } else { + Toast + .makeText( + context, + "No equalizer app found!", + Toast.LENGTH_SHORT + ) + .show() + } + }, + onSetSleepTimer = {}, + onDismiss = menuState::hide, + onGlobalRouteEmitted = layoutState::collapseSoft, ) } - - if (intent.resolveActivity(context.packageManager) != null) { - val contract = - ActivityResultContracts.StartActivityForResult() - - resultRegistryOwner?.activityResultRegistry - ?.register("", contract) {} - ?.launch(intent) - } else { - Toast - .makeText( - context, - "No equalizer app found!", - Toast.LENGTH_SHORT - ) - .show() } - }, - onSetSleepTimer = {}, - onDismiss = menuState::hide, - onGlobalRouteEmitted = layoutState::collapseSoft, + .padding(all = 8.dp) + .size(20.dp) ) } }, - onGlobalRouteEmitted = layoutState::collapseSoft, modifier = Modifier .align(Alignment.BottomCenter) ) @@ -900,6 +927,8 @@ private fun Controls( Database.likedAt(mediaItem.mediaId).distinctUntilChanged() }.collectAsState(initial = null, context = Dispatchers.IO) + val playPauseRoundness by animateDpAsState(if (shouldBePlaying) 32.dp else 16.dp) + Column( horizontalAlignment = Alignment.CenterHorizontally, modifier = modifier @@ -949,7 +978,7 @@ private fun Controls( scrubbingPosition = null }, color = colorPalette.text, - backgroundColor = colorPalette.textDisabled, + backgroundColor = colorPalette.backgroundContainer, shape = RoundedCornerShape(8.dp) ) @@ -981,7 +1010,6 @@ private fun Controls( } } - Spacer( modifier = Modifier .weight(1f) @@ -1009,7 +1037,7 @@ private fun Controls( } } .weight(1f) - .size(28.dp) + .size(24.dp) ) Image( @@ -1019,7 +1047,7 @@ private fun Controls( modifier = Modifier .clickable(onClick = binder.player::seekToPrevious) .weight(1f) - .size(28.dp) + .size(24.dp) ) Spacer( @@ -1029,6 +1057,7 @@ private fun Controls( Box( modifier = Modifier + .clip(RoundedCornerShape(playPauseRoundness)) .clickable { if (shouldBePlaying) { binder.player.pause() @@ -1039,13 +1068,13 @@ private fun Controls( binder.player.play() } } - .background(color = colorPalette.text, shape = CircleShape) + .background(color = colorPalette.backgroundContainer) .size(64.dp) ) { Image( painter = painterResource(if (shouldBePlaying) R.drawable.pause else R.drawable.play), contentDescription = null, - colorFilter = ColorFilter.tint(colorPalette.background), + colorFilter = ColorFilter.tint(colorPalette.text), modifier = Modifier .align(Alignment.Center) .size(28.dp) @@ -1064,7 +1093,7 @@ private fun Controls( modifier = Modifier .clickable(onClick = binder.player::seekToNext) .weight(1f) - .size(28.dp) + .size(24.dp) ) Image( @@ -1093,7 +1122,7 @@ private fun Controls( } } .weight(1f) - .size(28.dp) + .size(24.dp) ) }