Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Selectable outlined radio button
@Composable
fun OutlinedLabelledRadioButton(
selected: Boolean,
onClick: () -> Unit,
label: String,
modifier: Modifier = Modifier
) {
OutlinedButton(
onClick = onClick,
border = BorderStroke(
width = 1.dp,
color = if (selected) {
MaterialTheme.colors.primary
} else {
Color.DarkGray.copy(alpha = 0.75f)
}
),
colors = if (selected) {
ButtonDefaults.outlinedButtonColors(
backgroundColor = MaterialTheme.colors.primary.copy(alpha = 0.1f),
contentColor = MaterialTheme.colors.primary
)
} else {
ButtonDefaults.outlinedButtonColors(
backgroundColor = MaterialTheme.colors.surface,
contentColor = MaterialTheme.colors.primary
)
},
modifier = modifier
.height(48.dp)
) {
Row(
verticalAlignment = Alignment.CenterVertically,
modifier = Modifier.fillMaxWidth()
) {
RadioButton(
selected = selected,
onClick = null,
)
Spacer(Modifier.size(6.dp))
Text(
text = label,
color = if (selected) {
MaterialTheme.colors.primary
} else {
Color.DarkGray.copy(alpha = 0.9f)
},
modifier = Modifier.padding(horizontal = 8.dp)
)
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment