JetpackTab

fun JetpackTab(selected: Boolean, onClick: () -> Unit, modifier: Modifier = Modifier, enabled: Boolean = true, text: @Composable () -> Unit)

Jetpack tab. Wraps Material 3 Tab and shifts text label down.

A styled tab component with centered text and custom padding. Use with JetpackTabRow to create tabbed navigation or content switching interfaces.

Features:

  • Custom top padding for visual alignment

  • Center-aligned text with labelLarge typography

  • Accessibility support for enabled/disabled states

Usage Example:

var selectedTab by remember { mutableIntStateOf(0) }
val tabs = listOf("Overview", "Details", "Reviews")

JetpackTabRow(selectedTabIndex = selectedTab) {
tabs.forEachIndexed { index, title ->
JetpackTab(
selected = selectedTab == index,
onClick = { selectedTab = index },
text = { Text(title) }
)
}
}

Parameters

selected

Whether this tab is selected or not.

onClick

The callback to be invoked when this tab is selected.

modifier

Modifier to be applied to the tab.

enabled

Controls the enabled state of the tab. When false, this tab will not be clickable and will appear disabled to accessibility services.

text

The text label content.

See also

Container for tabs with indicator