Sulkta-OSS/element-x-ada
3
0
Fork 0
Code Issues 1 Pull requests 10 Projects Releases Packages Wiki Activity Actions

Improve previews

Browse source
This commit is contained in:
Florian Renaud 2023-08-17 17:56:30 +02:00
parent 91e92a5cc4
commit 161402d501
2 changed files with 25 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

20
libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/IconToggleButton.kt
View file

@ -17,6 +17,7 @@
package io.element.android.libraries.designsystem.theme.components package io.element.android.libraries.designsystem.theme.components
import androidx.compose.foundation.interaction.MutableInteractionSource import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.layout.Column
import androidx.compose.material.icons.Icons import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.CheckCircle import androidx.compose.material.icons.filled.CheckCircle
import androidx.compose.material.icons.filled.RadioButtonUnchecked import androidx.compose.material.icons.filled.RadioButtonUnchecked
@ -55,18 +56,23 @@ fun IconToggleButton(
@Preview(group = PreviewGroup.Toggles) @Preview(group = PreviewGroup.Toggles)
@Composable @Composable
internal fun IconToggleButtonPreview() = ElementThemedPreview(vertical = false) { ContentToPreview() } internal fun IconToggleButtonCheckedPreview() = ElementThemedPreview(vertical = false) { ContentToPreview(true) }
@Preview(group = PreviewGroup.Toggles)
@Composable
internal fun IconToggleButtonUncheckedPreview() = ElementThemedPreview(vertical = false) { ContentToPreview(false) }
@Composable @Composable
private fun ContentToPreview() { private fun ContentToPreview(defaultCheck: Boolean) {
var checked by remember { mutableStateOf(false) } var checked by remember { mutableStateOf(defaultCheck) }
IconToggleButton( val icon: @Composable () -> Unit = {
checked = checked,
onCheckedChange = { checked = !checked },
) {
Icon( Icon(
imageVector = if (checked) Icons.Default.CheckCircle else Icons.Default.RadioButtonUnchecked, imageVector = if (checked) Icons.Default.CheckCircle else Icons.Default.RadioButtonUnchecked,
contentDescription = "IconToggleButton" contentDescription = "IconToggleButton"
) )
} }
Column {
IconToggleButton(checked = checked, enabled = true, onCheckedChange = { checked = !checked }, content = icon)
IconToggleButton(checked = checked, enabled = false, onCheckedChange = { checked = !checked }, content = icon)
}
} }

25
libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/RadioButton.kt
View file

@ -17,16 +17,16 @@
package io.element.android.libraries.designsystem.theme.components package io.element.android.libraries.designsystem.theme.components
import androidx.compose.foundation.interaction.MutableInteractionSource import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.material3.RadioButtonColors import androidx.compose.material3.RadioButtonColors
import androidx.compose.material3.RadioButtonDefaults import androidx.compose.material3.RadioButtonDefaults
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import io.element.android.libraries.designsystem.preview.ElementThemedPreview import io.element.android.libraries.designsystem.preview.ElementThemedPreview
import io.element.android.libraries.designsystem.preview.PreviewGroup import io.element.android.libraries.designsystem.preview.PreviewGroup
import io.element.android.libraries.theme.ElementTheme import io.element.android.libraries.theme.ElementTheme
@ -63,18 +63,17 @@ internal fun compoundRadioButtonColors(): RadioButtonColors {
@Preview(group = PreviewGroup.Toggles) @Preview(group = PreviewGroup.Toggles)
@Composable @Composable
internal fun RadioButtonPreview() = ElementThemedPreview(vertical = false) { ContentToPreview() } internal fun RadioButtonCheckedPreview() = ElementThemedPreview(vertical = false) { ContentToPreview(true) }
@Preview(group = PreviewGroup.Toggles)
@Composable
internal fun RadioButtonUncheckedPreview() = ElementThemedPreview(vertical = false) { ContentToPreview(false) }
@Composable @Composable
private fun ContentToPreview() { private fun ContentToPreview(defaultCheck: Boolean) {
var checked by remember { mutableStateOf(defaultCheck) }
Column { Column {
Row(horizontalArrangement = Arrangement.spacedBy(6.dp)) { RadioButton(selected = checked, enabled = true, onClick = { checked = !checked })
RadioButton(selected = false, onClick = {}) RadioButton(selected = checked, enabled = false, onClick = { checked = !checked })
RadioButton(selected = false, enabled = false, onClick = {})
}
Row(horizontalArrangement = Arrangement.spacedBy(6.dp)) {
RadioButton(selected = true, onClick = {})
RadioButton(selected = true, enabled = false, onClick = {})
}
} }
} }