bob/mobile-application
1
0
Fork 0
Code Issues 3 Pull requests 3 Projects 1 Releases 4 Activity Actions

feat: improve layout and add send icon to comment submission UI #15

Merged
ben merged 1 commit from feature/Add-Comment-Input into master 2025-01-21 13:58:14 +00:00
Conversation 0 Commits 1 Files changed 1 +40 -26
1 changed files with 40 additions and 26 deletions
Download patch file Download diff file Expand all files Collapse all files
Showing only changes of commit c0dbf668ec - Show all commits

28
composeApp/src/commonMain/kotlin/uk/sky/bob/application/App.kt
View file

@ -1,15 +1,21 @@
package uk.sky.bob.application package uk.sky.bob.application
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.padding
import androidx.compose.material.Button import androidx.compose.material.Button
import androidx.compose.material.ExperimentalMaterialApi import androidx.compose.material.ExperimentalMaterialApi
import androidx.compose.material.FilterChip import androidx.compose.material.FilterChip
import androidx.compose.material.Icon
import androidx.compose.material.MaterialTheme import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text import androidx.compose.material.Text
import androidx.compose.material.TextField import androidx.compose.material.TextField
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.automirrored.filled.Send
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.mutableStateOf
@ -27,8 +33,15 @@ import org.jetbrains.compose.ui.tooling.preview.Preview
@Preview @Preview
fun App() { fun App() {
MaterialTheme { MaterialTheme {
Column(Modifier.fillMaxWidth(), horizontalAlignment = Alignment.CenterHorizontally) { Box(
Row { modifier = Modifier.fillMaxHeight(),
contentAlignment = Alignment.Center,
) {
Column(
Modifier.fillMaxWidth(),
horizontalAlignment = Alignment.CenterHorizontally,
) {
Row(modifier = Modifier.padding(8.dp)) {
val state = remember { mutableStateOf(Sentiment.HAPPY) } val state = remember { mutableStateOf(Sentiment.HAPPY) }
for (emotion in Sentiment.entries) { for (emotion in Sentiment.entries) {
FilterChip( FilterChip(
@ -42,7 +55,7 @@ fun App() {
} }
} }
Row { Row(modifier = Modifier.padding(8.dp)) {
var text by rememberSaveable(stateSaver = TextFieldValue.Saver) { var text by rememberSaveable(stateSaver = TextFieldValue.Saver) {
mutableStateOf( mutableStateOf(
TextFieldValue("") TextFieldValue("")
@ -52,13 +65,14 @@ fun App() {
value = text, value = text,
onValueChange = { text = it }, onValueChange = { text = it },
label = { Text("Your comment") }, label = { Text("Your comment") },
maxLines = 3, modifier = Modifier.height(100.dp).fillMaxWidth().padding(8.dp),
) )
} }
Row { Row(modifier = Modifier.padding(8.dp)) {
Button(onClick = { /* Handle submit */ }) { Button(onClick = { /* Handle submit */ }, modifier = Modifier.padding(8.dp)) {
Text("Submit") Icon(Icons.AutoMirrored.Filled.Send, contentDescription = "Send")
}
} }
} }
} }