https://kotlinlang.org logo
Channels
Powered by
j

John O'Reilly

08/07/2020, 4:38 PM
sorry if this has been covered before but .....am using 
Scaffold
and the 
LazyColumnFor
looks to be overlapping with 
BottomAppBar
...is there some modifier etc I should be using in this case (will add more code in thread)....
Copy code
Scaffold(
        topBar = {
            TopAppBar(title = { Text("Bike Share") })
        },
        bodyContent = {
            LazyColumnFor(items = stationsState.value) { station ->
                StationView(station)
            }
        },
        bottomBar = {
            BottomAppBar(content = {
                BottomNavigationItem(icon = { Icon(Icons.Default.LocationOn) }, label = { Text("Galway") },
                    selected = bottomBarSelectedIndex == 0,
                    onSelect = {
                        bottomBarSelectedIndex = 0
                        bikeShareViewModel.setCity("galway")
                    })

                BottomNavigationItem(icon = { Icon(Icons.Default.LocationOn) }, label = { Text("Oslo") },
                    selected = bottomBarSelectedIndex == 1,
                    onSelect = {
                        bottomBarSelectedIndex = 1
                        bikeShareViewModel.setCity("oslo-bysykkel")
                    })
            })
        }
    )
m

matvei

08/07/2020, 4:40 PM
bodyContent
lambda has a parameter 
innerPadding
, please, apply it as a 
contentPadding
parameter in the 
LazyColumnFor
and it should work
Later we will figure out how to make this automatically, but for now manual wiring is required unfortunatelly
Copy code
bodyContent = { innerPadding -> 
            LazyColumnFor(
   contentPadding = innerPadding, 
   items = stationsState.value) { station ->
                StationView(station)
            }
        },
j

John O'Reilly

08/07/2020, 4:43 PM
thanks @matvei, that did the trick
m

matvei

08/07/2020, 4:45 PM
No problem! It's needed to make sure you content scrolls under the 
bottomBar
in case it's semi-transparent or has a cutout, so with this 
contentPadding
you will be able to see all content when scrolled down, but content will scroll under the 
bottomBar
anyway
j

Josh Feinberg

08/07/2020, 10:10 PM
@matvei - i was using the inner padding as a modifier before 
Modifier.padding(innerPadding)
, Is there benefit of 
contentPadding
over this?
ah, doesn't look like it. the innerPadding just ends up being used in a modifier anyways
m

manueldidonna

08/08/2020, 10:38 AM
contentPadding is like padding + clipToPadding=false on Recyclerview
m

matvei

08/10/2020, 10:42 AM
Basically
Copy code
ScrollableRow(contentPadding = innerPadding) {
     text.forEach { Text(it) }
}
is equals to
Copy code
ScrollableRow() {
    Row(modifier=Modifier.padding(innerPadding)) {
         text.forEach { Text(it) }
    }
}
but without additional Row. We provide this shortcut so it's easier to use with 
Scaffold
and you don't need additional layout strategy inside the ScrollableRow
Powered by