Tweak manga cover dialog UI

Closes #8654, although it's just a workaround. The cover itself doesn't appear within the inset areas when zoomed.
This commit is contained in:
arkon 2022-12-04 12:55:58 -05:00
parent be854b3e90
commit d7a21771a5

View File

@ -7,12 +7,10 @@ import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.WindowInsets
import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.navigationBarsPadding import androidx.compose.foundation.layout.navigationBarsPadding
import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.systemBars
import androidx.compose.material.icons.Icons import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.outlined.Close import androidx.compose.material.icons.outlined.Close
import androidx.compose.material.icons.outlined.Edit import androidx.compose.material.icons.outlined.Edit
@ -31,6 +29,8 @@ import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.LocalDensity import androidx.compose.ui.platform.LocalDensity
import androidx.compose.ui.res.stringResource import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.DpOffset import androidx.compose.ui.unit.DpOffset
@ -69,81 +69,85 @@ fun MangaCoverDialog(
) { ) {
Scaffold( Scaffold(
snackbarHost = { SnackbarHost(hostState = snackbarHostState) }, snackbarHost = { SnackbarHost(hostState = snackbarHostState) },
containerColor = Color.Transparent,
bottomBar = { bottomBar = {
Row( Row(
modifier = Modifier modifier = Modifier
.fillMaxWidth() .fillMaxWidth()
.background(color = MaterialTheme.colorScheme.background.copy(alpha = 0.9f)) .padding(4.dp)
.padding(horizontal = 4.dp, vertical = 4.dp)
.navigationBarsPadding(), .navigationBarsPadding(),
) { ) {
IconButton(onClick = onDismissRequest) { ActionsPill {
Icon( IconButton(onClick = onDismissRequest) {
imageVector = Icons.Outlined.Close, Icon(
contentDescription = stringResource(R.string.action_close), imageVector = Icons.Outlined.Close,
) contentDescription = stringResource(R.string.action_close),
)
}
} }
Spacer(modifier = Modifier.weight(1f)) Spacer(modifier = Modifier.weight(1f))
IconButton(onClick = onShareClick) { ActionsPill {
Icon( IconButton(onClick = onShareClick) {
imageVector = Icons.Outlined.Share, Icon(
contentDescription = stringResource(R.string.action_share), imageVector = Icons.Outlined.Share,
) contentDescription = stringResource(R.string.action_share),
} )
IconButton(onClick = onSaveClick) { }
Icon( IconButton(onClick = onSaveClick) {
imageVector = Icons.Outlined.Save, Icon(
contentDescription = stringResource(R.string.action_save), imageVector = Icons.Outlined.Save,
) contentDescription = stringResource(R.string.action_save),
} )
if (onEditClick != null) { }
Box { if (onEditClick != null) {
var expanded by remember { mutableStateOf(false) } Box {
IconButton( var expanded by remember { mutableStateOf(false) }
onClick = { IconButton(
if (isCustomCover) {
expanded = true
} else {
onEditClick(EditCoverAction.EDIT)
}
},
) {
Icon(
imageVector = Icons.Outlined.Edit,
contentDescription = stringResource(R.string.action_edit_cover),
)
}
DropdownMenu(
expanded = expanded,
onDismissRequest = { expanded = false },
offset = DpOffset(8.dp, 0.dp),
) {
DropdownMenuItem(
text = { Text(text = stringResource(R.string.action_edit)) },
onClick = { onClick = {
onEditClick(EditCoverAction.EDIT) if (isCustomCover) {
expanded = false expanded = true
} else {
onEditClick(EditCoverAction.EDIT)
}
}, },
) ) {
DropdownMenuItem( Icon(
text = { Text(text = stringResource(R.string.action_delete)) }, imageVector = Icons.Outlined.Edit,
onClick = { contentDescription = stringResource(R.string.action_edit_cover),
onEditClick(EditCoverAction.DELETE) )
expanded = false }
}, DropdownMenu(
) expanded = expanded,
onDismissRequest = { expanded = false },
offset = DpOffset(8.dp, 0.dp),
) {
DropdownMenuItem(
text = { Text(text = stringResource(R.string.action_edit)) },
onClick = {
onEditClick(EditCoverAction.EDIT)
expanded = false
},
)
DropdownMenuItem(
text = { Text(text = stringResource(R.string.action_delete)) },
onClick = {
onEditClick(EditCoverAction.DELETE)
expanded = false
},
)
}
} }
} }
} }
} }
}, },
) { contentPadding -> ) { contentPadding ->
val statusBarPaddingPx = WindowInsets.systemBars.getTop(LocalDensity.current) val statusBarPaddingPx = with(LocalDensity.current) { contentPadding.calculateTopPadding().roundToPx() }
val bottomPaddingPx = with(LocalDensity.current) { contentPadding.calculateBottomPadding().roundToPx() } val bottomPaddingPx = with(LocalDensity.current) { contentPadding.calculateBottomPadding().roundToPx() }
Box( Box(
modifier = Modifier modifier = Modifier
.fillMaxSize() .fillMaxSize()
.background(color = MaterialTheme.colorScheme.background)
.clickableNoIndication(onClick = onDismissRequest), .clickableNoIndication(onClick = onDismissRequest),
) { ) {
AndroidView( AndroidView(
@ -185,3 +189,14 @@ fun MangaCoverDialog(
} }
} }
} }
@Composable
private fun ActionsPill(content: @Composable () -> Unit) {
Row(
modifier = Modifier
.clip(MaterialTheme.shapes.extraLarge)
.background(MaterialTheme.colorScheme.background.copy(alpha = 0.95f)),
) {
content()
}
}