← Back to Tv Material
DenseListItem
Overview
Code Examples
Video
Lists are continuous, vertical indexes of text or images.
DenseListItem is a smaller/denser version of the Material ListItem.
This component can be used to achieve the list item templates existing in the spec. One-line list items have a singular line of headline content. Two-line list items additionally have either supporting or overline content. Three-line list items have either both supporting and overline content, or extended (two-line) supporting text.
This ListItem handles click events, calling its onClick lambda. It also support selected state which can be toggled using the selected param.
@param selected defines whether this ListItem is selected or not @param onClick called when this ListItem is clicked @param modifier Modifier to be applied to the list item @param enabled controls the enabled state of this list item. When false
, this component will not respond to user input, and it will appear visually disabled and disabled to accessibility services. @param onLongClick called when this ListItem is long clicked (long-pressed). @param leadingContent the Composable leading content of the list item @param overlineContent the Composable content displayed above the headline content @param supportingContent the Composable content displayed below the headline content @param trailingContent the Composable trailing meta text, icon, switch or checkbox @param tonalElevation the tonal elevation of this list item @param shape ListItemShape defines the shape of ListItem's container in different interaction states. See ListItemDefaults.shape. @param colors ListItemColors defines the background and content colors used in the list item for different interaction states. See ListItemDefaults.colors @param scale ListItemScale defines the size of the list item relative to its original size in different interaction states. See ListItemDefaults.scale @param border ListItemBorder defines a border around the list item in different interaction states. See ListItemDefaults.border @param glow ListItemGlow defines a shadow to be shown behind the list item for different interaction states. See ListItemDefaults.glow @param interactionSource the MutableInteractionSource representing the stream of Interactions for this component. You can create and pass in your own remembered instance to observe Interactions and customize the appearance / behavior of this list item in different states. @param headlineContent the Composable headline content of the list item
Overloads
DenseListItem
@ExperimentalTvMaterial3Api
@Composable
fun DenseListItem(
selected: Boolean,
onClick: () -> Unit,
modifier: Modifier = Modifier,
enabled: Boolean = true,
onLongClick: (() -> Unit)? = null,
overlineContent: (@Composable () -> Unit)? = null,
supportingContent: (@Composable () -> Unit)? = null,
leadingContent: (@Composable BoxScope.() -> Unit)? = null,
trailingContent: (@Composable () -> Unit)? = null,
tonalElevation: Dp = ListItemDefaults.ListItemElevation,
shape: ListItemShape = ListItemDefaults.shape(),
colors: ListItemColors = ListItemDefaults.colors(),
scale: ListItemScale = ListItemDefaults.scale(),
border: ListItemBorder = ListItemDefaults.border(),
glow: ListItemGlow = ListItemDefaults.glow(),
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
headlineContent: @Composable () -> Unit
)
Parameters
Name | Description |
---|---|
selected | defines whether this ListItem is selected or not |
onClick | called when this ListItem is clicked |
modifier | Modifier to be applied to the list item |
enabled | controls the enabled state of this list item. When false , this component will not respond to user input, and it will appear visually disabled and disabled to accessibility services. |
onLongClick | called when this ListItem is long clicked (long-pressed). |
leadingContent | the Composable leading content of the list item |
overlineContent | the Composable content displayed above the headline content |
supportingContent | the Composable content displayed below the headline content |
trailingContent | the Composable trailing meta text, icon, switch or checkbox |
tonalElevation | the tonal elevation of this list item |
shape | ListItemShape defines the shape of ListItem's container in different interaction states. See ListItemDefaults.shape. |
colors | ListItemColors defines the background and content colors used in the list item for different interaction states. See ListItemDefaults.colors |
scale | ListItemScale defines the size of the list item relative to its original size in different interaction states. See ListItemDefaults.scale |
border | ListItemBorder defines a border around the list item in different interaction states. See ListItemDefaults.border |
glow | ListItemGlow defines a shadow to be shown behind the list item for different interaction states. See ListItemDefaults.glow |
interactionSource | the MutableInteractionSource representing the stream of Interactions for this component. You can create and pass in your own remembered instance to observe Interactions and customize the appearance / behavior of this list item in different states. |
headlineContent | the Composable headline content of the list ite |