A modern programming language that makes developers happier.

kotlinlang

Just dipping my toes into m3 now. Does m3 have a collapsing toolbar or do I have to build out that functionality myself. my scenario is having the toolbar react to scroll state.

<https://github.com/material-components/material-components-android/blob/master/docs/components/TopAppBar.md#collapsing-top-app-bars|This>?

Hm. lemme see if that has similar docs for compose because that looks like xml?

Yes it exists <https://developer.android.com/reference/kotlin/androidx/compose/material3/package-summary#centeralignedtopappbar|https://developer.android.com/reference/kotlin/androidx/compose/material3/package-summary#centeralignedtopappbar>

<https://m3.material.io/components/top-app-bar/overview|https://m3.material.io/components/top-app-bar/overview>

`@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun PinnedSmallTopAppBar() {
    val scrollBehavior = remember { TopAppBarDefaults.pinnedScrollBehavior() }
    Scaffold(
        modifier = Modifier.nestedScroll(scrollBehavior.nestedScrollConnection),
        topBar = {
            SmallTopAppBar(
                title = { Text("Small TopAppBar") },
                navigationIcon = {
                    IconButton(onClick = { /* doSomething() */ }) {
                        Icon(
                            imageVector = <http://Icons.Filled.Menu|Icons.Filled.Menu>,
                            contentDescription = "Localized description"
                        )
                    }
                },
                actions = {
                    // RowScope here, so these icons will be placed horizontally
                    IconButton(onClick = { /* doSomething() */ }) {
                        Icon(
                            imageVector = Icons.Filled.Favorite,
                            contentDescription = "Localized description"
                        )
                    }
                    IconButton(onClick = { /* doSomething() */ }) {
                        Icon(
                            imageVector = Icons.Filled.Favorite,
                            contentDescription = "Localized description"
                        )
                    }
                },
                scrollBehavior = scrollBehavior
            )
        },
        content = { innerPadding -&gt;
            LazyColumn(
                contentPadding = innerPadding,
                verticalArrangement = Arrangement.spacedBy(8.dp)
            ) {
                val list = (0..75).map { it.toString() }
                items(count = list.size) {
                    Text(
                        text = list[it],
                        style = MaterialTheme.typography.bodyLarge,
                        modifier = Modifier.fillMaxWidth().padding(horizontal = 16.dp)
                    )
                }
            }
        }
    )
}`

<https://developer.android.com/reference/kotlin/androidx/compose/material3/TopAppBarScrollBehavior|https://developer.android.com/reference/kotlin/androidx/compose/material3/TopAppBarScrollBehavior>
For more variants