diff --git a/app/src/debug/kotlin/previews/Previews.kt b/app/src/debug/kotlin/previews/Previews.kt index ea00df6..2cc9ec9 100644 --- a/app/src/debug/kotlin/previews/Previews.kt +++ b/app/src/debug/kotlin/previews/Previews.kt @@ -6,12 +6,18 @@ import androidx.compose.foundation.layout.padding import androidx.compose.material.MaterialTheme import androidx.compose.material.Scaffold import androidx.compose.runtime.Composable +import androidx.compose.runtime.getValue +import androidx.compose.runtime.mutableStateOf +import androidx.compose.runtime.saveable.rememberSaveable +import androidx.compose.runtime.setValue import androidx.compose.ui.Modifier +import androidx.compose.ui.text.input.TextFieldValue import androidx.compose.ui.tooling.preview.Preview import net.buzzert.kordophonedroid.R import net.buzzert.kordophonedroid.ui.conversationlist.ConversationListItem import net.buzzert.kordophonedroid.ui.conversationlist.ConversationListScreen import net.buzzert.kordophonedroid.ui.conversationlist.NoContentView +import net.buzzert.kordophonedroid.ui.messagelist.MessageEntry import net.buzzert.kordophonedroid.ui.messagelist.MessageListItem import net.buzzert.kordophonedroid.ui.messagelist.MessageMetadata import net.buzzert.kordophonedroid.ui.messagelist.MessageTranscript @@ -75,6 +81,16 @@ private fun MessageListScreenPreview() { } } +@Preview +@Composable +private fun MessageEntryPreview() { + var textState by rememberSaveable(stateSaver = TextFieldValue.Saver) { + mutableStateOf(TextFieldValue("Hello this is some text that might wrap multiple lines to show that there must be some padding here. ")) + } + + MessageEntry(onSend = {}, onTextChanged = {}, textFieldValue = textState) +} + // - No content @Preview diff --git a/app/src/main/java/net/buzzert/kordophonedroid/ui/messagelist/MessageEntryView.kt b/app/src/main/java/net/buzzert/kordophonedroid/ui/messagelist/MessageEntryView.kt index 1c15edf..f80d380 100644 --- a/app/src/main/java/net/buzzert/kordophonedroid/ui/messagelist/MessageEntryView.kt +++ b/app/src/main/java/net/buzzert/kordophonedroid/ui/messagelist/MessageEntryView.kt @@ -1,12 +1,13 @@ package net.buzzert.kordophonedroid.ui.messagelist -import androidx.compose.foundation.BorderStroke +import androidx.compose.foundation.background import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.imePadding import androidx.compose.foundation.layout.navigationBarsPadding import androidx.compose.foundation.layout.padding -import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.foundation.layout.width import androidx.compose.foundation.text.BasicTextField import androidx.compose.material.Button import androidx.compose.material.MaterialTheme @@ -15,6 +16,7 @@ import androidx.compose.material.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.shadow import androidx.compose.ui.graphics.SolidColor import androidx.compose.ui.text.input.KeyboardType import androidx.compose.ui.text.input.TextFieldValue @@ -29,28 +31,24 @@ fun MessageEntry( ) { Row( modifier = Modifier + .background(MaterialTheme.colors.onSurface.copy(alpha = 0.18f)) .fillMaxWidth() - .padding(8.dp) + .padding(vertical = 8.dp, horizontal = 12.dp) + .imePadding() + .navigationBarsPadding() ) { - Surface( - shape = RoundedCornerShape(8.dp), - border = BorderStroke(1.dp, color = MaterialTheme.colors.onBackground.copy(0.4f)) - ) { - Row(modifier = Modifier - .padding(horizontal = 8.dp) - .weight(1f) - .align(Alignment.Bottom) - .imePadding() - .navigationBarsPadding() + Surface( + shape = MaterialTheme.shapes.medium, + modifier = Modifier.weight(1f) + .align(Alignment.CenterVertically) + .shadow(4.dp) ) { BasicTextField( value = textFieldValue, onValueChange = { onTextChanged(it) }, modifier = Modifier .fillMaxWidth() - .weight(1f) - .align(Alignment.CenterVertically) - .padding(horizontal = 8.dp), + .padding(horizontal = 8.dp, vertical = 8.dp), cursorBrush = SolidColor(MaterialTheme.colors.onBackground), textStyle = MaterialTheme.typography.body1.copy(MaterialTheme.colors.onBackground), decorationBox = { textContent -> @@ -66,11 +64,12 @@ fun MessageEntry( textContent() } ) - - Button(onClick = onSend) { - Text(text = "Send") - } } - } + + Spacer(Modifier.width(8.dp)) + + Button(onClick = onSend) { + Text(text = "Send") + } } } diff --git a/app/src/main/java/net/buzzert/kordophonedroid/ui/messagelist/MessageListScreen.kt b/app/src/main/java/net/buzzert/kordophonedroid/ui/messagelist/MessageListScreen.kt index 170d76d..9107eb4 100644 --- a/app/src/main/java/net/buzzert/kordophonedroid/ui/messagelist/MessageListScreen.kt +++ b/app/src/main/java/net/buzzert/kordophonedroid/ui/messagelist/MessageListScreen.kt @@ -184,6 +184,7 @@ fun Messages( LazyColumn( reverseLayout = true, state = scrollState, + contentPadding = PaddingValues(vertical = 8.dp), modifier = Modifier .fillMaxSize() .padding(horizontal = 16.dp)