My app is using `Scaffold` and I upgraded to Mater...
# compose
d
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?
c
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`:
Copy code
Scaffold(
  topBar = { ... },
  content = { contentPadding ->
    LazyColumn(Modifier.padding(contentPadding)) {
      // ...
    }
  },
)
d
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.
m
You can apply the padding to the first composable that in the content, you don't have to apply it to the LazyColumn directly.
☝️ 3
s
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?
d
I thought Material 2 Scaffold also passed in a contentPadding argument. The IDE even gives you a warning if you are not using it.
m
Material 2 did, but I think it only included the bottom bar.
d
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
z
Isnt this because the TopAppBar can scroll with the content in M3? I dont think that was the case in M2