diff --git a/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/CreateScreen.kt b/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/CreateScreen.kt index c9019d2a..cebd2f9c 100644 --- a/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/CreateScreen.kt +++ b/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/CreateScreen.kt @@ -2,16 +2,15 @@ package com.codekotliners.memify.features.create.presentation.ui import android.content.Intent import androidx.compose.animation.AnimatedVisibility +import androidx.compose.animation.core.animateFloatAsState import androidx.compose.foundation.Image import androidx.compose.foundation.background import androidx.compose.foundation.clickable import androidx.compose.foundation.gestures.rememberTransformableState import androidx.compose.foundation.gestures.transformable -import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.PaddingValues -import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.WindowInsets import androidx.compose.foundation.layout.aspectRatio @@ -20,9 +19,8 @@ import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.size +import androidx.compose.foundation.layout.wrapContentHeight import androidx.compose.foundation.layout.wrapContentSize -import androidx.compose.foundation.lazy.LazyColumn -import androidx.compose.foundation.shape.CircleShape import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.material.icons.Icons import androidx.compose.material.icons.filled.KeyboardArrowDown @@ -58,7 +56,6 @@ import androidx.compose.runtime.setValue import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.drawWithContent -import androidx.compose.ui.geometry.Offset import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.ImageBitmap import androidx.compose.ui.graphics.asAndroidBitmap @@ -68,7 +65,6 @@ import androidx.compose.ui.graphics.layer.drawLayer import androidx.compose.ui.graphics.rememberGraphicsLayer import androidx.compose.ui.layout.ContentScale import androidx.compose.ui.platform.LocalContext -import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource import androidx.compose.ui.text.font.Font import androidx.compose.ui.text.font.FontFamily @@ -87,7 +83,6 @@ import com.codekotliners.memify.core.ui.components.AppScaffold import com.codekotliners.memify.features.create.presentation.ui.components.ActionsRow import com.codekotliners.memify.features.create.presentation.ui.components.DrawingRow import com.codekotliners.memify.features.create.presentation.ui.components.EditingCanvasElements -import com.codekotliners.memify.features.create.presentation.ui.components.InstrumentsTextBox import com.codekotliners.memify.features.create.presentation.ui.components.TextEditingRow import com.codekotliners.memify.features.create.presentation.ui.components.TextInputDialog import com.codekotliners.memify.features.create.presentation.viewmodel.CanvasViewModel @@ -181,15 +176,21 @@ private fun CreateScreenBottomSheet( val bitmapState = remember { mutableStateOf(null) } val isPublishing by viewModelViewer.isPublishing.collectAsState() + var scale by remember { mutableFloatStateOf(1f) } + BottomSheetScaffold( topBar = { CreateScreenTopBar( scrollBehavior, onMenuClick = { - coroutineScope.launch { - showImageViewer.value = true - val bitmapCompose = graphicsLayer.toImageBitmap() - bitmapState.value = bitmapCompose + if (scale == 1f) { + coroutineScope.launch { + showImageViewer.value = true + val bitmapCompose = graphicsLayer.toImageBitmap() + bitmapState.value = bitmapCompose + } + } else { + scale = 1f } }, ) @@ -206,13 +207,20 @@ private fun CreateScreenBottomSheet( coroutineScope.launch { bottomSheetState.partialExpand() } + viewModel.clearCanvas() }, ) }, sheetPeekHeight = 58.dp, sheetSwipeEnabled = true, ) { innerPadding -> - CreateScreenContent(innerPadding, viewModel, graphicsLayer) + CreateScreenContent( + innerPadding, + viewModel, + graphicsLayer, + scale, + onScaleChange = { newScale -> scale = newScale }, + ) if (showImageViewer.value && bitmapState.value != null) { ImagePreviewDialog( @@ -342,20 +350,22 @@ private fun CreateScreenTopBar(scrollBehavior: TopAppBarScrollBehavior, onMenuCl } @Composable -private fun CreateScreenContent(innerPadding: PaddingValues, viewModel: CanvasViewModel, graphicsLayer: GraphicsLayer) { - LazyColumn( +private fun CreateScreenContent( + innerPadding: PaddingValues, + viewModel: CanvasViewModel, + graphicsLayer: GraphicsLayer, + scale: Float, + onScaleChange: (Float) -> Unit, +) { + Column( modifier = Modifier .fillMaxSize() .padding(innerPadding) .background(MaterialTheme.colorScheme.background), horizontalAlignment = Alignment.CenterHorizontally, - contentPadding = PaddingValues(bottom = 80.dp), ) { - item { ActionsRow(viewModel) } - item { - InteractiveCanvas(viewModel, graphicsLayer) - } + InteractiveCanvas(viewModel, graphicsLayer, scale, onScaleChange) } } @@ -385,7 +395,12 @@ fun BottomSheetHandle(bottomSheetState: SheetState) { } @Composable -private fun InteractiveCanvas(viewModel: CanvasViewModel, graphicsLayer: GraphicsLayer) { +private fun InteractiveCanvas( + viewModel: CanvasViewModel, + graphicsLayer: GraphicsLayer, + scale: Float, + onScaleChange: (Float) -> Unit, +) { val context = LocalContext.current val painter = rememberAsyncImagePainter( @@ -405,107 +420,32 @@ private fun InteractiveCanvas(viewModel: CanvasViewModel, graphicsLayer: Graphic } } - Column( - modifier = Modifier.fillMaxWidth(), - horizontalAlignment = Alignment.CenterHorizontally, - verticalArrangement = Arrangement.spacedBy(10.dp), - ) { - Tools(viewModel) - - ImageBox(viewModel, graphicsLayer, painter) - - if (viewModel.showTextInput) { - TextInputDialog(viewModel) - } - - AnimatedVisibility( - visible = (viewModel.isPaintingEnabled == false && viewModel.isWritingEnabled == false), - ) { - InstrumentsTextBox() - } - - AnimatedVisibility(visible = viewModel.isPaintingEnabled) { - DrawingRow(viewModel) - } - - AnimatedVisibility(visible = viewModel.isWritingEnabled) { - TextEditingRow(viewModel) - } - } -} - -@Composable -private fun Tools(viewModel: CanvasViewModel) { - Row( - modifier = - Modifier - .padding(16.dp) - .background(MaterialTheme.colorScheme.surface, CircleShape) - .padding(8.dp), - horizontalArrangement = Arrangement.spacedBy(8.dp), + Box( + modifier = Modifier.fillMaxSize(), ) { - // Состояния - val isPaintSelected = viewModel.isPaintingEnabled - val isWriteSelected = viewModel.isWritingEnabled - - // Кнопка Paint - IconButton( - onClick = { - viewModel.isPaintingEnabled = !viewModel.isPaintingEnabled - viewModel.isWritingEnabled = false - }, - modifier = - Modifier - .size(48.dp) - .background( - if (isPaintSelected) { - MaterialTheme.colorScheme.primary - } else { - MaterialTheme.colorScheme.background - }, - CircleShape, - ), - ) { - Icon( - painter = painterResource(R.drawable.baseline_brush_24), - contentDescription = "Paint", - tint = - if (isPaintSelected) { - MaterialTheme.colorScheme.onPrimary - } else { - MaterialTheme.colorScheme.onSurface - }, - ) - } + Box( + modifier = Modifier.fillMaxSize(), + contentAlignment = Alignment.Center, + ) { ImageBox(viewModel, graphicsLayer, painter, scale, onScaleChange) } - // Кнопка Write - IconButton( - onClick = { - viewModel.isWritingEnabled = !viewModel.isWritingEnabled - viewModel.isPaintingEnabled = false - }, + Column( modifier = Modifier - .size(48.dp) - .background( - if (isWriteSelected) { - MaterialTheme.colorScheme.primary - } else { - MaterialTheme.colorScheme.background - }, - CircleShape, - ), + .align(Alignment.TopCenter) + .fillMaxWidth() + .wrapContentHeight(), + horizontalAlignment = Alignment.CenterHorizontally, ) { - Icon( - painter = painterResource(R.drawable.round_text_fields_24), - contentDescription = "Write", - tint = - if (isWriteSelected) { - MaterialTheme.colorScheme.onPrimary - } else { - MaterialTheme.colorScheme.onSurface - }, - ) + ActionsRow(viewModel) + AnimatedVisibility(visible = viewModel.isWritingEnabled) { + TextEditingRow(viewModel) + } + AnimatedVisibility(visible = viewModel.isPaintingEnabled) { + DrawingRow(viewModel) + } + if (viewModel.showTextInput) { + TextInputDialog(viewModel) + } } } } @@ -515,46 +455,43 @@ private fun ImageBox( viewModel: CanvasViewModel, graphicsLayer: GraphicsLayer, painter: AsyncImagePainter, + scale: Float, + onScaleChange: (Float) -> Unit, ) { - var scale by remember { mutableFloatStateOf(1f) } - var angle by remember { mutableFloatStateOf(0f) } - var offset by remember { mutableStateOf(Offset.Zero) } + val animatedScale = animateFloatAsState(targetValue = scale) val state = - rememberTransformableState { scaleChange, offsetChange, rotationChange -> - scale *= scaleChange - angle += rotationChange - offset += offsetChange + rememberTransformableState { scaleChange, _, _ -> + onScaleChange(scale * scaleChange) + } + + val aspectRatio = + if (viewModel.imageWidth > 0 && viewModel.imageHeight > 0) { + viewModel.imageWidth / viewModel.imageHeight + } else { + 1f } Box( modifier = Modifier .fillMaxWidth() - .aspectRatio( - if (viewModel.imageWidth > 0 && viewModel.imageHeight > 0) { - viewModel.imageWidth / viewModel.imageHeight - } else { - // Дефолтное соотношение, пока не загрузилось - 1f - }, - ).padding(4.dp) + .aspectRatio(aspectRatio) + .padding(4.dp) .drawWithContent { graphicsLayer.record { this@drawWithContent.drawContent() } drawLayer(graphicsLayer) - }.then( + }.clickable(onClick = { onScaleChange(1f) }) + .then( if (viewModel.isWritingEnabled) { Modifier.clickable(onClick = { viewModel.startWriting() }) } else { Modifier }, ).graphicsLayer( - scaleX = scale, - scaleY = scale, - rotationZ = angle, - translationX = offset.x, - translationY = offset.y, + scaleX = animatedScale.value, + scaleY = animatedScale.value, ).transformable(state = state), ) { Image( diff --git a/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/ActionsRow.kt b/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/ActionsRow.kt index bb8e5a76..602d9e9f 100644 --- a/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/ActionsRow.kt +++ b/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/ActionsRow.kt @@ -1,20 +1,29 @@ package com.codekotliners.memify.features.create.presentation.ui.components +import androidx.compose.foundation.background import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.foundation.shape.CircleShape import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material3.Icon +import androidx.compose.material3.IconButton import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Surface import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier +import androidx.compose.ui.res.painterResource import androidx.compose.ui.unit.dp import com.codekotliners.memify.R import com.codekotliners.memify.features.create.presentation.viewmodel.CanvasViewModel @Composable fun ActionsRow(viewModel: CanvasViewModel) { + val isPaintSelected = viewModel.isPaintingEnabled + val isWriteSelected = viewModel.isWritingEnabled + Surface( shape = RoundedCornerShape(50.dp), color = MaterialTheme.colorScheme.surface, @@ -28,6 +37,64 @@ fun ActionsRow(viewModel: CanvasViewModel) { ActionsRowButton(R.drawable.baseline_undo_24) { viewModel.undo() } ActionsRowButton(R.drawable.baseline_redo_24) { viewModel.redo() } ActionsRowButton(R.drawable.baseline_delete_outline_24) { viewModel.clearCanvas() } + + IconButton( + onClick = { + viewModel.isPaintingEnabled = !viewModel.isPaintingEnabled + viewModel.isWritingEnabled = false + }, + modifier = + Modifier + .size(48.dp) + .background( + if (isPaintSelected) { + MaterialTheme.colorScheme.primary + } else { + MaterialTheme.colorScheme.background + }, + CircleShape, + ), + ) { + Icon( + painter = painterResource(R.drawable.baseline_brush_24), + contentDescription = "Paint", + tint = + if (isPaintSelected) { + MaterialTheme.colorScheme.onPrimary + } else { + MaterialTheme.colorScheme.onSurface + }, + ) + } + + IconButton( + onClick = { + viewModel.isWritingEnabled = !viewModel.isWritingEnabled + viewModel.isPaintingEnabled = false + }, + modifier = + Modifier + .size(48.dp) + .background( + if (isWriteSelected) { + MaterialTheme.colorScheme.primary + } else { + MaterialTheme.colorScheme.background + }, + CircleShape, + ), + ) { + Icon( + painter = painterResource(R.drawable.round_text_fields_24), + contentDescription = "Write", + tint = + if (isWriteSelected) { + MaterialTheme.colorScheme.onPrimary + } else { + MaterialTheme.colorScheme.onSurface + }, + ) + } } } } diff --git a/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/DrawingRow.kt b/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/DrawingRow.kt index 97deb561..22e35112 100644 --- a/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/DrawingRow.kt +++ b/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/DrawingRow.kt @@ -5,11 +5,9 @@ import androidx.compose.foundation.clickable import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Row -import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.size import androidx.compose.foundation.shape.CircleShape -import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.material3.MaterialTheme import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment @@ -23,13 +21,11 @@ fun DrawingRow(viewModel: CanvasViewModel) { Row( modifier = Modifier - .padding(horizontal = 4.dp) - .clip(RoundedCornerShape(20.dp)) - .fillMaxWidth() - .background(MaterialTheme.colorScheme.surface) - .padding(horizontal = 20.dp, vertical = 14.dp), + .padding(10.dp) + .background(MaterialTheme.colorScheme.surface, CircleShape) + .padding(horizontal = 16.dp, vertical = 8.dp), verticalAlignment = Alignment.CenterVertically, - horizontalArrangement = Arrangement.spacedBy(10.dp), + horizontalArrangement = Arrangement.spacedBy(8.dp), ) { Box { Box( diff --git a/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/InstrumentsTextBox.kt b/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/InstrumentsTextBox.kt deleted file mode 100644 index 85f65488..00000000 --- a/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/InstrumentsTextBox.kt +++ /dev/null @@ -1,47 +0,0 @@ -package com.codekotliners.memify.features.create.presentation.ui.components - -import androidx.compose.foundation.background -import androidx.compose.foundation.layout.Arrangement -import androidx.compose.foundation.layout.Row -import androidx.compose.foundation.layout.fillMaxWidth -import androidx.compose.foundation.layout.padding -import androidx.compose.foundation.shape.RoundedCornerShape -import androidx.compose.material3.MaterialTheme -import androidx.compose.material3.Text -import androidx.compose.runtime.Composable -import androidx.compose.ui.Alignment -import androidx.compose.ui.Modifier -import androidx.compose.ui.draw.clip -import androidx.compose.ui.graphics.Color -import androidx.compose.ui.res.stringResource -import androidx.compose.ui.text.font.Font -import androidx.compose.ui.text.font.FontFamily -import androidx.compose.ui.text.font.FontStyle -import androidx.compose.ui.text.style.TextAlign -import androidx.compose.ui.unit.dp -import androidx.compose.ui.unit.sp -import com.codekotliners.memify.R - -@Composable -fun InstrumentsTextBox() { - Row( - modifier = - Modifier - .padding(horizontal = 4.dp) - .clip(RoundedCornerShape(20.dp)) - .fillMaxWidth() - .background(MaterialTheme.colorScheme.surface) - .padding(horizontal = 20.dp, vertical = 14.dp), - verticalAlignment = Alignment.CenterVertically, - horizontalArrangement = Arrangement.spacedBy(10.dp), - ) { - Text( - text = stringResource(R.string.HoldToChooseInstruments), - fontFamily = FontFamily(Font(R.font.ubunturegular)), - fontSize = 13.sp, - fontStyle = FontStyle.Normal, - textAlign = TextAlign.Center, - color = Color.Gray, - ) - } -} diff --git a/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/RadialMenu.kt b/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/RadialMenu.kt deleted file mode 100644 index 2deea2df..00000000 --- a/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/RadialMenu.kt +++ /dev/null @@ -1,120 +0,0 @@ -package com.codekotliners.memify.features.create.presentation.ui.components - -import androidx.compose.animation.AnimatedVisibility -import androidx.compose.animation.core.tween -import androidx.compose.animation.fadeOut -import androidx.compose.foundation.background -import androidx.compose.foundation.clickable -import androidx.compose.foundation.layout.Box -import androidx.compose.foundation.layout.offset -import androidx.compose.foundation.layout.padding -import androidx.compose.foundation.layout.size -import androidx.compose.foundation.shape.CircleShape -import androidx.compose.material3.MaterialTheme -import androidx.compose.material3.Text -import androidx.compose.runtime.Composable -import androidx.compose.ui.Alignment -import androidx.compose.ui.Modifier -import androidx.compose.ui.draw.clip -import androidx.compose.ui.platform.LocalConfiguration -import androidx.compose.ui.platform.LocalDensity -import androidx.compose.ui.unit.Dp -import androidx.compose.ui.unit.IntOffset -import androidx.compose.ui.unit.dp -import androidx.compose.ui.unit.sp -import androidx.compose.ui.window.Popup -import androidx.compose.ui.window.PopupProperties -import com.codekotliners.memify.core.theme.MaterialIcons -import com.codekotliners.memify.features.create.presentation.viewmodel.CanvasViewModel -import kotlin.math.PI -import kotlin.math.cos -import kotlin.math.roundToInt -import kotlin.math.sin - -@Composable -fun LongPressMenu(viewModel: CanvasViewModel) { - val density = LocalDensity.current - val configuration = LocalConfiguration.current - val screenWidthPx = with(density) { configuration.screenWidthDp.dp.toPx() } - - val radius = 150.dp - - val options = - listOf( - "\uE3C9" to "Рисовать", - "\uE262" to "Текст", - ) - - val isLeftSide = viewModel.radialMenuPosition.x < screenWidthPx / 2 - val angles = if (isLeftSide) listOf(0f, 300f) else listOf(180f, 240f) - - AnimatedVisibility(visible = viewModel.showRadialMenu, exit = fadeOut(tween(50))) { - Popup( - onDismissRequest = { viewModel.showRadialMenu = false }, - alignment = Alignment.TopStart, - offset = - IntOffset( - viewModel.radialMenuPosition.x.toInt(), - viewModel.radialMenuPosition.y.toInt(), - ), - properties = PopupProperties(focusable = true), - ) { - Box( - modifier = - Modifier - .size(160.dp) - .padding(50.dp), - ) { - options.forEachIndexed { index, (iconText, _) -> - val angle = angles[index] * (PI / 180).toFloat() - RadialMenuIcon( - iconText = iconText, - angle = angle, - radius = radius, - ) { - when (index) { - 0 -> { - viewModel.clearModes() - viewModel.isPaintingEnabled = true - } - 1 -> { - viewModel.startWriting() - } - } - viewModel.showRadialMenu = false - } - } - } - } - } -} - -@Composable -private fun RadialMenuIcon( - iconText: String, - angle: Float, - radius: Dp, - onClick: () -> Unit, -) { - val offsetX = (cos(angle) * radius.value).roundToInt() - val offsetY = (sin(angle) * radius.value).roundToInt() - - Box( - modifier = - Modifier - .offset { IntOffset(offsetX, offsetY) } - .size(48.dp) - .clip(CircleShape) - .background(MaterialTheme.colorScheme.background) - .clickable { onClick() } - .padding(10.dp), - contentAlignment = Alignment.Center, - ) { - Text( - text = iconText, - fontFamily = MaterialIcons, - fontSize = 28.sp, - color = MaterialTheme.colorScheme.onSurface, - ) - } -} diff --git a/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/RowSlider.kt b/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/RowSlider.kt index 7bf80720..d7f075cd 100644 --- a/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/RowSlider.kt +++ b/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/RowSlider.kt @@ -5,7 +5,6 @@ import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.offset -import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.size import androidx.compose.foundation.shape.CircleShape import androidx.compose.foundation.shape.RoundedCornerShape @@ -38,10 +37,7 @@ fun RowSlider( viewModel.showTextPreview = false }, valueRange = 5f..99f, - modifier = - Modifier - .padding(horizontal = 10.dp) - .fillMaxWidth(), + modifier = Modifier.fillMaxWidth(), thumb = { Box( modifier = diff --git a/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/TextEditingRow.kt b/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/TextEditingRow.kt index 9d6414d7..85cc0544 100644 --- a/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/TextEditingRow.kt +++ b/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/TextEditingRow.kt @@ -4,7 +4,6 @@ import androidx.compose.foundation.background import androidx.compose.foundation.clickable import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Box -import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.padding @@ -30,28 +29,14 @@ import com.codekotliners.memify.features.create.presentation.viewmodel.CanvasVie @Composable fun TextEditingRow(viewModel: CanvasViewModel) { - Column( - modifier = - Modifier - .padding(horizontal = 4.dp) - .clip(RoundedCornerShape(20.dp)) - .fillMaxWidth() - .background(MaterialTheme.colorScheme.surface) - .padding(vertical = 8.dp), - ) { - TextFormattingButtons(viewModel) - } -} - -@Composable -private fun TextFormattingButtons(viewModel: CanvasViewModel) { Row( modifier = Modifier - .fillMaxWidth() - .padding(horizontal = 20.dp, vertical = 6.dp), + .padding(10.dp) + .background(MaterialTheme.colorScheme.surface, CircleShape) + .padding(horizontal = 16.dp, vertical = 8.dp), verticalAlignment = Alignment.CenterVertically, - horizontalArrangement = Arrangement.spacedBy(10.dp), + horizontalArrangement = Arrangement.spacedBy(8.dp), ) { ColorSelectionButton(viewModel) diff --git a/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/TextElementView.kt b/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/TextElementView.kt index 912a9951..8f576994 100644 --- a/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/TextElementView.kt +++ b/app/src/main/java/com/codekotliners/memify/features/create/presentation/ui/components/TextElementView.kt @@ -2,21 +2,20 @@ package com.codekotliners.memify.features.create.presentation.ui.components import androidx.compose.foundation.gestures.detectDragGestures import androidx.compose.foundation.layout.Box -import androidx.compose.foundation.layout.aspectRatio -import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.offset import androidx.compose.foundation.layout.size +import androidx.compose.foundation.layout.wrapContentSize import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.runtime.getValue import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.runtime.setValue +import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.input.pointer.pointerInput import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.unit.IntOffset -import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp import com.codekotliners.memify.features.create.domain.TextElement import com.codekotliners.memify.features.create.presentation.viewmodel.CanvasViewModel @@ -32,10 +31,8 @@ fun TextElementView( Box( modifier = Modifier - .fillMaxWidth() - .aspectRatio(viewModel.imageWidth / viewModel.imageHeight) .offset { IntOffset(offset.x.roundToInt(), offset.y.roundToInt()) } - .size(element.size.dp) + .wrapContentSize() .pointerInput(Unit) { detectDragGestures( onDrag = { change, dragAmount -> @@ -45,6 +42,7 @@ fun TextElementView( }, ) }, + contentAlignment = Alignment.Center, ) { Text( text = element.text, @@ -53,6 +51,7 @@ fun TextElementView( fontFamily = element.fontFamily, fontWeight = element.fontWeight, textAlign = TextAlign.Center, + modifier = Modifier.wrapContentSize(), ) } } diff --git a/app/src/main/java/com/codekotliners/memify/features/create/presentation/viewmodel/CanvasViewModel.kt b/app/src/main/java/com/codekotliners/memify/features/create/presentation/viewmodel/CanvasViewModel.kt index ea2e226e..fffac37d 100644 --- a/app/src/main/java/com/codekotliners/memify/features/create/presentation/viewmodel/CanvasViewModel.kt +++ b/app/src/main/java/com/codekotliners/memify/features/create/presentation/viewmodel/CanvasViewModel.kt @@ -49,9 +49,6 @@ open class CanvasViewModel @Inject constructor() : ViewModel() { var imageUrl by mutableStateOf(null) - var showRadialMenu by mutableStateOf(false) - var radialMenuPosition by mutableStateOf(Offset.Zero) - fun addPointToCurrentLine(point: Offset) { currentLine.add(point) }