jetc.dev Newsletter Issue #32
Published: 2020-09-22
alpha03
is out! On the whole, it was a fairly quiet release, with few major
breaking changes mentioned in the release notes.
This week, we will look at those changes, explore state and immutability, work
with Column()
, and see some early experiments in layout XML to composable conversions.
Plus, Leland Richardson is live!
(well, OK, he’s not live right in this email – that would be rather weird)
One Off the Stack, One Off the Slack
You’ve got questions. That’s understandable!
Jetpack Compose State
State is a never-ending source of Compose confusion. In this week’s highlighted
Stack Overflow question, a developer was having difficulty understanding
why modifying a var
in a data class
used for state did not trigger recomposition.
The answer: use immutable data class
objects and copy()
.
Stability Now!
Immutability is going to be central to many Compose development patterns. Mutable
data leads to too few or too many recompositions, depending on circumstances.
Using a MutableList
, for example, can lead to too many recompositions, as seen
in this week’s highlighted Slack thread.
Composable Commentary
Posts, videos, and other new information related to Jetpack Compose!
Compose Foundation alpha03
Release Notes
InnerPadding
is now PaddingValues
. “Gravity” is now “Alignment”. And
ComposeTestRule
is now the home of onNode()
and waitForIdle()
, to serve
as the long-term replacement for existing global functions.
Compose Material alpha03
Release Notes
BottomNavigationItem
used to have onSelect
as a parameter; that is now
onClick
. BottomNavigationItem
also gets a new InteractionState
parameter
(as does Tab
). Buttons no longer have disabled colors, and TextField
no
longer applies an alpha to the supplied background color.
Leland Richardson… Live!
If you are into live-streamed coding sessions, Google’s Leland Richardson has started offering those on Twitch, with an eye towards Compose and Compose UI development.
How to Write Memorable Functions
State management in Compose is a popular topic of discussion. Here, Denis
Crăciunescu reviews the various options for state management in Compose, including
remember()
and mutableStateOf()
.
Exploring Jetpack Compose: Column
Joe Birch offers a peek at Column
, with a deep dive into the various modifiers,
arrangement options, and alignment choices. As with Row
, Column
is a fairly
powerful composable; many UIs can be assembled with Row
or Column
without having
to break out a ConstraintLayout
or do your own custom layout.
Video: Firebase with Jetpack Compose
All Techies returns a short screencast of blending Firestore for data storage with Compose UI for the user interface. All Techies also released a similar short screencast on using Firebase Remote Config with Compose.
Resource Roundup
100% pure code!
GitHub: pocmo / recompose
Sebastian Kaspari is working on tools (CLI and a Studio plugin) to convert classic View
-based layouts
into equivalent composables.
GitHub: badoualy / animatedsvg-composable
Yann Badoual gives us a library for animating the rendering of SVG, as a Compose
port of a previous View
-based library.
GitHub: skydoves / DisneyCompose
Jaewoong Eum has published a Compose sample app demonstrating the combination of Compose UI and Hilt, in the context of a Disney movie catalog app.
Gist: cbeyls / FlowLayout.kt
A “flow layout” has long been a popular request in Android app development: show as
many children as possible on the current row, then start a new row and continue.
Here, Christophe Beyls demonstrates a take on that structure in Compose UI, using
a custom set of Layout()
rules.
Gist: antonshilov / TreeRenderer.kt
Anton Shilov posted a demonstration of a composable for rendering a tree structure of semi-arbitrary breadth and depth.
…And One More Thing
We have many techniques for dealing with state in Compose. Most of the simple
examples that you see use remember { mutableStateOf() }
, because it makes for
a nice self-contained Compose UI example. At the same time, we also have state
adapters for lots of streams: LiveData
, StateFlow
, RxJava Observable
, etc.
Over the next year, we will be experimenting with various patterns for employing these techniques, and hopefully we will have a well-documented core set of patterns to recommend to newcomers to Compose, once Compose ships a stable version.
If I had to guess, we will wind up drawing a distinction between “data being created”
and “data ready for use”. Once data is deemed ready for use, we hand it over to a
viewmodel and have it do its work, no different than we would in a classic View
-based
Android UI. However, many user interfaces will involve a lot of user input to
get to the “ready for use” state — many times we will not want to update
the viewmodel on every keypress in a text-entry field, for example. We will use
remember()
and things like that for “local” state to a composable, handing that
state off to the viewmodel when all the input from the user is ready. Yet, in
other cases, such as real-time filtering, we might actually want to update the viewmodel
on each keypress.
Compose is trying to not lock us into one particular approach, so we can have a palette
of approaches to choose from to apply to a particular UI situation. We just need to have
that palette be documented well enough that newcomers do not feel that they have to
“reinvent the wheel” or try using one specific technique (e.g., remember()
)
for everything.
Or, you can subscribe to the Atom feed or follow Mark Murphy in the Fediverse.
Recent Issues:
- 2024-12-17: Compose and Wear Compose alphas! Tom Colvin on camera apps! Kevin Schildhorn on multiplatform adaptive layouts! And... do we really want to know what the "X" is in "Android XR"?!?
- 2024-12-10: A Compose Multiplatform alpha! Hot reload! Presentation! Sprites! Calendars!
- 2024-12-03: Rebecca Franks on clipping and masking! Stefano Natali on graphicsLayer()! FunkyMuse on type-safe nav results! And... if we have enough maps, do we need to store our maps in a Map?!?