jetc.dev Newsletter Issue #196
Published: 2024-01-02
Welcome to 2024!
It was a quiet week in the Compose world, but we still learn a bit about
rememberUpdatedState()
and semantics()
, explore immutability and infinity, and
peek at libraries for atomic design and cross-platform drag-and-drop.
One Off the Stack, One Off the Slack
You’ve got questions. That’s understandable!
Why Does My onTap
Lambda Not See Updated State?
If you have a lambda expression that lives for an extended period, such as onTap
for detectTapGestures()
, consider using rememberUpdatedState()
for tracking
state referenced inside that lambda, instead of assuming that referenced values will
change on recomposition. See an example of the problem and the solution in this week’s
highlighted Stack Overflow question.
How Can We Use Platform-Specific State with Non-Compose State Holders?
Not all Kotlin Multiplatform projects use Compose Multiplatform. Such projects aim to avoid
platform-specific constructs in their state holders, such as the TextFieldState
for
what is now known as BasicTextField2()
. Yet, sometimes those constructs are necessary,
such as for proper cursor management in BasicTextField2()
. Walk through the problem
and see some approaches, such as expect
/actual
, in this week’s highlighted Kotlinlang
#compose
Slack thread.
Composable Commentary
Posts, videos, and other new information related to Jetpack Compose!
Medium: Stable and Immutable in Jetpack Compose
Kaushal Vasava walks us through the impacts of mutable data on recompositions,
the definitions and impacts of “skippable” and “restartable” composables, and
the use of @Immutable
and @Stable
annotations.
Medium: Pragmatic UI testing in Jetpack Compose
Nicola Gallazzi explains how to use the semantics()
modifier both for accessibility
and for helping to identify composables for automated UI tests.
The State of Compose 2023
Alex Styl is running a survey “to get a better understanding of the Compose ecosystem and raise awareness of the different APIs available to developers, along with the community resources that people use”. The survey is open through the end of January, with the results slated to be published in February.
Medium: Creating an Animated Infinity Loader with Jetpack Compose: Exploring Path Animation
Medium user Kappdev wanted a loading indicator in the shape of the infinity symbol (∞),
with the shape being traced and un-traced by a glow highlight. The resulting InfinityLoader()
composable uses an infinite transition to determine what part of the symbol’s path
should be highlighted, with that path being drawn to a Canvas
.
Other Interesting Links
- How to Use Jetpack Compose Inside Android Service
- Medium: Android WearOs — Kotlin & Jetpack Compose UI : Round Text, Curved Text, Curved Layout
- Medium: Bottom Bar Navigation in Jetpack Compose
- Medium: Capturing and cropping images from gallery or camera with Jetpack Compose
- Medium: Everything I know about Composable UI Testing: Basic Isolated Component Testing
- Medium: Exploring Jetpack Compose: Building a Feature Introduction Screen with HorizontalPager
- Medium: Fetching Network Images With Compose Multiplatform
- Medium: Mastering Google Map in Jetpack Compose style
- Medium: Mastering Layout Basics in Jetpack Compose
- Medium: Performance Optimization in Jetpack Compose
- Medium: Strategy Pattern in Jetpack Compose
- Slides: Relay: The Future of Design to Code Workflows
- Work with Material 3 icons in Android Studio and Jetpack Compose
Resource Roundup
100% pure code!
GitHub: mrmans0n / compose-rules
Twitter had published a library of ktlint/Detekt static checks for Compose code. However, none of the maintainers remain at that firm, so Nacho Lopez (one of the original maintainers) forked it and has published it under new Maven coordinates.
GitHub: Tweener / c-zan
Vivien Mahé published a wrapper around the Material3 theme for Compose that follows the Atomic Design system.
GitHub: MohamedRejeb / compose-dnd
Mohamed Rejeb released a library with a Compose Multiplatform implementation of drag-and-drop support, along with dedicated support for reorderable lists.
GitHub: furkanayaz / Slippy-Bottom-Bar
GitHub user furkanayaz created a bottom nav bar implementation, with animated effects as the user selects different bottom nav items.
Other Interesting Links
- Compose Highlighter (IDE plugin with a color editor)
- GitHub: ShiftHackZ / DayNightSwitch (stylized switch for day/night theme change)
Notable Releases
Coil, as of its 3.0.0-alpha01
release
now supports Compose Multiplatform. There are new Maven coordinates and artifact names to allow
Coil 3 to work alongside Coil 2 without conflicts. This upgrade guide
provides additional details.
Or, you can subscribe to the Atom feed or follow Mark Murphy in the Fediverse.
Recent Issues:
- 2024-10-01: Lazy grids! Focus! @colinmarsch@androiddev.social on CMP accessibility! @skydoves@androiddev.social on Landscapist! @sinasamaki@androiddev.social on Slider()! And... what is it?!?
- 2024-09-24: A Compose security fix and a new alpha! clipToBounds()! Localization! offset()! @skydoves@androiddev.social on server-defined UI! Bottom sheets! And... someone set us up *3* BOMs?!?
- 2024-09-17: Compose 1.7.1 and Compose Multiplatform 1.7.0-beta02! Flow layouts! TV Compose! SharedBounds! Image cropping! And... why does remember() not seem always to remember?!?