diff --git a/composeApp/src/commonMain/kotlin/uk/sky/bob/application/App.kt b/composeApp/src/commonMain/kotlin/uk/sky/bob/application/App.kt index 89b542e..3a7cd69 100644 --- a/composeApp/src/commonMain/kotlin/uk/sky/bob/application/App.kt +++ b/composeApp/src/commonMain/kotlin/uk/sky/bob/application/App.kt @@ -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,38 +33,46 @@ import org.jetbrains.compose.ui.tooling.preview.Preview @Preview fun App() { MaterialTheme { - Column(Modifier.fillMaxWidth(), horizontalAlignment = Alignment.CenterHorizontally) { - Row { - val state = remember { mutableStateOf(Sentiment.HAPPY) } - for (emotion in Sentiment.entries) { - FilterChip( - onClick = { state.value = emotion }, - selected = state.value == emotion, - modifier = Modifier.padding(8.dp), - leadingIcon = { Text(emotion.leadingIcon) }, - ) { - Text(emotion.friendlyName) + 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( + onClick = { state.value = emotion }, + selected = state.value == emotion, + modifier = Modifier.padding(8.dp), + leadingIcon = { Text(emotion.leadingIcon) }, + ) { + Text(emotion.friendlyName) + } } } - } - Row { - var text by rememberSaveable(stateSaver = TextFieldValue.Saver) { - mutableStateOf( - TextFieldValue("") + Row(modifier = Modifier.padding(8.dp)) { + var text by rememberSaveable(stateSaver = TextFieldValue.Saver) { + mutableStateOf( + TextFieldValue("") + ) + } + TextField( + value = text, + onValueChange = { text = it }, + label = { Text("Your comment") }, + modifier = Modifier.height(100.dp).fillMaxWidth().padding(8.dp), ) } - TextField( - value = text, - onValueChange = { text = it }, - label = { Text("Your comment") }, - maxLines = 3, - ) - } - 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") + } } } }