jetc.dev Newsletter Issue #191

Published: 2023-11-21

Compose, Compose Material3, and Wear Compose all received updates, so we see what’s in store!

In addition, we learn what “Material3 Adaptive” is, where Compose Multiplatform will go in 2024, and more on why BasicTextField2() is awesome. Plus, we explore some new non-Android Compose options, such as improved previews for Compose for Desktop and a new charting library.

Ooooo… What Did We Get?

Reviewing the release notes for the latest Jetpack Compose update!

Compose got a bump to 1.6.0-beta01, suggesting that 1.6.0 will become stable by late this year or early next. If you are implementing drag-and-drop, there were a bunch of API changes to be aware of. There were also changes to text input APIs, the magnifier() parameters, and SwipeToReveal(). Plus, assertIsDeactivated() now lets you test for nodes that are cached for later reuse but are not actively in the composition.

Compose Material3 is up to 1.2.0-alpha11. This adds PullToRefreshContainer(), un-deprecates TabRow() and ScrollableTabRow(), and renamed a bunch of other APIs.

There are also new androidx.compose.material3:material3-adaptive and androidx.compose.material3:material3-adaptive-navigation-suite artifacts for implementing common UI patterns across a variety of screen sizes. Below, we have a Googly Medium post explaining what this is about!

Wear Compose is up to 1.3.0-beta01 with a bunch of changes to SwipeToDismiss() and SwipeToReveal(), among other changes.

In Compose-adjacent libraries, we also got:

  • androidx.activity:activity-compose:1.8.1
  • androidx.lifecycle:lifecycle-runtime-compose:2.7.0-rc01
  • androidx.lifecycle:lifecycle-viewmodel-compose:2.7.0-rc01

One Off the Stack, One Off the Slack

You’ve got questions. That’s understandable!

Do We Always Need to remember()?

It is all too easy to forget to remember(). But, that can lead to overuse of remember(), for cases where it is not needed, such as constants. Learn more in this week’s highlighted Stack Overflow question.

How Can We Find Our Position Cheaply?

Sometimes, we need to know a composable’s position on the screen. onGloballyPositioned() seems like the right modifier to use for this, given its name. However, if the composable does not change position relative to its parent, onPlaced() is more efficient, as we see in this week’s highlighted Kotlinlang #compose Slack thread.

Composable Commentary

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

Medium: New APIs for adaptive layouts in Jetpack Compose

Google’s Ian Clifton discusses the new androidx.compose.material3:material3-adaptive and androidx.compose.material3:material3-adaptive-navigation-suite libraries, which offer out-of-the-box layouts that handle varying screen sizes. In particular, Ian covers ListDetailPaneScaffold() for the list/detail UI pattern and NavigationSuiteScaffold() for switching between a bottom navigation bar and a side navigation rail.

Kotlin Multiplatform Development Roadmap for 2024

JetBrains’ Egor Tolstoy outlines the plans for Kotlin Multiplatform and Compose Multiplatform for 2024. Of note, they aim to get Compose for iOS to a beta state and getting the core Compose APIs and components available to multiplatform projects. They also plan to have Fleet support live preview for common code in Compose Multiplatform projects.

Medium: BasicTextField2: A TextField of Dreams [2/2]

Alejandra Stamato continues her tour of BasicTextField2(), including using InputTransformation for filtering, OutputTransformation for formatting, scroll state access, and more.

How to Add Content Descriptions in Compose - A Guide for Android Devs

Eeva-Jonna Panula is back with more material on accessibility, this time focusing on content descriptions (contentDescription for Image() and Icon(), or via modifiers like semantics()). Eeva-Jonna explores who experiences those descriptions and how to write good descriptions.

Medium: Building an Efficient UI Design System with Jetpack Compose and Compose Multiplatform

Ahmed Nasser examines what it takes to build a cross-application design system in Compose Multiplatform, via a dedicated module.

All You Need To Know About Modal Navigation Drawers In Jetpack Compose

Joel Dias examines the navigation drawer UI pattern and how to implement one powered by Navigation for Compose, by way of the ModalNavigationDrawer() composable.

Medium: Managing UI States in Jetpack Compose

Michihiro Iwasaki explains why a plain var does not work for composable state, then dives into mutableStateOf() and remember() as an alternative, before turning to viemmodels as another alternative.

Jetpack Compose + Material Components for Android TV: Cards

Joe Birch continues his tour of TV Compose with a look at cards, such as StandardCardLayout() for an image-and-caption card, WideCardLayout() for a more immersive card UI, ClassicCard() for image/title/subtitle/description structures, and more.

Resource Roundup

100% pure code!

GitHub: alexfacciorusso / compose-previewer

Alex Facciorusso offers improved preview annotation support for Compose for Desktop.

GitHub: mori-atsushi / compose-stylesheet

Mori Atsushi is building a stylesheet engine for Compose UI, with a DSL for defining colors, fonts, sizes, etc.

Gist: Wear Compose HierarchicalFocusCoordinator Sample

Yuri Schimke demonstrates how to have a dialog composable in Wear OS handle rotary events correctly using HierarchicalFocusCoordinator. See this Kotlinlang thread for more context.

GitHub: maximilianproell / compose-multiplatform-chart

Maximilian Pröll is building a charting library for Compose Multiplatform, starting with line charts.

Notable Releases

Maps for Compose released 4.2.0 and 4.3.0 in rapid succession, addressing accessibility concerns and making ClusterManager be part of the API.

…And One More Thing

Over in the CommonsBlog, I wonder how we might move forward, now that the primary Android-based TV platform may be moving on to something else. Is TV Compose too late?