jetc.dev Newsletter Issue #66
Published: 2021-05-25
Google I|O was a thing! We look at what came out of that related to Compose!
And, we also look at beta07
and what impacts it has on our existing code.
Plus, we put composables inline with text, build a staggered grid, and see how Bazel can build a Compose UI project. Plus, I point out how “stable” does not mean “done” with respect to Compose releases.
I|O Insights
Compose on stage! And, um, in Google Meet sessions!
Perhaps the biggest thing from a Compose standpoint was the announcement at I|O that they expect a stable 1.0.0 version of Compose to ship in July. There were also hints at Compose for Wear and Compose for app widgets… though I will write more about that latter one in a future issue.
In terms of Compose-specific sessions, there were two Compose workshops (a third apparently was scrubbed due to technical issues). A recording of one of them, led by Florina Muntenescu, is available on YouTube.
The other live session was the Compose Q&A. Some of the more concrete quasi-announcements from that session are:
-
They are continuing to work on performance improvements through the beta period
-
Support for Material You — the announced next generation of Material Design — should come “later in the year”
-
There are no current plans for a drag-and-drop editor, due to the complexity of trying to update arbitrary Kotlin code based upon editor actions
-
They are looking into allowing composables to be unit tested, in addition to the current instrumented test support
-
The current limitations on Kotlin compiler version should start to ease, as both Compose and Kotlin’s new IR backend stabilize
-
The current limitations on needing pre-release Android Studio versions to work with Compose should start to ease, though cutting-edge Compose changes may still require pre-release Studio versions as both advance from pre-release to release status
In addition to the live content, there were three pre-recorded sessions related to Compose:
-
What’s new in Jetpack Compose is a nice introduction to Compose. However, it does not really cover anything new about Compose, probably since Compose has been in beta for a few months.
-
Using Jetpack Libraries in Compose is a good look at architecture considerations with Compose and Google’s suggestions in that space. Half of the presentation was on Navigation for Compose, and the other half lightly discussed other Jetpack libraries, such as Hilt. So, the presentation was useful, but it was not focused on the subject the way that you might expect.
-
Build Beautiful Material Design Apps with Jetpack Compose was a walkthrough of Google’s Owl sample Compose UI app. Part of the focus was on themes (colors, typography, shapes, dark mode, etc.). Much of the rest was on composables that support Material Design, particularly looking at
Scaffold()
and the things that tie into it (app bars, FABs, etc.).
Beta Breakdown
Reviewing the release notes for the latest Jetpack Compose update!
The big thing about beta07
is that some key functions shifted a bit, enough
that libraries need to recompile against beta07
. If you see NoSuchMethodError
messages at runtime, make sure that your third-party libraries are up to date
and support beta07
.
compose-runtime
had a few changes of note:
-
There are new
ReusableContent
andReusableComposeNode
concepts, probably added with an eye towards performance; and -
There were changes to improve source minification
Similarly, a few interesting things cropped up in compose-ui
:
-
As with
RecyclerView
,LazyColumn()
andLazyRow()
will now cache some elements that are not visible, to help with scrolling performance -
KeyEventType
andFocusDirection
changed fromenum class
tosealed class
-
Some improvements were made with text selection handles and subcompositions
One Off the Stack, One Off the Slack
You’ve got questions. That’s understandable!
Blending Icons with Text
With a TextView
widget, our SpannedString
could contain ImageSpan
widgets that
let you put images right into the text. Compose UI’s AnnotatedString
uses inlineContent
to allow you to embed arbitrary composables into your Text()
, as we see in this
week’s highlighted Stack Overflow question.
Using State Holders
In the Using Jetpack Libraries in Compose
Google I|O presentation mentioned above, there was a discussion of “state holders”
and their relationship to ViewModel
. That raised its own set of concerns, which we
examine in his week’s highlighted Kotlinlang #compose
Slack thread.
Composable Commentary
Posts, videos, and other new information related to Jetpack Compose!
Video: Creating a Staggered Grid with Jetpack Compose
Adam McNeilly returns, this time with a recorded screencast looking at using Layout()
to create an implementation of a staggered grid, one where the columns have uniform
widths but each column has items of varying heights.
Video: States - Jetpack Compose
YouTube user Stevdza-San continues examining Compose constructs, in this case exploring
state management. This includes covering what sorts of state a composable should manage
(versus should be supplied from outside via state hoisting) and the relationship
between ViewModel
and lower-level state holders.
Making RecyclerViews with Jetpack Compose
The AppLit team wrote a post about LazyColumn()
, LazyRow()
, and how to combine them
into a scrolling list of carousels.
Other Links of Interest
- “Composing” the Flutter Counter App with Jetpack Compose: Part 2
- Jetpack Compose Row & Column Cheat Sheet
- Android, Meet Jetpack Compose
- Declarative UI in Android
- Jetpack Compose and Why It Will Revolutionize Android Development
- Video: Jetpack Compose Modifiers & Reusable Toolbar, Loading Screen
Resource Roundup
100% pure code!
GitHub: rock3r / bundel
Seb Poggi and Ivan Morgillo are building a “digital wellbeing” app with Compose UI. However, beyond just offering the GitHub repo, they are regularly livestreaming their development work on Twitch, to help explain the decisions they make along the way.
GitHub: patxibocos / matriz
Patxi Bocos brings us a library with a composable that sub-divides a Canvas
into a grid. You supply a lambda expression to build each cell of that grid, and
that lambda expression basically gets its own sub-canvas in which to draw.
GitHub: fabirt / podcast-app
GitHub user fabirt has created a podcast player using Compose UI and a long list of other popular libraries, including ExoPlayer, Hilt, and DataStore.
GitHub: Bencodes / bazel_jetpack_compose_example
As the name suggests, this repository, from Ben Lee, demonstrates how to build a Compose project using Bazel instead of Gradle.
Other Links of Interest
…And One More Thing
We now know the intended timeframe for a 1.0.0 stable release: July 2021. Having a stable release is wonderful, and it should result in an increase in adoption and the creation of third-party composables.
However, Compose is far from done.
That may sound obvious. It is uncommon that a Jetpack library reaches 1.0.0 status and never moves from there, and most of those are for relatively obscure items.
Plus, Google has hinted at lots of future directions, such as Compose for Wear, Compose for app widgets, and Material You. There are many more components from the Material Design catalog that need composable implementations, so additional work in Compose Material for breadth seems likely.
However, Compose UI also needs more depth. Simply put, things that you expect to work might not, because they just have not been done yet.
For example, keyboard focus control is lacking. Zach Klippenstein, as recounted in
a Kotlinlang Slack thread,
tried using a Bluetooth keyboard, and Compose was oblivious to it. Arrow keys and
tab clicks that normally adjust the focus with the classic View
system have no
effect in Compose UI. Google engineers admitted that this is not yet implemented.
For many developers, keyboard support is not really a consideration, but it is
important both for accessibility and for users of certain Android environments
(e.g., Chrome OS).
So, there should be a steady stream of updates. What remains to be seen is how frequently we get new stable minor releases, which determines how quickly we will get solutions to problems like keyboard focus control support.
Or, you can subscribe to the Atom feed or follow Mark Murphy in the Fediverse.
Recent Issues:
- 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?!?
- 2024-11-26: Math! Shared element transitions! Custom modifiers! Macrobenchmark! Adapting to platform-specific design systems! And... why does wrapContentSize() not wrap my content size?!?
- 2024-11-19: Compose alphas! Compose Multiplatform patch! PaddingValues! Graphics layers! Swiping! Heatmaps! Navigation! And... why did we get a new production Compose BOM?!?