If I want to have a UI like this ```Column() { T...
# compose
s
If I want to have a UI like this
Copy code
Column() {
  TransparentTopAppBarWithAnActionOnTheRight()
  Column(Modifier.weight(1f).verticalScroll()) {
    content()
  }
}
But I want the inner column to be able to show below the top app bar, is there a way to achieve it? I am trying to figure out how the outer column places the children, and if there’s a way for me to basically tell it that it can place one under the other, but the inner column can render outside of the bounds it’s given, so that it will show below the TopAppBar (which is transparent in my case). For now what I am doing is a
Box() { TopAppBar(Align.TopRight); Column { content() } }
But I’d rather not do that if possible, since this way I need to manually add enough space on the column so that things by default start below that top app bar, before they can render below it.
Basically this is what I don’t want, and it’s not because the top app bar is taking the space, it’s transparent, it’s because the inner column is constraining its children only to that space below the top app bar.
s
Haven't tried it, but maybe
Scaffold
with
topBar
can help you achieve this 🤔
t
Not sure if i understood you problem right. (I assume you want that your list scrolls under the icon but also that there is enough empty space on top of the list to scroll outside of the action button.) This is reached normally by defining some spacers. E.g.:
Copy code
LazyColumn(state = listState, contentPadding = padding.add(bottom = bottomSpace))
Here the FAB is at the bottom. And yes you are right Scaffold would also do this for you. But you also need to use the content padding parameter there. It will be automatically calculated for the FAB.
s
Yeah, Scaffold does do what I want, albeit through the use of SubCompose to get the height of the top app bar to pass as padding values inside the content. I think my best bet is to emulate what Scaffold does, but since my top app bar is super straightforward and with fixed height, pass that height (+ insets) myself as the first item in the inner column and render them in a box layout so that they are stacked on top of each other, while avoiding SubComposition.