My app is using `Scaffold` and I upgraded to Material3. In the Scaffold I specify: `topBar`, `conten...

# compose

[Daniele B]

My app is using Scaffold and I upgraded to Material3.
In the Scaffold I specify: topBar, content, bottomBar.
The topBar is a TopAppBar.
The content is a scrolling LazyColumn .
The top part of the content is now hidden below the topBar, while before it was starting below the topBar.
Is there a specific parameter I need to set in order to see the whole content?

[chr]

The content lambda actually takes in one argument that the Scaffold will pass in for padding that you would need to respect in order to not be obscured by the `topBar`:

Scaffold(
  topBar = { ... },
  content = { contentPadding ->
    LazyColumn(Modifier.padding(contentPadding)) {
      // ...
    }
  },
)

[Daniele B]

The LazyColumn is actually wrapped in other 3 composable. Which means means I have to propagate that contentPadding 3 times.
So, is this a design change of Scaffold in Material3? I didn't need to specify any padding before.

[mkrussel]

You can apply the padding to the first composable that in the content, you don't have to apply it to the LazyColumn directly.

[Stylianos Gakis]

Maybe the problem is that they don’t want to change the padding, but the LazyList’s contentPadding instead, so that the content still draws behind those paddings?

[dewildte]

I thought Material 2 Scaffold also passed in a contentPadding argument. The IDE even gives you a warning if you are not using it.

[mkrussel]

Material 2 did, but I think it only included the bottom bar.

[Daniele B]

Thanks @mkrussel, I solved it by applying the padding to the first composable. Yes, it seems in Material 2, it didn't apply to top bar

[Zoltan Demant]

Isnt this because the TopAppBar can scroll with the content in M3? I dont think that was the case in M2