← Back to Wear Material
OutlinedButton
Component
in
Wear Material
. Since 1.1.0Overview
Code Examples
Wear Material OutlinedButton that offers a single slot to take any content (text, icon or image).
The recommended Button sizes can be obtained from ButtonDefaults - see ButtonDefaults.DefaultButtonSize, ButtonDefaults.LargeButtonSize, ButtonDefaults.SmallButtonSize. Icon content should be of size ButtonDefaults.DefaultIconSize, ButtonDefaults.LargeIconSize or ButtonDefaults.SmallIconSize respectively.
Buttons can be enabled or disabled. A disabled button will not respond to click events.
An OutlinedButton has a transparent background and a thin border by default with content taking the theme primary color.
Example of a OutlinedButton displaying an icon:
Overloads
OutlinedButton
@Composable
public fun OutlinedButton(
onClick: () -> Unit,
modifier: Modifier = Modifier,
enabled: Boolean = true,
colors: ButtonColors = ButtonDefaults.outlinedButtonColors(),
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
shape: Shape = CircleShape,
border: ButtonBorder = ButtonDefaults.outlinedButtonBorder(),
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. |
colors | ButtonColors that will be used to resolve the background and content color for this button in different states. See ButtonDefaults.outlinedButtonColors. |
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. |
shape | Defines the button's shape. It is strongly recommended to use the default as this shape is a key characteristic of the Wear Material Theme. |
border | ButtonBorder that will be used to resolve the button border in different states. See ButtonDefaults.outlinedButtonBorder. |
content | The content displayed on the OutlinedButton such as text, icon or image |