← Back to Tv Material
OutlinedButton
Overview
Code Examples
Video
Material Design outlined button for TV.
Outlined buttons are medium-emphasis buttons. They contain actions that are important, but are not the primary action in an app. Outlined buttons pair well with Buttons to indicate an alternative, secondary action.
Choose the best button for an action based on the amount of emphasis it needs. The more important an action is, the higher emphasis its button should be.
- See Button for high emphasis (important, final actions that complete a flow).
- See OutlinedButton for a medium-emphasis button with a border.
The default text style for internal Text components will be set to Typography.labelLarge.
@param onClick called when this button is clicked @param modifier the Modifier to be applied to this button @param enabled controls the enabled state of this button. When false
, this component will not respond to user input, and it will appear visually disabled and disabled to accessibility services. @param scale Defines size of the Button relative to its original size. @param glow Shadow to be shown behind the Button. @param shape Defines the Button's shape. @param colors Color to be used for background and content of the Button @param tonalElevation tonal elevation used to apply a color shift to the button to give the it higher emphasis @param border Defines a border around the Button. @param contentPadding the spacing values to apply internally between the container and the content @param interactionSource the MutableInteractionSource representing the stream of Interactions for this button. You can create and pass in your own remember
ed instance to observe Interactions and customize the appearance / behavior of this button in different states. @param content the content of the button
Overloads
OutlinedButton
@ExperimentalTvMaterial3Api
@NonRestartableComposable
@Composable
fun OutlinedButton(
onClick: () -> Unit,
modifier: Modifier = Modifier,
enabled: Boolean = true,
scale: ButtonScale = OutlinedButtonDefaults.scale(),
glow: ButtonGlow = OutlinedButtonDefaults.glow(),
shape: ButtonShape = OutlinedButtonDefaults.shape(),
colors: ButtonColors = OutlinedButtonDefaults.colors(),
tonalElevation: Dp = Elevation.Level0,
border: ButtonBorder = OutlinedButtonDefaults.border(),
contentPadding: PaddingValues = OutlinedButtonDefaults.ContentPadding,
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
content: @Composable RowScope.() -> Unit
)
Parameters
Name | Description |
---|---|
onClick | called when this button is clicked |
modifier | the Modifier to be applied to this button |
enabled | controls the enabled state of this button. When false , this component will not respond to user input, and it will appear visually disabled and disabled to accessibility services. |
scale | Defines size of the Button relative to its original size. |
glow | Shadow to be shown behind the Button. |
shape | Defines the Button's shape. |
colors | Color to be used for background and content of the Button |
tonalElevation | tonal elevation used to apply a color shift to the button to give the it higher emphasis |
border | Defines a border around the Button. |
contentPadding | the spacing values to apply internally between the container and the content |
interactionSource | the MutableInteractionSource representing the stream of Interactions for this button. You can create and pass in your own remember ed instance to observe Interactions and customize the appearance / behavior of this button in different states. |
content | the content of the butto |