Zafouche
commented
1 week ago Well done ! I see why it may have been difficult for you to choose the right paddings to make the left edge cut the association logos when scrolling. I used git checkout to play a bit with your interface and that's really intuitive. Bravo !
Thank you! Yes, I was losing my mind at some point haha, but then I understood better how to juggle between the general padding and the contentPadding(which is more specific to the LazyColumn and LazyRow).
sonarcloud[bot]
Goal
The goal of this PR was to adapt the explore screen UI to better resemble the figma. This includes:
Challenge
The main challenge was the behavior of the lists.
For the rows: At the start, the leftmost item has to show up somewhat away of the left edge. However, if we swipe left, the leftmost visible item has to cut at the edge of the screen, which was a challenge to define well because of how the paddings function. The same goes for the rightmost item, which has to have the right behavior in terms of "hiding" behind the screen, at the edge and not at some virtual edge, that's before the physical edge, that can be caused by padding.
For the column: The feature was the same. The items have to, this time, hide behind to bottom app bar. Again, paddings caused trouble in the fact that, for the last row, the name of the associations would be hidden behind the bottom app bar. This has been managed in a similar way to the rows.
What's left
This PR allows us to have somewhat a final design of the screen. Now, the backend remains. In a following PR, this screen will be adapted such that is used the view model to fetch the data. However, this requires two other things: defining association categories in our firestore, and having the logo image urls in each association's data in firestore. When this is done, the
Explorescreen will be finalized.