Lazy layouts in Compose
Вставка
- Опубліковано 22 лип 2024
- Compose brings a simple and performant way of creating scrolling lists, with fewer lines of code than RecyclerView. Learn how lazy layouts enable adding content on demand, how to use Lazy composables, how these work under the hood, and optimization tips for better performance. Discover why you should always provide unique keys, avoid nested scrolling and 0-pixel sized items. Last, hear about exciting new features like lazy grids and item animations.
Resources:
Jetpack Compose Layouts → goo.gle/3r4gGtJ
Layouts in Jetpack Compose Codelabs→ goo.gle/3r4uqV8
Lists in Jetpack Compose codelab → goo.gle/3DN6Cu3
Common performance gotchas → goo.gle/3waBLFC
Speakers: Andrey Kulikov, Simona Stojanovic, Mihai Popa
Watch more:
All Google I/O 2022 Sessions → goo.gle/IO22_AllSessions
Android and Play at Google I/O 2022 playlist → goo.gle/IO22_AndroidDevs
All Google I/O 2022 technical sessions → goo.gle/IO22_Sessions
Subscribe to Android Developers → goo.gle/AndroidDevs
#GoogleIO #Featured #JetpackCompose - Наука та технологія
Amazing training series on Jetpack Compose. You guys are crushing it! It's a pleasure to learn from you.
Gran video, información valiosa! Muchas gracias por los tips que nos dan 💚
These are very helpful, keep them coming
Wow!! so valueable performance tips
Quite informative video filled with such a great presentation resources. Thanks guys!❤
We appreciate the kind words, Stevdza-San! You can also check out our guide on Custom layouts for Jetpack Compose: goo.gle/3CDQzzX and an amazing video with more helpful tips and tricks regarding Layouts: goo.gle/3fCcher
Happy learning ❤️
Incase this ends up helping someone...
We were animating visibility of a collapsible section in our lazy list by setting the "invisible" items to 0px height and this was causing a lot of latency.
You need to come back Mitch, we miss your awesome content.
yo Mitch wadduppp
If it's collapsible, why animate its measurement manually? Just use the AnimatedVisibility(Boolean) block around your composable, or take a look at the Animations docs to see how to handle performance, if it is the built in function really isn't suitable for your use case.
My guess is you're skipping steps that makes it performant, and AnimatedVisibility would handle it. Just keep in mind that each an every step of the animation (every pixel you reduce by) triggers a recomposition of the specific composable, and every single change to the specific composable triggers a recomposition of the Lazy list.
Also don't measure performance in a non release build (if you are). I've been collapsing cards in lists since Compose was beta, and I've never experience any jank, so just revise those manual implementations.
Also 13:14
Awesome video. Was hoping to get a hint of how to provide a background around a "section" of items since it is advised not to next two scrollables that scroll in the same direction.
What would you advise to implement an "excel-type" two-dimension scrollable grid of constand grid size?
It seem that nesting LazyRow in LazyColumn (or other way) is not good approach. Any suggestions?
Thank you guys... awesome
In 16:15 let's say I want to have some modifiers for items block (not in while LazyColumn) how can I do so?
Very helpful for me thanks Google
Great tip about default height
We're happy to hear the tutorial was helpful!
Be sure to check out the links in the description for even more tips and tutorials 😎
Damn good!
Thanks, very helpful! I also like how you invite speakers of different nationalities in one video, this earns respect
Great video! Presenters (especially the one in a dark shirt) clearly explain the concepts, thanks!
русский хвалит русского, неудивительно
They are all in the dark shirts ;)
Lepotica, steta da sam pre star za nju :)
Great video. Thanks! I tried adding a custom Arrangement.Vertical to my app and that part shown on the video by Andrey worked well but then tried adding spacing to it like what Arrangement.spacedBy does and failed. Are there any examples of a custom arrangement with item spacing?
When you implement your own Arrangement.Vertical you can also override spacing property, it is defined on the same interface
@@andreykulikov9166 i have overriden the spacing property but still havent got the spacing applied. I was thinking I would need to factor the spacing in the calculations for outPositions?
@@adrian110288 yeah, you need to provide your spacing for the spacing property, this will be used when you have enough items to fill the whole viewport, and then also take into the account the spacing manually when you do the outPositions calculations for the case when you have less items than needed to fill the viewport
HOW DO I UPDATE THE LIST WHEN I ADD/REMOVE ITEMS
Hi! When we can see the implementation of StaggeredGridLayout based on LazyLayout?
Thank you for the question! We are working on something like this. Keep an eye on our social media pages for updates!
Great video on working with lists in Compose. How does one achieve prefetching?
Hi Tashinga! Here's a link that might help you on your quest to learn more about prefetching: goo.gle/3ur5xof
😀
Greet! but there's no documentation to how to implement custom LazyLayout
Yes, we in fact intentionally didn't show it as the api is in its early stages and can change a lot. We didn't want this video to became outdated because of that. LazyLayout is not yet production ready, but I hope that the public documentation and the ability to read the sources of our components will allow the early adopters to try it out
I'm using compose 1.4.0-rc01, LazyVerticalGrid with coil. Grid is so laggy, Recycler view is much better, idk how is this stable (release build)
Magic
can I get google developers training courses like Jetpack Compose for Android Developers
as pdf documentation
Hi! You can check out the documentation for JetPack Compose and refer to it anytime on your journey here 😁: developer.android.com/jetpack/compose/documentation
LazyGrid can't be used inside other scrollable even is I set userScrollEnabled = false.
Is there a way to add space individual for rows ?
Could you please elaborate a bit more?
The two links provided here can help fill you in on how to add space in-between items and offer another helpful resource to aid you on your Compose journey! 😃
Content Spacing: developer.android.com/jetpack/compose/lists#content-spacing
Arrangements: developer.android.com/reference/kotlin/androidx/compose/foundation/layout/Arrangement#public-functions_1
I hope some day we get hard working layouts.
i cant import LazyHorizontalGrid in project?
Could you please check if you have added the following dependency to your project: "androidx.compose.foundation" and that you are running on the latest 1.2.0-beta02 Compose version? Thanks!
That moment when you don't have a scroll bar and your PO wants a scroll bar. Bad...
i should migrate my project to Compose 😮
why I can't add LazyRow in bottomsheet?
Hi Dimid,
We are not aware of LazyRow incorrectly working inside a BottomSheet. Please file a bug in our bug tracker if you think you found it not working for you 🙂
i am too lazy now.
Dont mean to be rude, but I wonder if its just me who doesnt enjoy watching many people present in the same video/tutorial.
Where is this common performance gotchas talk they keep mentioning ,
EOQB8PTLkpY (ID of YT video)
ua-cam.com/video/EOQB8PTLkpY/v-deo.html
It is now called "Performance best practices for Jetpack Compose". You can find it on the same channel "Android Developers"
bm - 5:21
Hola soy felipe desanjoseterueltepeojuma puebla
Beginner Friendly NOT!
I understood what the woman was saying.