OutlinedIconButton

Functions summary

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

Material Design standard icon button for TV.

Functions

OutlinedIconButton

@NonRestartableComposable
@Composable
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
): Unit

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.

import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Favorite
import androidx.compose.material.icons.outlined.FavoriteBorder
import androidx.tv.material3.Icon
import androidx.tv.material3.IconButton
import androidx.tv.material3.OutlinedIconButton

OutlinedIconButton(onClick = { /* doSomething() */ }) {
    Icon(Icons.Outlined.FavoriteBorder, contentDescription = "Localized description")
}
Parameters
onClick: () -> Unit

called when this button is clicked.
modifier: Modifier = Modifier

the Modifier to be applied to this button.
onLongClick: (() -> Unit)? = null

called when this card is long clicked (long-pressed).
enabled: Boolean = true

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: ButtonScale = OutlinedIconButtonDefaults.scale()

Defines size of the Button relative to its original size
glow: ButtonGlow = OutlinedIconButtonDefaults.glow()

Shadow to be shown behind the Button.
shape: ButtonShape = OutlinedIconButtonDefaults.shape()

Defines the Button's shape.
colors: ButtonColors = OutlinedIconButtonDefaults.colors()

Color to be used for background and content of the Button
border: ButtonBorder = OutlinedIconButtonDefaults.border()

Defines a border around the Button.
interactionSource: MutableInteractionSource? = null

an optional hoisted MutableInteractionSource for observing and emitting Interactions 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.
content: @Composable BoxScope.() -> Unit

the content of the button, typically an Icon