jetc.dev Newsletter Issue #70

Published: 2021-06-22

This week, we look briefly at beta09, as the countdown to a stable release continues ticking!

We also look at string resources, derivedStateOf(), and Text(). We peek at some dialogs and “swipe to expose” composables. And we try to have a bit of “focus time”.

Beta Breakdown

Reviewing the release notes for the latest Jetpack Compose update!

beta09 was not huge, but does contain more changes than I would expect for a nearly-final release.

The Compose artfacts now contain “profile rules”. As is explained in the Compose runtime beta09 release notes, these rules teach ART what functions should be compiled ahead of time, rather than just in time, to improve first-run app performance.

Also, the Compose team is improving support for running Compose-based tests as unit tests using Robolectric. The Compose UI beta09 release notes list some known limitations.

Also:

• Compose UI converted another bunch of enums to inline classes, including Role, TextAlign, TextDirection, FontStyle, and several more.

• Compose Foundation removed ManualFrameClock

• Compose Material added a shape parameter to let you control the border of the OutlinedTextField() composable

One Off the Stack, One Off the Slack

You’ve got questions. That’s understandable!

Changing the OutlinedTextField() Border

OutlinedTextField() is outlined. However, historically, that outline was purely managed by the composable, following Material Design aesthetics. However, beta09 gave us a new shape parameter to control this, as we see in this week’s highlighted Stack Overflow question.

Where Do the Strings Go?

String resource files have been the backbone of internationalization and localization in classic Android development. In the short term, that is not going to change, as we see in this week’s highlighted Kotlinlang #compose Slack thread.

Composable Commentary

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

Podcast: AD/BC on Jetpack Compose Layout

This episode of the Android Developers Backstage podcast series on Compose (“AD/BC”) looks at the process of laying out composables, including comparing and constrasting it with the equivalent operations in the classic View system.

Plumbing Data with Derived State in Compose

Zach Klippenstein continues a deep dive into the snapshot state system. In particular, in this post, Zach mostly skips composables and focuses purely on MutableState, derivedStateOf(), and how the snapshot engine can let you create reactive systems that have nothing much to do with UI.

Video: Exploring Jetpack Compose Canvas

Julien Salvi delivered a presentation to GDG Montreal on the Canvas() composable, including the drawing API and how to drop down to the native Android Canvas in the cases where you need it.

Compose: List/Detail - Testing Part 2

Mark Allison returns to Compose UI testing, looking at how decomposing a UI into discrete stateless composables improves testability.

Focus in Jetpack Compose

With classic views, we had methods to call to get the focus to move from widget to widget, for cases where automatic focus management did not work as desired. In this post, Jamie Sanson looks at the equivalent operations in Compose UI, using FocusManager, FocusRequester, the onFocusChanged() modifier, and more!

Implementing a Stopwatch with Coroutines and Flow Part 1

Over a pair of posts, Aleksander Jaworski implements a stopwatch in Compose UI. In the first post, Aleksander sets up the state representation, the elapsed time counter, and how to toggle between running and paused states. In the follow-up post, Aleksander extends the system to support an arbitrary number of stopwatches, all running in parallel.

Carthographing Jetpack Compose: Text

Thomas Künneth continues poking at Compose UI, this time examining the Text() composable, including how to make portions of it clickable and how to get control on those click events.

Video: Text Customization

Stevdza-San also looks at the Text() composable, AnnotatedString objects, and other aspects of rendering text on your screen, as part of a series of Compose UI screencasts.

Other Interesting Links

• Jetpack Compose: Custom View
• Video: How to Make a Draggable Music Knob in Jetpack Compose
• Video: Migrating to Compose: ComposeView
• A Better Way of Creating Android Views with JetPackCompose
• Avoid Pain in Jetpack Compose

Resource Roundup

100% pure code!

GitHub: alorma / ComposeDialogs

Bernat Borrás Paronella returns, with a DialogScaffold() composable, which uses coroutines to give us an imperative-style API for displaying a dialog and consuming an action from it.

GitHub: Tgo1014 / DraggableScaffold

Tiago Aruajo brings us a library that provides a Compose UI implementation of the “swipe to expose actions” pattern, in the form of a DraggableScaffold() composable.

GitHub: ch8n / Compose-boids-flocking

Chetan Gupta is back, this time with a flocking/swarming simulation, written using Compose for Desktop.

Other Interesting Links:

• Gist: maurobanze / stepper.kt
• GitHub: Spikeysanju / JetQuotes-Desktop
• GitHub: theapache64 / compose-bird

…And One More Thing

It is easy to ignore focus. Focus is a concept tied to keyboard navigation of a UI. Few developers (or designers) use a phone with a keyboard. “Out of sight, out of mind” means that forgetting about keyboards is very common.

Yet, while phones with keyboards are uncommon, there may be more than you might think of:

• Most Chrome OS devices come with keyboards

• Bluetooth keyboards are a popular accessory for tablets

• Users needing assistive technology will often wind up with a peripheral that either is a keyboard or presents itself to Android as a keyboard

• You may be required by regulation to support keyboard navigation

• Televisions are not touchscreens; navigation through a TV app is via a remote that emits key events

• Game controllers emit key events

• Your future Compose for Desktop app will be tied tightly to keyboards

• And, believe it or not, there are modern phones with keyboards

Jamie Sanson’s post on focus demonstrates that Compose has an in-depth API for focus management. It is our job to test our app’s focus management and make fixes in places where the “out of the box” implementation is shaky. Plus, Compose UI is new, and focus management may not have gotten enough community attention, so there may be bugs, or gaps in functionality where Google postponed some things to address after 1.0.

As you develop your battle plan for migrating to Compose UI in the coming years, try to find time to work on focus management… even if it is not your primary focus.