Icon buttons help people take supplementary actions with a single tap.
@OptIn(ExperimentalMaterial3Api::class)
@Preview
@Composable
fun FilledIconButtonSample() {
val description = "Localized description"
// Icon button should have a tooltip associated with it for a11y.
TooltipBox(
positionProvider =
TooltipDefaults.rememberTooltipPositionProvider(TooltipAnchorPosition.Above),
tooltip = { PlainTooltip { Text(description) } },
state = rememberTooltipState(),
) {
FilledIconButton(onClick = { /* doSomething() */ }) {
Icon(Icons.Filled.Lock, contentDescription = description)
}
}
}
@OptIn(ExperimentalMaterial3ExpressiveApi::class, ExperimentalMaterial3Api::class)
@Preview
@Composable
fun FilledIconButtonWithAnimatedShapeSample() {
val description = "Localized description"
// Icon button should have a tooltip associated with it for a11y.
TooltipBox(
positionProvider =
TooltipDefaults.rememberTooltipPositionProvider(TooltipAnchorPosition.Above),
tooltip = { PlainTooltip { Text(description) } },
state = rememberTooltipState(),
) {
FilledIconButton(onClick = { /* doSomething() */ }, shapes = IconButtonDefaults.shapes()) {
Icon(Icons.Filled.Lock, contentDescription = description)
}
}
}