Chips help people enter information, make selections, filter content, or trigger actions.
FilterChipSample
@Preview
@Composable
fun FilterChipSample() {
var selected by remember { mutableStateOf(false) }
FilterChip(
selected = selected,
onClick = { selected = !selected },
label = { Text("Filter chip") },
leadingIcon =
if (selected) {
{
Icon(
imageVector = Icons.Filled.Done,
contentDescription = "Localized Description",
modifier = Modifier.size(FilterChipDefaults.IconSize),
)
}
} else {
null
},
)
}
FilterChipWithCustomSpacingSample
@Preview
@Composable
fun FilterChipWithCustomSpacingSample() {
var selected by remember { mutableStateOf(false) }
FilterChip(
selected = selected,
onClick = { selected = !selected },
label = { Text("Filter chip") },
leadingIcon =
if (selected) {
{
Icon(
imageVector = Icons.Filled.Done,
contentDescription = "Localized Description",
modifier = Modifier.size(FilterChipDefaults.IconSize),
)
}
} else {
null
},
horizontalArrangement = FilterChipDefaults.horizontalArrangement(4.dp),
)
}
FilterChipWithLeadingIconSample
@Preview
@Composable
fun FilterChipWithLeadingIconSample() {
var selected by remember { mutableStateOf(false) }
FilterChip(
selected = selected,
onClick = { selected = !selected },
label = { Text("Filter chip") },
leadingIcon =
if (selected) {
{
Icon(
imageVector = Icons.Filled.Done,
contentDescription = "Localized Description",
modifier = Modifier.size(FilterChipDefaults.IconSize),
)
}
} else {
{
Icon(
imageVector = Icons.Filled.Home,
contentDescription = "Localized description",
modifier = Modifier.size(FilterChipDefaults.IconSize),
)
}
},
)
}
FilterChipWithTrailingIconSample
@Preview
@Composable
fun FilterChipWithTrailingIconSample() {
var selected by remember { mutableStateOf(false) }
FilterChip(
selected = selected,
onClick = { selected = !selected },
label = { Text("Filter chip") },
leadingIcon =
if (selected) {
{
Icon(
imageVector = Icons.Filled.Done,
contentDescription = "Localized Description",
modifier = Modifier.size(FilterChipDefaults.IconSize),
)
}
} else {
null
},
trailingIcon = {
Icon(
imageVector = Icons.Filled.ArrowDropDown,
contentDescription = "Localized Description",
modifier = Modifier.size(FilterChipDefaults.IconSize),
)
},
)
}