Jetpack Compose FilledIconButton in Wear Material 3

Wear Material FilledIconButton is a circular, icon-only button with a colored background and a contrasting content color. It offers a single slot to take an icon or image.

Set the size of the FilledIconButton with Modifier.touchTargetAwareSize to ensure that the recommended minimum touch target size is available.

The recommended IconButton sizes are IconButtonDefaults.DefaultButtonSize, IconButtonDefaults.LargeButtonSize, IconButtonDefaults.SmallButtonSize and IconButtonDefaults.ExtraSmallButtonSize.

Use IconButtonDefaults.iconSizeFor to determine the icon size for a given IconButton size, or refer to icon sizes IconButtonDefaults.SmallIconSize, IconButtonDefaults.DefaultIconSize, IconButtonDefaults.LargeIconSize directly.

FilledIconButton can be enabled or disabled. A disabled button will not respond to click events.

TODO(b/261838497) Add Material3 samples and UX guidance links

Example of FilledIconButton:

Overloads

FilledIconButton

@Composable
fun FilledIconButton(
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
    enabled: Boolean = true,
    shape: Shape = IconButtonDefaults.shape,
    colors: IconButtonColors = IconButtonDefaults.filledIconButtonColors(),
    border: BorderStroke? = null,
    interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
    content: @Composable BoxScope.() -> Unit,
)

Parameters

Name	Description
`onClick`	Will be called when the user clicks the button.
`modifier`	Modifier to be applied to the button.
`enabled`	Controls the enabled state of the button. When `false`, this button will not be clickable.
`shape`	Defines the icon button's shape. It is strongly recommended to use the default as this shape is a key characteristic of the Wear Material3 design.
`colors`	IconButtonColors that will be used to resolve the container and content color for this icon button in different states.
`border`	Optional BorderStroke for the icon button border.
`interactionSource`	The MutableInteractionSource representing the stream of Interactions for this Button. You can create and pass in your own remembered MutableInteractionSource if you want to observe Interactions and customize the appearance / behavior of this Button in different Interactions.
`content`	The content displayed on the icon button, expected to be icon or image