Tweak menu UI

This commit is contained in:
vfsfitvnm
2022-07-08 21:49:05 +02:00
parent 81c7edee24
commit cb29edc3b8
3 changed files with 14 additions and 11 deletions

View File

@@ -11,13 +11,15 @@ import androidx.compose.runtime.Composable
import androidx.compose.runtime.remember 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.alpha
import androidx.compose.ui.graphics.ColorFilter import androidx.compose.ui.graphics.ColorFilter
import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.painterResource
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import it.vfsfitvnm.vimusic.R import it.vfsfitvnm.vimusic.R
import it.vfsfitvnm.vimusic.ui.styling.LocalColorPalette import it.vfsfitvnm.vimusic.ui.styling.LocalColorPalette
import it.vfsfitvnm.vimusic.ui.styling.LocalTypography import it.vfsfitvnm.vimusic.ui.styling.LocalTypography
import it.vfsfitvnm.vimusic.utils.color import it.vfsfitvnm.vimusic.utils.medium
import it.vfsfitvnm.vimusic.utils.secondary
import it.vfsfitvnm.vimusic.utils.semiBold import it.vfsfitvnm.vimusic.utils.semiBold
@Composable @Composable
@@ -30,10 +32,10 @@ inline fun Menu(
Column( Column(
modifier = modifier modifier = modifier
.verticalScroll(rememberScrollState()) .verticalScroll(rememberScrollState())
.width(256.dp) .fillMaxWidth()
.background( .background(
color = colorPalette.elevatedBackground, color = colorPalette.elevatedBackground,
shape = RoundedCornerShape(topStart = 8.dp, topEnd = 8.dp) shape = RoundedCornerShape(topStart = 12.dp, topEnd = 12.dp)
) )
.padding(vertical = 8.dp), .padding(vertical = 8.dp),
content = content content = content
@@ -59,7 +61,7 @@ fun MenuEntry(
text: String, text: String,
onClick: () -> Unit, onClick: () -> Unit,
secondaryText: String? = null, secondaryText: String? = null,
enabled: Boolean = true, isEnabled: Boolean = true,
) { ) {
val colorPalette = LocalColorPalette.current val colorPalette = LocalColorPalette.current
val typography = LocalTypography.current val typography = LocalTypography.current
@@ -71,30 +73,31 @@ fun MenuEntry(
.clickable( .clickable(
indication = rememberRipple(bounded = true), indication = rememberRipple(bounded = true),
interactionSource = remember { MutableInteractionSource() }, interactionSource = remember { MutableInteractionSource() },
enabled = enabled, enabled = isEnabled,
onClick = onClick onClick = onClick
) )
.fillMaxWidth() .fillMaxWidth()
.alpha(if (isEnabled) 1f else 0.4f)
.padding(horizontal = 24.dp, vertical = 16.dp) .padding(horizontal = 24.dp, vertical = 16.dp)
) { ) {
Image( Image(
painter = painterResource(icon), painter = painterResource(icon),
contentDescription = null, contentDescription = null,
colorFilter = ColorFilter.tint(if (enabled) colorPalette.textSecondary else colorPalette.textDisabled), colorFilter = ColorFilter.tint(colorPalette.textSecondary),
modifier = Modifier modifier = Modifier
.size(18.dp) .size(16.dp)
) )
Column { Column {
BasicText( BasicText(
text = text, text = text,
style = typography.xs.semiBold.color(if (enabled) colorPalette.text else colorPalette.textDisabled) style = typography.xs.medium
) )
secondaryText?.let { secondaryText -> secondaryText?.let { secondaryText ->
BasicText( BasicText(
text = secondaryText, text = secondaryText,
style = typography.xxs.semiBold.color(if (enabled) colorPalette.textSecondary else colorPalette.textDisabled) style = typography.xxs.medium.secondary
) )
} }
} }

View File

@@ -119,7 +119,7 @@ fun BuiltInPlaylistScreen(
MenuEntry( MenuEntry(
icon = R.drawable.time, icon = R.drawable.time,
text = "Enqueue", text = "Enqueue",
enabled = songs.isNotEmpty(), isEnabled = songs.isNotEmpty(),
onClick = { onClick = {
menuState.hide() menuState.hide()
binder?.player?.enqueue(songs.map(DetailedSong::asMediaItem)) binder?.player?.enqueue(songs.map(DetailedSong::asMediaItem))

View File

@@ -153,7 +153,7 @@ fun LocalPlaylistScreen(
MenuEntry( MenuEntry(
icon = R.drawable.time, icon = R.drawable.time,
text = "Enqueue", text = "Enqueue",
enabled = playlistWithSongs.songs.isNotEmpty(), isEnabled = playlistWithSongs.songs.isNotEmpty(),
onClick = { onClick = {
menuState.hide() menuState.hide()
binder?.player?.enqueue(playlistWithSongs.songs.map(DetailedSong::asMediaItem)) binder?.player?.enqueue(playlistWithSongs.songs.map(DetailedSong::asMediaItem))