Channels
#compose
Title
# compose
r
Rooparsh
05/02/2020, 2:04 PMHi, just a newbie to Compose. Trying to show a list of data with bottom app bar. I have used scaffold as a parent with AdapterList as body content and bottomappbar. The problem is my AdapterList is being overlapped with bottomappbar and I can't seem to find any way around it. I am using dev09 . I know its childish mistake.
k
Kazemihabib1996
05/02/2020, 2:25 PMPlease, share your code.
r
Rooparsh
05/02/2020, 2:28 PM@Kazemihabib1996 please find my code sample attached.
@Kazemihabib1996 Also attaching a screenshot for reference. Also found out that the list is not scrolable
k
Kazemihabib1996
05/02/2020, 2:57 PMIt seems to be a bug,
you can add some padding to the you content untill compose fix this problem:
`Column(modifier = Modifier.padding(start = 20.dp, end = 20.dp, bottom = 56.dp)) {1
And I think your list not scrolls because you don't have enough items in your list to make it scrollable, try adding some items, I think that would fix it
r
Rooparsh
05/02/2020, 3:47 PM@Kazemihabib1996 currently I have 50 items in the list
k
Kazemihabib1996
05/02/2020, 3:47 PMabout the content I was wrong
I read the source of Scaffold, it works like this
it calculates the
BottomAppBarmodifier.padding(bottom = ..)so the correct way is to do it like this:
bodyContent = { modifier -> Content(modifier, list = ... }) },
and
Copy code
fun Content(modifier: Modifier, list: List<String>?) {
Column(modifier = modifier.padding(start = 20.dp, end = 20.dp)) {s
SaurabhS
05/02/2020, 3:51 PMAdapterList not scrolling is a bug in recent versions. It's fixed in the latest snapshots.
r
Rooparsh
05/02/2020, 3:54 PM@Kazemihabib1996 Thanks. It works and also this makes the list scrollable.
👍 1
k
Kazemihabib1996
05/02/2020, 3:58 PMIt was in the documentation and it's weird I've never read that before 🙂
* @param bodyContent content of your screen. The lambda receives a Modifier that should be
* applied to the content root to get the desired behavior. If you're using VerticalScroller,
* apply this modifier to the child of the scroller, and not on the scroller itself.
👍 1
r
Rooparsh
05/02/2020, 4:01 PMEven I missed that
l
Leland Richardson [G]
05/02/2020, 9:12 PMyep. That modifier is passed through precisely because this bug will happen if you don’t…
we aren’t exactly happy with this solution, but have been struggling to find a better way. My fear is that most people will do exactly what you did and completely miss the fact that a parameter is passed in here.
👍 1
k
Kazemihabib1996
05/03/2020, 8:23 AM@Leland Richardson [G]
would you mind explain it a little more why you can't be apply that modifier inside the Scaffold? I mean what are the challenges of that approach?
l
Leland Richardson [G]
05/03/2020, 4:13 PMWell the problem is that the modifier really needs to be passed into the scroller
but we didn’t want Scaffold to create its own scroller, since that will usually be a component that you want to control explicitly
also you could have the scroller be nested in a few other composables, so won’t necessarily be a direct child
k
Kazemihabib1996
05/03/2020, 4:57 PMOh, right, thank you
@Leland Richardson [G]
I like to understand everything, sorry if I'm asking too many questions.
And why you can't just wrap the bodyContent inside a box and apply the modifier to that box? what problems it might cause?
l
Leland Richardson [G]
05/03/2020, 5:02 PMno worries at all!
🙏 1
honestly i don’t know all of the specifics here, but my understanding is it had to be applied to the scrollable element
👍 1
2 Views