jetc.dev Newsletter Issue #212

Published: 2024-04-30

It’s a bit of a short issue this week, in part because I’m on vacation! 🏞️ ⛰️ So, no Stack or Slack this week!

But, we spend a fair bit of time on shared element transitions and container transforms. We get buzzed by haptics and see an intriguing approach to tooltips. And, we get our hands dirty with Soil.

Ooooo… What Did We Get?

Reviewing the release notes for the latest Jetpack Compose update!

Compose Multiplatform now has a 1.6.10-beta02 release, with bug fixes plus improved lifecycle support for more targets.

Composable Commentary

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

Write contents of a composable to a bitmap

Google’s Rebecca Franks pointed out further updates to Compose UI’s built-in support for capturing composables to bitmaps. A new rememberGraphicsLayer() function is in the current 1.7.0 alpha, and it plus a toImageBitmap() extension function on GraphicsLayer simplify this process even further.

5 Haptic Feedback Implementations To Enhance Your App

Haptics provide an important form of feedback to users, especially for cases where they might not be looking at the screen. Compose developer sinsamaki outlines a few implementations of haptics for Compose UI, powered by the LocalHapticFeedback and LocalView implementations of performHapticFeedback().

Medium: Shared Element Transition In Jetpack Compose: Provide Enriched User Experiences

Shared element transitions and container transforms are two related techniques that cause one screen to morph into another, highlighting a common UI element (or set of elements) in that transition. Jaewoong Eum explores Compose UI’s built-in support for these in the latest 1.7.0 alpha, including SharedTransitionLayout and the sharedElement() modifier. The post also looks at the connections between these transitions and Navigation for Compose.

Medium: Shared Element Transitions in Jetpack Compose

Francesc Vilarino Guell gives us another view of shared element transitions and how they tie into Navigation for Compose. The SharedTransitionLayout wraps the NavHost to have the entire screen (or whatever the NavHost is handling) be the “stage” for the transitions. NavHost then supplies the SharedTransitionScope and AnimatedVisibilityScope necessary for using the sharedElement() modifier.

Declarative APIs for Declarative UIs: Pagination as state

TJ Dahunsi wrote the Tiler library as an alternative to Paging for Compose. TJ wanted a paging API that was a better match for how Compose works, and Tiler is the result. In this post, TJ explains more about the rationale behind Tiler’s design and API.

Jetpack Compose for iOS: Interoping with native Components

With Compose for Android, we can have composables use views (via AndroidView()) and have views use composables (via ComposeView). Gustavo Fão Valvassori explores the equivalent UI toolkit interoperability on the iOS side: having composables inside UIKit or SwiftUI user interfaces, and having UIKit or SwiftUI elements be used inside of composables.

Toggle Labels With Icons - Personalizing Accessibility

Eevis Panula likes icons that have associated text labels. Not everybody likes that, though. Eevis explores having that accessibility option be controlled by the user via a settings screen, backed by Preferences DataStore.

Medium: Designing Intuitive Interfaces: A Take on Modifier-based Tooltips in Jetpack Compose

Michell Bak’s team uses tooltips. Lots of tooltips. Enough tooltips that having to use a custom wrapper container was going to be a problem. Michell explains how the team created a tooltip() modifier for any composable, backed by a Popup() that floats over the current activity.

Resource Roundup

100% pure code!

Soil

The Soil team has relased their eponymous set of Compose Multiplatform libraries, supporting Android, iOS, desktop, and Web/Wasm. This includes a scoped state management library, a validating form framework, and a querying/caching module.