jetc.dev Newsletter Issue #170
We got another round of Compose updates, including the first alpha for
In addition, we look at required sizes and line breaks. We explore
and compare declarative UI frameworks. We try to avoid folds and create expandable
lists. Plus, we see new entrants in the competitive spaces for navigation and image loading.
Ooooo… What Did We Get?
Reviewing the release notes for the latest Jetpack Compose update!
The Compose BOM is up to
2023.06.01, though right now the “BOM to library version mapping”
page does not cover that version. 🤔
The main Compose libraries are up to
1.6.0-alpha01, even though the
series is still in beta. Of note:
falseby default, which may require you to tweak your
Text()and related composables, or at least update screenshot tests
AnchoredDraggablewas added to help simplify drag actions, such as opening bottom sheets — this replaces Compose Material’s
SwipeableAPIs, which are now deprecated
There is a renewed focus on performance, with several runtime changes that should reduce recompositions, memory usage, and unnecessary recalculations
LazyList()supports some lookahead-based optimizations
FocusRequester()now supports saving/restoring which child composable has the focus
In terms of Compose-adjacent libraries:
androidx.activity:activity-composeis up to 1.8.0-alpha06
Paging for Compose (
androidx.paging:paging-compose) is up to
Wear Compose’s main libraries are up to
One Off the Stack, One Off the Slack
You’ve got questions. That’s understandable!
Google’s Ian Lake explains why a
size modifier (that affects both dimensions) may appear
to work differently than using
height modifiers separately, in this week’s
highlighted Stack Overflow question.
Text() composable handles line breaks automatically, but sometimes you may want to
adjust the approach, such as to have more balance between the words on each line rather
than have one long line and one short one. See more about the
lineBreak option on
in this week’s highlighted Kotlinlang
#compose Slack thread!
Posts, videos, and other new information related to Jetpack Compose!
Microsoft’s Kristen Halper and Google’s Jossi Wolf announced the release of
FoldAwareColumn() as part of Accompanist Adaptive.
FoldAwareColumn() works like an ordinary
Column(), except it can have its contents
skip around hinges. You get to control how much padding to place around the fold,
which children can appear through the hinge, etc.
Francesc Vilarino Guell is back, looking at
anchorDraggable(), a modifier new to
anchorDraggable() assists in drag
behavior (e.g., opening a bottom sheet), though it only tracks the drag — actually doing something to render
the drag is up to us.
Vinay Gaba added a tool to JetpackCompose.app to let you compare syntax and approaches between Compose, Flutter, React, and SwiftUI.
The SemicolonSpace team walks us through using
including their support for
Adaptive column/row counts,
inter-cell spacing, and more.
Mrugendra Thatte is demonstrating creating expandable lists, where a list item (such as a section header) can be expanded or collapsed. In Part 1, Mrugendra sets up the basic implementation. In Part 2, the focus is on animating the transition between expanded and collapsed states.
Oğuzhan Aslan explores using
AndroidView() to wrap a
WebView and turn it into
a composable. Oğuzhan then compares and contrasts that with the
from Accompanist, which offers more features with less effort.
Other Interesting Links
- Medium: Negative Padding For Jetpack Compose Made Possible
- Medium: Use Google Cloud Text-to-Speech in Jetpack Compose
- Medium: Implementing the Shimmer Effect in Jetpack Compose for Android Apps
- How to Create Gradient Backgrounds in Jetpack Compose?
- Medium: User stack animation in Jetpack Compose
- Medium: Theme picker animation in Jetpack Compose
- Podcast: Effective Android with Jorge Castillo
- Introducing Compose Hammer: A Powerful Jetpack Compose Material3 UI Builder Plugin
- Medium: Building a Modular White Label App
- Medium: Building Compose-Driven Architecture On Android With Circuit
- Medium: Exploring Jetpack Compose UI Testing
- Medium: Unit Test in Jetpack Compose
- Material 3 TopAppBar in Jetpack Compose (with Examples)
- Video: Jetpack Compose Best Practices - AMA
- Medium: Compositional Locals for Navigation in Jetpack Compose
- Medium: Navigation, Animation, and Data Passing using Android JetPack.
100% pure code!
Chirag Thummar posted a short snippet showing a
bounceClickable() modifier that
supports click/double-click/long-click events on a composable, while simultaneously
offering a bounce effect to draw attention to the UI element.
CHERFAOUI Oussama offers a quick demonstration of using
as an image picker, then rendering the result using Coil. See this Medium post
for more on the implementation.
- 2023-09-12: Compose 1.5.1! Glance 1.0.0! Compose Multiplatform! Themes! Photos! Coachmarks! A bit of CommonsWare history! And @firstname.lastname@example.org tells us what not to do!
- 2023-09-05: Compose Compiler 1.5.3! Compose Multiplatform 1.5.0! @email@example.com on greyscaling composables! @firstname.lastname@example.org on Espresso testing with Compose interop! Scrollbars! AnnotatedString!
- 2023-08-29: Compose Compiler 1.5.2! Compose and Wear Compose alphas! Capture composables to bitmaps! Testing! Recomposition! Compose Multiplatform! And... Accompanist is downsizing?!?