New Compose Multiplatform components arrived on Composables UICheck it out →

← Component in Tv Material Compose

OutlinedIconButton

Android

Material Design standard icon button for TV.

Icon buttons help people take supplementary actions with a single tap. They’re used when a compact button is required, such as in a toolbar or image list.

[content] should typically be an [Icon]. If using a custom icon, note that the typical size for the internal icon is 24 x 24 dp. This icon button has an overall minimum touch target size of 48 x 48dp, to meet accessibility guidelines.

The default text style for internal [Text] components will be set to [Typography.labelLarge].

Last updated:

Installation

dependencies {
   implementation("androidx.tv:tv-material:1.0.0-beta01")
}

Overloads

@Composable
@NonRestartableComposable
fun OutlinedIconButton(
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
    onLongClick: (() -> Unit)? = null,
    enabled: Boolean = true,
    scale: ButtonScale = OutlinedIconButtonDefaults.scale(),
    glow: ButtonGlow = OutlinedIconButtonDefaults.glow(),
    shape: ButtonShape = OutlinedIconButtonDefaults.shape(),
    colors: ButtonColors = OutlinedIconButtonDefaults.colors(),
    border: ButtonBorder = OutlinedIconButtonDefaults.border(),
    interactionSource: MutableInteractionSource? = null,
    content: @Composable BoxScope.() -> Unit
)

Parameters

namedescription
onClickcalled when this button is clicked.
modifierthe [Modifier] to be applied to this button.
onLongClickcalled when this card is long clicked (long-pressed).
enabledcontrols 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.
scaleDefines size of the Button relative to its original size
glowShadow to be shown behind the Button.
shapeDefines the Button's shape.
colorsColor to be used for background and content of the Button
borderDefines a border around the Button.
interactionSourcean optional hoisted [MutableInteractionSource] for observing and emitting [Interaction]s for this button. You can use this to change the button's appearance or preview the button in different states. Note that if null is provided, interactions will still happen internally.
contentthe content of the button, typically an [Icon]

Code Example

OutlinedIconButtonSample

@Composable
@Sampled
fun OutlinedIconButtonSample() {
    OutlinedIconButton(onClick = { /* doSomething() */ }) {
        Icon(
            Icons.Outlined.FavoriteBorder,
            contentDescription = "Localized description"
        )
    }
}