In July 2024, we launched a model new YouTube sequence referred to as “Compose Suggestions for Pleasant UI”. The sequence got down to give brief, actionable and technical suggestions for working with Jetpack Compose and share small examples of APIs that aren’t as broadly recognized.
We aimed to point out how you may obtain a premium appear and feel of your app, by utilizing the powers and strengths of Compose, and canopy the most essential (however low price) UI ideas to remember when designing and creating an app.
With the top of 2024 approaching, we ended our Season 1 which lined quite a lot of totally different, pleasant matters that can make your UIs shine:
Edge-to-edge and insets
Discover ways to simply make your Android apps go edge-to-edge utilizing Compose, making certain it has a contemporary, pleasant UI. Comply with three easy steps to securely deal with insets, to forestall content material from overlapping system UI parts:
Pager
Simply add the Pager composable to your apps to get out of the field, pleasant gestures on paged content material. This episode covers the right way to use the Pager composable, configuration parameters resembling controlling the fling distance, and tying into the PagerState to create animations:
Nested scrolling
Scrolling could be a precious instrument for making enjoyable and pleasant apps! On this episode, discover ways to use nested scrolling in Compose, for a seemingly complicated coordination between a number of elements on a single scroll:
Brush
Brushes in Jetpack Compose are a basic half as to how content material is drawn on display. Understanding the several types of brushes you need to use might help make your app stand out from the group. On this episode, we dive into strong shade brushes, totally different gradient brushes, in addition to numerous choices for gradient brushes:
Shaders
Along with Brushes, in Compose there may be one other pleasant mechanism for portray your pixels and rendering graphics on display, referred to as Shaders. On this episode, we dive into the small print of utilizing shaders in Jetpack Compose, mixed with render results and the way they are often utilized to your complete UI:
Movement layouts
FlowRow and FlowColumn are just like Row and Column layouts, nevertheless the gadgets will movement into the following row or column when there isn’t a extra space within the space. On this video, Movement layouts are lined together with the right way to use them and methods for utilizing them to work on totally different window sizes:
Lazy grids
Lists are very important to the Android UI — we use columns and rows in every single place in our apps! This episode exhibits how grids can typically function a greater different, to make these layouts extra dynamic and pleasant — particularly when supporting totally different window sizes throughout gadgets:
AnchoredDraggable
On this episode, we cowl Compose AnchoredDraggable, which is a Jetpack Compose API that allows you to construct elements that may be dragged between anchor factors and settles an anchor level on the finish of the gesture. AnchoredDraggable is usually used to construct elements like SwipeToDismiss, Navigation Drawers, Backside Sheets and extra:
Graphics layers
Study all about Graphics Layers in Compose and the way you need to use the APIs to composite graphics layers collectively to create attention-grabbing visible results. This episode covers the right way to use mix modes to mix between two layers, and the right way to set the saturation of a complete layer:
Clipping and masking
Clipping or masking elements of your content material is a technique to create pleasant UI results, and is a standard want when working with customized UI elements. Clipping is the method of eradicating elements of your content material based mostly on a set path or form, whereas masking is analogous, however permits for semi-transparent pixels too:
You possibly can try the complete YouTube playlist right here.
We’re extremely grateful to your suggestions and recommendations for what else you’d wish to see us cowl, so please maintain it coming.
See you quickly for Season 2 in 2025 — blissful composing!
