From 23dcce88ab0111845fddc67ccc6384f8da4ed8d8 Mon Sep 17 00:00:00 2001 From: vfsfitvnm Date: Sat, 8 Oct 2022 16:02:57 +0200 Subject: [PATCH] Minor UI tweaks --- .../ui/components/themed/MediaItemMenu.kt | 1 + .../ui/components/themed/NavigationRail.kt | 13 +- .../vimusic/ui/components/themed/Scaffold.kt | 56 ++++---- .../builtinplaylist/BuiltInPlaylistSongs.kt | 12 +- .../localplaylist/LocalPlaylistSongs.kt | 7 +- .../vimusic/ui/screens/player/Lyrics.kt | 132 +++++++++--------- 6 files changed, 119 insertions(+), 102 deletions(-) diff --git a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/components/themed/MediaItemMenu.kt b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/components/themed/MediaItemMenu.kt index ac25051..b361020 100644 --- a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/components/themed/MediaItemMenu.kt +++ b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/components/themed/MediaItemMenu.kt @@ -561,6 +561,7 @@ fun MediaItemMenu( DialogTextButton( text = "Set", enabled = amount > 0, + primary = true, onClick = { binder?.startSleepTimer(amount * 10 * 60 * 1000L) isShowingSleepTimerDialog = false diff --git a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/components/themed/NavigationRail.kt b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/components/themed/NavigationRail.kt index 5f60823..7f37369 100644 --- a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/components/themed/NavigationRail.kt +++ b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/components/themed/NavigationRail.kt @@ -15,6 +15,7 @@ import androidx.compose.foundation.layout.offset import androidx.compose.foundation.layout.only 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 @@ -34,6 +35,8 @@ import androidx.compose.ui.unit.dp import it.vfsfitvnm.vimusic.LocalPlayerAwareWindowInsets import it.vfsfitvnm.vimusic.ui.styling.Dimensions import it.vfsfitvnm.vimusic.ui.styling.LocalAppearance +import it.vfsfitvnm.vimusic.utils.center +import it.vfsfitvnm.vimusic.utils.color import it.vfsfitvnm.vimusic.utils.isLandscape import it.vfsfitvnm.vimusic.utils.semiBold @@ -83,7 +86,11 @@ inline fun NavigationRail( ) } - Column(horizontalAlignment = Alignment.CenterHorizontally) { + Column( + horizontalAlignment = Alignment.CenterHorizontally, + modifier = Modifier + .width(if (isLandscape) Dimensions.navigationRailWidthLandscape else Dimensions.navigationRailWidth) + ) { val transition = updateTransition(targetState = tabIndex, label = null) content { index, text, icon -> @@ -114,7 +121,7 @@ inline fun NavigationRail( val textContent: @Composable () -> Unit = { BasicText( text = text, - style = typography.xs.semiBold.copy(color = textColor), + style = typography.xs.semiBold.center.color(textColor), modifier = Modifier .vertical(enabled = !isLandscape) .rotate(if (isLandscape) 0f else -90f) @@ -153,7 +160,7 @@ inline fun NavigationRail( fun Modifier.vertical(enabled: Boolean = true) = if (enabled) layout { measurable, constraints -> - val placeable = measurable.measure(constraints) + val placeable = measurable.measure(constraints.copy(maxWidth = Int.MAX_VALUE)) layout(placeable.height, placeable.width) { placeable.place( x = -(placeable.width / 2 - placeable.height / 2), diff --git a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/components/themed/Scaffold.kt b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/components/themed/Scaffold.kt index ecc0d91..3f71da7 100644 --- a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/components/themed/Scaffold.kt +++ b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/components/themed/Scaffold.kt @@ -9,7 +9,6 @@ import androidx.compose.animation.core.VisibilityThreshold import androidx.compose.animation.core.spring import androidx.compose.animation.with import androidx.compose.foundation.background -import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.ColumnScope import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.fillMaxSize @@ -31,42 +30,37 @@ fun Scaffold( ) { val (colorPalette) = LocalAppearance.current - Box( + Row( modifier = modifier .background(colorPalette.background0) .fillMaxSize() ) { - Row( - modifier = modifier - .fillMaxSize() - ) { - NavigationRail( - topIconButtonId = topIconButtonId, - onTopIconButtonClick = onTopIconButtonClick, - tabIndex = tabIndex, - onTabIndexChanged = onTabChanged, - content = tabColumnContent - ) + NavigationRail( + topIconButtonId = topIconButtonId, + onTopIconButtonClick = onTopIconButtonClick, + tabIndex = tabIndex, + onTabIndexChanged = onTabChanged, + content = tabColumnContent + ) - AnimatedContent( - targetState = tabIndex, - transitionSpec = { - val slideDirection = when (targetState > initialState) { - true -> AnimatedContentScope.SlideDirection.Up - false -> AnimatedContentScope.SlideDirection.Down - } + AnimatedContent( + targetState = tabIndex, + transitionSpec = { + val slideDirection = when (targetState > initialState) { + true -> AnimatedContentScope.SlideDirection.Up + false -> AnimatedContentScope.SlideDirection.Down + } - val animationSpec = spring( - dampingRatio = 0.9f, - stiffness = Spring.StiffnessLow, - visibilityThreshold = IntOffset.VisibilityThreshold - ) + val animationSpec = spring( + dampingRatio = 0.9f, + stiffness = Spring.StiffnessLow, + visibilityThreshold = IntOffset.VisibilityThreshold + ) - slideIntoContainer(slideDirection, animationSpec) with - slideOutOfContainer(slideDirection, animationSpec) - }, - content = content - ) - } + slideIntoContainer(slideDirection, animationSpec) with + slideOutOfContainer(slideDirection, animationSpec) + }, + content = content + ) } } diff --git a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/screens/builtinplaylist/BuiltInPlaylistSongs.kt b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/screens/builtinplaylist/BuiltInPlaylistSongs.kt index 7b5e865..98543c8 100644 --- a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/screens/builtinplaylist/BuiltInPlaylistSongs.kt +++ b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/screens/builtinplaylist/BuiltInPlaylistSongs.kt @@ -6,18 +6,20 @@ import androidx.compose.foundation.background import androidx.compose.foundation.combinedClickable import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.WindowInsetsSides +import androidx.compose.foundation.layout.asPaddingValues import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.foundation.layout.only +import androidx.compose.foundation.layout.padding import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.lazy.itemsIndexed import androidx.compose.foundation.lazy.rememberLazyListState import androidx.compose.runtime.Composable import androidx.compose.runtime.getValue import androidx.compose.ui.Modifier +import androidx.compose.ui.unit.dp import it.vfsfitvnm.vimusic.Database import it.vfsfitvnm.vimusic.LocalPlayerAwareWindowInsets -import androidx.compose.foundation.layout.WindowInsetsSides -import androidx.compose.foundation.layout.asPaddingValues -import androidx.compose.foundation.layout.only import it.vfsfitvnm.vimusic.LocalPlayerServiceBinder import it.vfsfitvnm.vimusic.R import it.vfsfitvnm.vimusic.enums.BuiltInPlaylist @@ -93,7 +95,9 @@ fun BuiltInPlaylistSongs(builtInPlaylist: BuiltInPlaylist) { title = when (builtInPlaylist) { BuiltInPlaylist.Favorites -> "Favorites" BuiltInPlaylist.Offline -> "Offline" - } + }, + modifier = Modifier + .padding(bottom = 8.dp) ) { SecondaryTextButton( text = "Enqueue", diff --git a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/screens/localplaylist/LocalPlaylistSongs.kt b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/screens/localplaylist/LocalPlaylistSongs.kt index 6f85e27..3b1287e 100644 --- a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/screens/localplaylist/LocalPlaylistSongs.kt +++ b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/screens/localplaylist/LocalPlaylistSongs.kt @@ -28,6 +28,7 @@ import it.vfsfitvnm.vimusic.LocalPlayerAwareWindowInsets import androidx.compose.foundation.layout.WindowInsetsSides import androidx.compose.foundation.layout.asPaddingValues import androidx.compose.foundation.layout.only +import androidx.compose.foundation.layout.padding import it.vfsfitvnm.vimusic.LocalPlayerServiceBinder import it.vfsfitvnm.vimusic.R import it.vfsfitvnm.vimusic.models.DetailedSong @@ -151,7 +152,11 @@ fun LocalPlaylistSongs( key = "header", contentType = 0 ) { - Header(title = playlistWithSongs?.playlist?.name ?: "Unknown") { + Header( + title = playlistWithSongs?.playlist?.name ?: "Unknown", + modifier = Modifier + .padding(bottom = 8.dp) + ) { SecondaryTextButton( text = "Enqueue", enabled = playlistWithSongs?.songs?.isNotEmpty() == true, diff --git a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/screens/player/Lyrics.kt b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/screens/player/Lyrics.kt index 8c3fa99..e8c8789 100644 --- a/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/screens/player/Lyrics.kt +++ b/app/src/main/kotlin/it/vfsfitvnm/vimusic/ui/screens/player/Lyrics.kt @@ -12,6 +12,7 @@ import androidx.compose.foundation.Image import androidx.compose.foundation.background import androidx.compose.foundation.clickable import androidx.compose.foundation.gestures.detectTapGestures +import androidx.compose.foundation.interaction.MutableInteractionSource import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.PaddingValues import androidx.compose.foundation.layout.fillMaxSize @@ -24,6 +25,7 @@ import androidx.compose.foundation.lazy.rememberLazyListState import androidx.compose.foundation.rememberScrollState import androidx.compose.foundation.text.BasicText import androidx.compose.foundation.verticalScroll +import androidx.compose.material.ripple.rememberRipple import androidx.compose.runtime.Composable import androidx.compose.runtime.LaunchedEffect import androidx.compose.runtime.getValue @@ -296,76 +298,80 @@ fun Lyrics( colorFilter = ColorFilter.tint(DefaultDarkColorPalette.text), modifier = Modifier .padding(all = 4.dp) - .clickable { - menuState.display { - Menu { - MenuEntry( - icon = R.drawable.time, - text = "Show ${if (isShowingSynchronizedLyrics) "un" else ""}synchronized lyrics", - secondaryText = if (isShowingSynchronizedLyrics) null else "Provided by kugou.com", - onClick = { - menuState.hide() - isShowingSynchronizedLyrics = - !isShowingSynchronizedLyrics - } - ) - - MenuEntry( - icon = R.drawable.pencil, - text = "Edit lyrics", - onClick = { - menuState.hide() - isEditing = true - } - ) - - MenuEntry( - icon = R.drawable.search, - text = "Search lyrics online", - onClick = { - menuState.hide() - val mediaMetadata = mediaMetadataProvider() - - val intent = - Intent(Intent.ACTION_WEB_SEARCH).apply { - putExtra( - SearchManager.QUERY, - "${mediaMetadata.title} ${mediaMetadata.artist} lyrics" - ) - } - - if (intent.resolveActivity(context.packageManager) != null) { - context.startActivity(intent) - } else { - Toast - .makeText( - context, - "No browser app found!", - Toast.LENGTH_SHORT - ) - .show() + .clickable( + indication = rememberRipple(bounded = false), + interactionSource = remember { MutableInteractionSource() }, + onClick = { + menuState.display { + Menu { + MenuEntry( + icon = R.drawable.time, + text = "Show ${if (isShowingSynchronizedLyrics) "un" else ""}synchronized lyrics", + secondaryText = if (isShowingSynchronizedLyrics) null else "Provided by kugou.com", + onClick = { + menuState.hide() + isShowingSynchronizedLyrics = + !isShowingSynchronizedLyrics } - } - ) + ) - MenuEntry( - icon = R.drawable.download, - text = "Fetch lyrics again", - enabled = lyrics != null, - onClick = { - menuState.hide() - query { - if (isShowingSynchronizedLyrics) { - Database.updateSynchronizedLyrics(mediaId, null) + MenuEntry( + icon = R.drawable.pencil, + text = "Edit lyrics", + onClick = { + menuState.hide() + isEditing = true + } + ) + + MenuEntry( + icon = R.drawable.search, + text = "Search lyrics online", + onClick = { + menuState.hide() + val mediaMetadata = mediaMetadataProvider() + + val intent = + Intent(Intent.ACTION_WEB_SEARCH).apply { + putExtra( + SearchManager.QUERY, + "${mediaMetadata.title} ${mediaMetadata.artist} lyrics" + ) + } + + if (intent.resolveActivity(context.packageManager) != null) { + context.startActivity(intent) } else { - Database.updateLyrics(mediaId, null) + Toast + .makeText( + context, + "No browser app found!", + Toast.LENGTH_SHORT + ) + .show() } } - } - ) + ) + + MenuEntry( + icon = R.drawable.download, + text = "Fetch lyrics again", + enabled = lyrics != null, + onClick = { + menuState.hide() + query { + if (isShowingSynchronizedLyrics) { + Database.updateSynchronizedLyrics(mediaId, null) + } else { + Database.updateLyrics(mediaId, null) + } + } + } + ) + } } } - } + ) .padding(all = 8.dp) .size(20.dp) .align(Alignment.BottomEnd)