TitleBar.md

TitleBar

TitleBar is a wrapper around TopAppBar and a short replacement for the following code which is often repeated all over the app :

Scaffold(
    modifier = Modifier.fillMaxSize(),
    topBar = {
        TopAppBar(
            title = {
                Text(title)
            }
            // Custom Navigation Icon or Navigate Up
            // Actions
        )
    }
) { paddingValues ->
    // ... Content
}

The replacement for this code is the TitleBarScaffold composable :

@Composable
fun TitleBarScaffold(
    title: String,
    navigationIcon: (@Composable () -> Unit)? = null,
    navigateUp: (() -> Unit)? = null,
    actions: @Composable RowScope.() -> Unit = {},
    content: @Composable (PaddingValues) -> Unit
)

You can define the following :

• title to be displayed on the TopAppBar

• navigationIcon composable to be displayed to the left of title

  

• navigateUp lambda, when passed, displays Back navigationIcon, on click of which this lambda is executed

  

• actions composable to be displayed at the end of the TopAppBar

  

Example :

TitleBarScaffold(
    title = "DroidLibs Sample",
    navigateUp = { navController.navigateUp() }
) { paddingValues ->
    // ... Content
}

If you want to define your own Scaffold, then use the TitleBar composable :

@Composable
fun TitleBar(
    title: String,
    navigationIcon: (@Composable () -> Unit)? = null,
    navigateUp: (() -> Unit)? = null,
    actions: @Composable RowScope.() -> Unit = {}
)

Example :

Scaffold(
    topBar = {
        TitleBar(
            title = "Profile"
        )
    }
) { paddingValues ->
    // ... Content
}