JetpackTopAppBar
A Jetpack Compose top app bar with a title, navigation icon, and action icon.
Center-aligned top app bar with navigation and action icons. Use for screens that need both back navigation and a primary action.
Usage Example:
JetpackTopAppBar(
titleRes = R.string.edit_profile,
navigationIcon = Icons.AutoMirrored.Filled.ArrowBack,
navigationIconContentDescription = "Navigate back",
actionIcon = Icons.Default.Save,
actionIconContentDescription = "Save changes",
onNavigationClick = { navController.navigateUp() },
onActionClick = { viewModel.saveProfile() }
)Parameters
The string resource ID for the title of the top app bar.
The navigation icon to be displayed on the top app bar.
The content description for the navigation icon.
The action icon to be displayed on the top app bar.
The content description for the action icon.
The modifier for this top app bar.
The colors for this top app bar.
The callback when the navigation icon is clicked.
The callback when the action icon is clicked.
A Jetpack Compose top app bar with a title and action icon.
Center-aligned top app bar with only an action icon (no navigation icon). Use for top-level screens where back navigation isn't needed.
Usage Example:
JetpackTopAppBar(
titleRes = R.string.settings,
actionIcon = Icons.Default.Info,
actionIconContentDescription = "About",
onActionClick = { navController.navigate(About) }
)Parameters
The string resource ID for the title of the top app bar.
The action icon to be displayed on the top app bar.
The content description for the action icon.
The modifier for this top app bar.
The colors for this top app bar.
The callback when the action icon is clicked.