jetc.dev Newsletter Issue #151
alpha05 dropped, including a significant change for Wear Compose, pointing
to future Material3 support on your wrist!
Beyond that, we look at
LaunchedEffect(), see how our UI tests can be flaky,
and figure out why our composables are so darn slow. Plus, we look at auto-sizing
text and more options for navigation.
Ooooo… What Did We Get?
Reviewing the release notes for the latest Jetpack Compose update!
1.4.0-alpha05 of Compose UI is out, including:
Test functions (e.g.,
runComposeUiTest()) that take a
DatePickerDialog()in Material3 (
Various bug fixes
Wear Compose now has a
1.2.0-alpha03 version. Besides bug fixes, the big thing
ScalingLazyColumn() has moved from
androidx.wear.compose.foundation.lazy, both in terms of packages and in terms
of artifacts. Not only is
ScalingLazyColumn() not really tied to Material, but
the Wear Compose team is starting work on Material3, so some things will
as part of that.
One Off the Stack, One Off the Slack
You’ve got questions. That’s understandable!
When Does LaunchedEffect() Fire?
LaunchedEffect() is supposed to be executed once for a composition, even if
that composition gets recomposed. If it seems like yours is being executed more
often, perhaps the composition containing the
LaunchedEffect() is getting
disposed and recreated, rather than simply being recomposed. Learn more in this
week’s highlighted Stack Overflow question.
No, Really, When Does LaunchedEffect() Fire?
Sometimes, you may be trying too hard to have too-simple of a
For example, if you think that you want your
LaunchedEffect() to not run on the
initial composition (but only on recompositions), there may be a better solution,
such as using
drop() on a
Flow. See an example in this week’s highlighted
#compose Slack thread.
Posts, videos, and other new information related to Jetpack Compose!
Medium: Density, Devices and Flaky Tests
Google’s Alex Vanyo notes tests need to test what they are testing. That may sound circular. The problem stems from testing something similar to what they need to test, which may lead to failures. Alex specifically examines how density scaling may result in slightly different calculations depending on the scaling factor, and how that can make a composable test flaky.
Medium: Optimize or Die. Profiling and Optimization in Jetpack Compose
Sergey Panov explores how to determine where your composable time is being spent, from measuring over-composition to CPU and GPU profiling techniques.
Relay Anchor Leg: Overall impressions
Kristen Halper wraps up her three-post series on Relay, looking at some of her favorite features (e.g., synchronization of comments) and where she hopes Relay will go in the future (e.g., better accessibility support).
Ask other apps for photos, files and more using ActivityResultContracts
This week, Alex Styl looks at
rememberLauncherForActivityResult(), the composable
bridge to the
ActivityResultContracts approach for interacting with other apps.
Alex explores pretty much all the
ActivityResultContracts options (e.g.,
StartActivityForResult()) and also outlines how to create your own
Medium: Compose these composites
Last week I pointed out Composites Fiberglass. This week, Vladimir Raupov walks us through Fiberglass and how we can use it to assemble complex composable UIs from smaller building blocks.
Medium: Compose Multiplatform Web
Debdutta Panda walks us through setting up a Compose for Web project, what the template’s generated code does, and how to serve the resulting Web code for testing in a browser.
Medium: Animated Selector in Jetpack Compose
Peter Törnhult used
AnimatedStateListDrawable with the classic
for things like bottom nav tab icons, so the selected state looks different than
the normal state. Peter wanted to reuse those drawables, so he used an
to bridge the gap.
Other Interesting Links
- Animated Drawer in Jetpack Compose
- Medium: 5 Metaball Animations in Jetpack Compose
- Medium: A Day of Resolving Errors in Android Jetpack Compose
- Medium: Side effects and handling them in Jetpack Compose
- Medium: Handling Back Presses in Jetpack Compose and OnBackInvokedCallback
- Jetpack Compose Tutorial: Replicating Dribbble Audio App Part 2
- Medium: Create a fancy RecyclerView-like ListView in Jetpack Compose using Card and Coil for each list item
- Android Jetpack Compose Filter Tutorial
- How to Implement Checkbox in Jetpack Compose?
- Medium: Jetpack Compose Tutorial Part 1
- Jetpack Compose; A Modern UI ToolKit
- Medium: 20 Essential Compose Questions for Android Developers
- Medium: Exploring the Wonders of Jetpack Compose — Unlock the Power of Code!
100% pure code!
Fabrice Thilaw created a
ResponsiveText() composable that provides support
for different text scales, configured via a
textScale parameter. In other words,
ResponsiveText() covers auto-sizing the way the
autoSize attributes do in
Roudi Korkis Kanaan offers another navigation library for Compose UI, with supports
for screens, sheets, and dialogs. It also uses a
NavigationKey class to wrap
up destination identifiers and arguments to be passed to those destinations.
GitHub: uragiristereo / safer-navigation-compose
If you would prefer to stick with the official navigation option, Agung Watanabe created
a wrapper around Navigation for Compose that offers type safety on arguments,
Other Interesting Links
- GitHub: Pandaradox / a11yoop (accessibility testing support)
- GitHub: yusufarisoy / compose-paging (paged data implementation)
- GitHub: icerockdev / moko-resources (Kotlin/Multiplatform string resources)
- GitHub: zeeshanali-k / Typist (typing animation)
- GitHub: pdrozz / tutorialbox-compose (coachmarks)
- GitHub: wajahat-iqbal / BlurHashPainter (blurhash support)
- GitHub: qamarelsafadi / QIndicators (loading/paging dots)
- GitHub: Kyant0 / ComposeMonet (Material You dynamic themes)
Or, you can subscribe to the Atom feed or follow Mark Murphy in the Fediverse.
- 2023-03-14: Compose RC! Wear Compose alpha! Grayscale composables! Updating our Compose dependencies! MVVM! Bottom sheets! And... another Figma-to-composable plugin?!?
- 2023-02-28: Updates to the Compose family of artifacts! Layout()! UiAutomator! Pull-to-refresh! @email@example.com on adding animation sizzle! ExoPlayer! PIN entry! And... @firstname.lastname@example.org is on TV?!?
- 2023-02-21: Modifiers! Drawing! Errors! Paging (and testing paging)! QR codes! KMM templates! And a correction from @email@example.com!