wbrawner/thunderbird-android
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Change CheckboxInput and SwitchInput to InputLayout with error message

Browse source
This commit is contained in:
Wolf-Martell Montwé 2023-06-12 10:10:59 +02:00
parent 2490d7402d
commit 86e8ea30d0
No known key found for this signature in database
GPG key ID: 6D45B21512ACBF72
3 changed files with 90 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
app-ui-catalog/src/main/java/app/k9mail/ui/catalog/ui/molecule/items/InputItems.kt
View file

@ -131,6 +131,7 @@ fun LazyGridScope.inputItems() {
}
sectionHeaderItem(text = "CheckboxInput")
sectionSubtitleItem(text = "Default")
item {
ItemOutlined {
WithRememberedState(input = false) { state ->
@ -142,8 +143,22 @@ fun LazyGridScope.inputItems() {
}
}
}
sectionSubtitleItem(text = "With error")
item {
ItemOutlined {
WithRememberedState(input = false) { state ->
CheckboxInput(
text = "Check the box",
checked = state.value,
onCheckedChange = { state.value = it },
errorMessage = "Checkbox must be checked",
)
}
}
}
sectionHeaderItem(text = "SwitchInput")
sectionSubtitleItem(text = "Default")
item {
ItemOutlined {
WithRememberedState(input = false) { state ->
@ -155,4 +170,17 @@ fun LazyGridScope.inputItems() {
}
}
}
sectionSubtitleItem(text = "With error")
item {
ItemOutlined {
WithRememberedState(input = false) { state ->
SwitchInput(
text = "Switch the toggle",
checked = state.value,
onCheckedChange = { state.value = it },
errorMessage = "Switch must be checked",
)
}
}
}
}

45
core/ui/compose/designsystem/src/main/kotlin/app/k9mail/core/ui/compose/designsystem/molecule/input/CheckboxInput.kt
View file

@ -5,7 +5,6 @@ import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
@ -21,22 +20,27 @@ fun CheckboxInput(
checked: Boolean,
onCheckedChange: (Boolean) -> Unit,
modifier: Modifier = Modifier,
errorMessage: String? = null,
contentPadding: PaddingValues = inputContentPadding(),
) {
Row(
modifier = Modifier
.padding(contentPadding)
.fillMaxWidth()
.clickable { onCheckedChange(!checked) }
.then(modifier),
verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = Arrangement.spacedBy(MainTheme.spacings.half),
InputLayout(
modifier = modifier,
contentPadding = contentPadding,
errorMessage = errorMessage,
) {
Checkbox(
checked = checked,
onCheckedChange = onCheckedChange,
)
TextBody1(text = text)
Row(
modifier = Modifier
.fillMaxWidth()
.clickable { onCheckedChange(!checked) },
verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = Arrangement.spacedBy(MainTheme.spacings.half),
) {
Checkbox(
checked = checked,
onCheckedChange = onCheckedChange,
)
TextBody1(text = text)
}
}
}
@ -52,6 +56,19 @@ internal fun CheckboxInputPreview() {
}
}
@Preview(showBackground = true)
@Composable
internal fun CheckboxInputWithErrorPreview() {
PreviewWithThemes {
CheckboxInput(
text = "CheckboxInput",
checked = false,
onCheckedChange = {},
errorMessage = "Error message",
)
}
}
@Preview(showBackground = true)
@Composable
internal fun CheckboxInputCheckedPreview() {

45
core/ui/compose/designsystem/src/main/kotlin/app/k9mail/core/ui/compose/designsystem/molecule/input/SwitchInput.kt
View file

@ -5,7 +5,6 @@ import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
@ -21,22 +20,27 @@ fun SwitchInput(
checked: Boolean,
onCheckedChange: (Boolean) -> Unit,
modifier: Modifier = Modifier,
errorMessage: String? = null,
contentPadding: PaddingValues = inputContentPadding(),
) {
Row(
modifier = Modifier
.padding(contentPadding)
.fillMaxWidth()
.clickable { onCheckedChange(!checked) }
.then(modifier),
verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = Arrangement.spacedBy(MainTheme.spacings.half),
InputLayout(
modifier = modifier,
contentPadding = contentPadding,
errorMessage = errorMessage,
) {
Switch(
checked = checked,
onCheckedChange = onCheckedChange,
)
TextBody1(text = text)
Row(
modifier = Modifier
.fillMaxWidth()
.clickable { onCheckedChange(!checked) },
verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = Arrangement.spacedBy(MainTheme.spacings.half),
) {
Switch(
checked = checked,
onCheckedChange = onCheckedChange,
)
TextBody1(text = text)
}
}
}
@ -52,6 +56,19 @@ internal fun SwitchInputPreview() {
}
}
@Preview(showBackground = true)
@Composable
internal fun SwitchInputWithErrorPreview() {
PreviewWithThemes {
SwitchInput(
text = "SwitchInput",
checked = false,
onCheckedChange = {},
errorMessage = "Error message",
)
}
}
@Preview(showBackground = true)
@Composable
internal fun SwitchInputCheckedPreview() {