diff --git a/feature/media-send/src/main/java/org/signal/mediasend/screens/MediaSendMetrics.kt b/feature/media-send/src/main/java/org/signal/mediasend/screens/MediaSendMetrics.kt index a8160c0502..32a6cb946d 100644 --- a/feature/media-send/src/main/java/org/signal/mediasend/screens/MediaSendMetrics.kt +++ b/feature/media-send/src/main/java/org/signal/mediasend/screens/MediaSendMetrics.kt @@ -13,6 +13,7 @@ import androidx.compose.animation.fadeOut import androidx.compose.animation.shrinkVertically import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.ui.Alignment +import androidx.compose.ui.unit.Dp import androidx.compose.ui.unit.DpSize import androidx.compose.ui.unit.dp @@ -23,6 +24,8 @@ object MediaSendMetrics { val ControlEnterTransition: EnterTransition = fadeIn() val ControlExitTransition: ExitTransition = fadeOut() + val BottomBarMaxWidth: Dp = 624.dp + /** * For the bottom-most control of a bottom-aligned stack: the control slides off the bottom edge while giving up its * layout space at the same rate, so everything above it slides along with it as a unit. diff --git a/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/MediaEditScreen.kt b/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/MediaEditScreen.kt index 8fd42d7ed9..7d214a595b 100644 --- a/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/MediaEditScreen.kt +++ b/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/MediaEditScreen.kt @@ -376,7 +376,7 @@ internal fun MediaEditScreen( onEvent = onEvent, onNextClick = { onEvent(MediaEditScreenEvents.NextClick) }, modifier = Modifier - .widthIn(max = 624.dp) + .widthIn(max = MediaSendMetrics.BottomBarMaxWidth) .padding(horizontal = 16.dp) // Own padding rather than the stack's arrangement so the gap collapses along with the slide. .padding(top = 20.dp, bottom = 16.dp) @@ -521,7 +521,9 @@ private fun VideoTrimTimeline( Column( horizontalAlignment = Alignment.End, - modifier = Modifier.fillMaxWidth() + modifier = Modifier + .widthIn(max = MediaSendMetrics.BottomBarMaxWidth) + .fillMaxWidth() ) { VideoTrimBar( videoUri = videoUri, diff --git a/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/MediaEditorToolbar.kt b/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/MediaEditorToolbar.kt index cbaccbe2d0..03e384367f 100644 --- a/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/MediaEditorToolbar.kt +++ b/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/MediaEditorToolbar.kt @@ -8,6 +8,7 @@ package org.signal.mediasend.screens.edit import androidx.compose.foundation.background import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxHeight import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.height @@ -49,6 +50,8 @@ internal fun MediaEditorToolbar( Row(modifier = modifier.height(48.dp)) { leading() + Spacer(modifier = Modifier.weight(1f)) + Row( modifier = Modifier .fillMaxHeight() @@ -57,11 +60,15 @@ internal fun MediaEditorToolbar( content() } + Spacer(modifier = Modifier.weight(1f)) + trailing() } } else { Column(modifier = modifier.width(48.dp)) { - leading() + trailing() + + Spacer(modifier = Modifier.size(16.dp)) Column( modifier = Modifier @@ -71,7 +78,9 @@ internal fun MediaEditorToolbar( content() } - trailing() + Spacer(modifier = Modifier.size(16.dp)) + + leading() } } } diff --git a/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/image/ImageEditorClearAllButton.kt b/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/image/ImageEditorClearAllButton.kt index b2bd2971af..d77f2cddee 100644 --- a/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/image/ImageEditorClearAllButton.kt +++ b/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/image/ImageEditorClearAllButton.kt @@ -5,6 +5,8 @@ package org.signal.mediasend.screens.edit.image +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.material3.ButtonDefaults import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Text @@ -15,7 +17,6 @@ import androidx.compose.ui.res.stringResource import org.signal.core.ui.compose.Buttons import org.signal.core.ui.compose.DayNightPreviews import org.signal.core.ui.compose.Previews -import org.signal.core.ui.compose.theme.SignalTheme import org.signal.imageeditor.core.model.EditorModel import org.signal.mediasend.R import org.signal.mediasend.screens.edit.ImageController @@ -35,7 +36,7 @@ internal fun ImageEditorClearAllButton( ) { Buttons.MediumTonal( colors = ButtonDefaults.buttonColors( - containerColor = SignalTheme.colors.colorSurface5, + containerColor = MaterialTheme.colorScheme.surfaceVariant, contentColor = MaterialTheme.colorScheme.onSurface ), onClick = { @@ -51,10 +52,12 @@ internal fun ImageEditorClearAllButton( @Composable private fun ImageEditorClearAllButtonPreview() { Previews.Preview { - ImageEditorClearAllButton( - imageEditorController = remember { ImageController(EditorModel.create(0x0)).apply { enterDrawMode() } }, - isDragging = false, - canUndo = true - ) + Box(modifier = Modifier.fillMaxSize()) { + ImageEditorClearAllButton( + imageEditorController = remember { ImageController(EditorModel.create(0x0)).apply { enterDrawMode() } }, + isDragging = false, + canUndo = true + ) + } } } diff --git a/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/image/ImageEditorToolbar.kt b/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/image/ImageEditorToolbar.kt index 0eb2d7e323..833d1ef6a5 100644 --- a/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/image/ImageEditorToolbar.kt +++ b/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/image/ImageEditorToolbar.kt @@ -6,6 +6,8 @@ package org.signal.mediasend.screens.edit.image import androidx.compose.animation.Crossfade +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.size import androidx.compose.material3.Icon import androidx.compose.material3.MaterialTheme @@ -104,10 +106,10 @@ private fun ImageEditorDrawStateToolbar( MediaEditorToolbar( modifier = modifier, leading = { - CommitButton(imageEditorController) + DiscardButton(imageEditorController) }, trailing = { - DiscardButton(imageEditorController) + CommitButton(imageEditorController) } ) { ImageEditorToggleButton( @@ -161,10 +163,10 @@ private fun ImageEditorCropAndResizeToolbar( MediaEditorToolbar( modifier = modifier, leading = { - CommitButton(imageEditorController) + DiscardButton(imageEditorController) }, trailing = { - DiscardButton(imageEditorController) + CommitButton(imageEditorController) } ) { MediaEditorToolbarButton( @@ -285,14 +287,16 @@ private fun ImageEditorToggleButton( @Composable private fun ImageEditorNoneStateToolbarPreview() { Previews.Preview { - ImageEditorNoneStateToolbar( - imageEditorController = remember { - ImageController(EditorModel.create(0)) - }, - state = rememberPreviewState(), - editorState = remember { EditorState.Image(EditorModel.create(0)) }, - onEvent = {} - ) + Box(modifier = Modifier.fillMaxSize()) { + ImageEditorNoneStateToolbar( + imageEditorController = remember { + ImageController(EditorModel.create(0)) + }, + state = rememberPreviewState(), + editorState = remember { EditorState.Image(EditorModel.create(0)) }, + onEvent = {} + ) + } } } @@ -303,14 +307,16 @@ private fun ImageEditorNoneStateToolbarPreview() { @Composable private fun ImageEditorDrawStateToolbarPreview() { Previews.Preview { - ImageEditorDrawStateToolbar( - imageEditorController = remember { - ImageController(EditorModel.create(0)).apply { - enterDrawMode() - } - }, - onEvent = {} - ) + Box(modifier = Modifier.fillMaxSize()) { + ImageEditorDrawStateToolbar( + imageEditorController = remember { + ImageController(EditorModel.create(0)).apply { + enterDrawMode() + } + }, + onEvent = {} + ) + } } } @@ -321,13 +327,15 @@ private fun ImageEditorDrawStateToolbarPreview() { @Composable private fun ImageEditorCropAndResizeToolbarPreview() { Previews.Preview { - ImageEditorCropAndResizeToolbar( - imageEditorController = remember { - ImageController(EditorModel.create(0)).apply { - enterCropMode() + Box(modifier = Modifier.fillMaxSize()) { + ImageEditorCropAndResizeToolbar( + imageEditorController = remember { + ImageController(EditorModel.create(0)).apply { + enterCropMode() + } } - } - ) + ) + } } } diff --git a/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/image/ImageEditorUndoRedoButtons.kt b/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/image/ImageEditorUndoRedoButtons.kt index 652fd9e0e4..401b705e0d 100644 --- a/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/image/ImageEditorUndoRedoButtons.kt +++ b/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/image/ImageEditorUndoRedoButtons.kt @@ -6,10 +6,13 @@ package org.signal.mediasend.screens.edit.image import androidx.compose.foundation.layout.Arrangement.Absolute.spacedBy +import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.material3.Icon import androidx.compose.material3.IconButton import androidx.compose.material3.IconButtonDefaults +import androidx.compose.material3.MaterialTheme import androidx.compose.runtime.Composable import androidx.compose.runtime.remember import androidx.compose.ui.Modifier @@ -18,7 +21,6 @@ import androidx.compose.ui.unit.dp import org.signal.core.ui.compose.DayNightPreviews import org.signal.core.ui.compose.Previews import org.signal.core.ui.compose.SignalIcons -import org.signal.core.ui.compose.theme.SignalTheme import org.signal.imageeditor.core.model.EditorModel import org.signal.mediasend.R import org.signal.mediasend.screens.edit.ImageController @@ -43,7 +45,7 @@ internal fun ImageEditorUndoRedoButtons( onClick = { imageEditorController?.undo() }, - colors = IconButtonDefaults.iconButtonColors(containerColor = SignalTheme.colors.colorSurface5) + colors = IconButtonDefaults.iconButtonColors(containerColor = MaterialTheme.colorScheme.surfaceVariant) ) { Icon( imageVector = SignalIcons.Undo.imageVector, @@ -56,7 +58,7 @@ internal fun ImageEditorUndoRedoButtons( onClick = { imageEditorController?.redo() }, - colors = IconButtonDefaults.iconButtonColors(containerColor = SignalTheme.colors.colorSurface5) + colors = IconButtonDefaults.iconButtonColors(containerColor = MaterialTheme.colorScheme.surfaceVariant) ) { Icon( imageVector = SignalIcons.Redo.imageVector, @@ -71,15 +73,17 @@ internal fun ImageEditorUndoRedoButtons( @Composable private fun ImageEditorUndoRedoButtonsPreview() { Previews.Preview { - ImageEditorUndoRedoButtons( - imageEditorController = remember { - ImageController(EditorModel.create(0x0)).apply { - enterDrawMode() - } - }, - isDragging = false, - canUndo = true, - canRedo = true - ) + Box(modifier = Modifier.fillMaxSize()) { + ImageEditorUndoRedoButtons( + imageEditorController = remember { + ImageController(EditorModel.create(0x0)).apply { + enterDrawMode() + } + }, + isDragging = false, + canUndo = true, + canRedo = true + ) + } } } diff --git a/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/video/VideoTrimBar.kt b/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/video/VideoTrimBar.kt index e305478505..7d68194276 100644 --- a/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/video/VideoTrimBar.kt +++ b/feature/media-send/src/main/java/org/signal/mediasend/screens/edit/video/VideoTrimBar.kt @@ -50,6 +50,7 @@ fun VideoTrimBar( videoTrimData: VideoTrimData, maxSelectableDurationUs: Long = 0L, playbackPositionUs: Long = 0L, + modifier: Modifier = Modifier, onEvent: (MediaEditScreenEvents) -> Unit = {} ) { val currentOnEvent by rememberUpdatedState(onEvent) @@ -129,7 +130,7 @@ fun VideoTrimBar( selectorView.unregisterDragListener() selectorView.registerEditorOnRangeChangeListener(null) }, - modifier = Modifier + modifier = modifier .horizontalGutters() .height(48.dp) .fillMaxWidth()