Newsletter Issue #130

Published: 2022-08-30

This week, we have a new batch of Compose and Wear Compose releases, including some noteworthy changes in a brand-new beta.

Beyond that, we look at Android 13 per-app language support, optimizations, and MVI. And we peek at a zoom implementation and a plugin for viewing Icon implementations in the IDE gutter.

Ooooo… What Did We Get?

Reviewing the release notes for the latest Jetpack Compose update!

Surprisingly, we are up to a beta again for Compose: 1.3.0-beta01. That is a bit less than three months after 1.2.0-beta01, which is a faster release cadence than I would have expected.

The biggest thing is that they overhauled the Modifier implementation. The API surface is stable. However, there is a distinct possibility of there being bugs in the implementation. If you do encounter problems, post a repro case either on the #compose Slack channel at Kotlinlang, or file an issue. See the release notes for more details of what changed.

Another change is if you have attempted to have a dialog or a popup with an elevation over 8dp — your elevation will now be clamped at 8dp. That is due to an accessibility problem on the majority of current Android devices.

In other changes, they:

  • Added DialogProperties.decorFitsSystemWindows to allow dialogs to deal with window insets

  • Modified the API of rememberTextMeasurer(), so you may need to switch to remember { TextMeasurer() } syntax for options no longer supported by rememberTextMeasurer()

  • Added more support for lazy list snapping via SnapFlingBehavior and SnapLayoutInfoProvider

Wear Compose got a 1.0.1 patch release. There was a bug with ScalingLazyColumn() and very short lists (e.g., two items). That fix is also in 1.1.0-alpha04, which also changes some of the default MaterialTheme colors for better contrast.

One Off the Stack, One Off the Slack

You’ve got questions. That’s understandable!

How Do We Get the Width of Row() Elements?

You might need to know the size of the children of a Row(), such as to apply certain effects. See how to address this using onGloballyPositioned() or SubcomposeLayout in this week’s highlighted Stack Overflow question.

How Can We Support Per-App Languages?

Android 13 introduces official support for users specifying a language to use for a particular app, independent of the language used for the device overall. Learn more about how this impacts Compose UI in this week’s highlighted Kotlinlang #compose Slack thread!

Composable Commentary

Posts, videos, and other new information related to Jetpack Compose!

Medium: MAD about Media

Google’s Avish Parmar walks us through using Media3 — effectively the next generation of ExoPlayer — in a Compose UI app. Here, Avish uses Media3 for audio playback, with Compose UI handling things like the now-playing screen.

6 Jetpack Compose Guidelines to Optimize Your App Performance

Marin Tolić and Jaewoong Eum describe the benefits of stable classes and how to write them, how state reads and writes affect performance, why remember() can help with expensive calculations, and more on optimizing Compose UI speed.

Video: Compose in CashApp

The Talking Kotlin crew interviewed Saket Narayan and Jake Wharton, talking about developing CashApp, the role of Molecule, and why it is time for XML to die.

How to make Expandable List with Jetpack Compose

John Codeos is back, this time looking at the expandable list pattern, where a row in a scrollable list can be expanded or collapsed. John sets up one of these using a simple LazyColumn(), one with items that represent the rows and what they can display when “expanded”.

Medium: MVI for Compose (Part 1)

Semyon Zadoroznyi has a five-post series on using the MVI pattern for Compose UI-based apps. Semyon’s series looks at limitations of MVVM and how to roll your own MVI framework as an alternative.

Medium: Nested Navigation Graph in Jetpack Compose with Bottom Navigation

Medium user MathRoda looks at subdividing your Navigation for Compose nav graphs, in this case with one sub-graph per page in a bottom navigation bar.

Medium: Testing Composable in Jetpack Compose Android - Testing Fundamentals

Saurabh Pant explores UI testing of composables, from the initial Gradle setup through creating test classes that employ createComposeRule() and createAndroidComposeRule().

Resource Roundup

100% pure code!

SmartToolFactory / Compose-Zoom

The Smart Tool Factory team published yet another Compose UI library, this one focused on zooming! It includes a zoom() modifier that can be added to any composable and offers zoom/pan/rotate support. It also includes an enhancedZoom() modifier, zoomable images, and more!

GitHub: Xsims / compose-material-stepper

GitHub user Xsims wrote a stepper implmentation: a UI depicting and documenting a series of steps that somebody needs to go through. A Stepper() composable uses Step() composables for each step, where the central UI of each step can be whatever composable you want (e.g., a Box() containing other UI elements).

GitHub: iamageo / MagicTabLayout

Geovani Amaral brings us a top tabs implementation, with a MagicTabLayout() using MagicTabItem objects to populate those tabs.

Compose Icon Viewer

Grégory LORY created an IDEA/Android Studio plugin that renders Compose icons in the gutter, the way drawable resources are.