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 and ReusableComposeNode 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() and LazyRow() will now cache some elements that are not visible, to help with scrolling performance

• KeyEventType and FocusDirection changed from enum class to sealed 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

• GitHub: chaithanyagollapalli / vyapar
• Gist: denis-ismailaj / LabelledCheckBox.kt

…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.