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
Showing only changes of commit c0dbf668ec - Show all commits

View file

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