jetc.dev Newsletter Issue #224

Published: 2024-07-23

This week, we go edge-to-edge and look at performance. We explore derivedStateOf() and better swipe to dismiss options. And we peek at some “pick a value in a range using a horizontal slider” implementations.

One Off the Stack, One Off the Slack

You’ve got questions. That’s understandable!

Why Is My pointerInput() Lambda Confused?

Lambdas “capture” values at the point the function containing the lambda is executed. This sometimes causes confusion, especially when using delegates (by keyword) and MutableState holders. Learn more in this week’s highlighted Stack Overflow question.

How Do I Only Use Unit Tests for CMP?

It would be nice to test Compose Multiplatform using purely the JVM. Roborazzi supports this, but you have to take additional steps to avoid running instrumented tests that you might not want. Learn more in this week’s highlighted Kotlinlang #compose Slack thread.

Composable Commentary

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

Video: Edge-to-edge and insets

Google is starting a series of short videos on specific Compose UI topics. In this installment, Simona Milanovic looks at enableEdgeToEdge(), the safe* properties on WindowInsets, and more!

Compose Performance

Jaewoong Eum (@skydoves@androiddev.social) is maintaining a roster of articles on improving the performance of your composables, plus links to official documentation on the subject.

How derivedStateOf works: a deep d(er)ive

Zach Klippenstein (@zachklipp@androiddev.social) continues an exploration of the Compose snapshot system, this time focusing on derivedStateOf(): what it is for, when to use it, and how it actually works. This follow-on post contains a droidcon SF 2024 presentation that Zach delivered on this subject.

Medium: Reordering List via drag n’ drop in Jetpack Compose

Emmanouil Artemakis wanted a single list with two sections, one of which should support drag-and-drop and one of which should not. That broke official drag-and-drop support and most libraries, so Emmanouil built a custom implementation, complete with overscroll support.

Medium: Compose Multiplatform: Localization

Dženan Bećirović examines Compose Multiplatform’s support for string resources, including how to change locales on the fly for both iOS and Android.

Swipe to dismiss compose fun

Lyubomir Ganev (@luboganev@androiddev.social) reviews how to use the new anchoredDraggable() API to implement the classic swipe-to-dismiss UI pattern, complete with fade-out effects.

Medium: A Simple Way To Handle UI Actions In Jetpack Compose

Ali Mohseni Rad worries about composables having too many callback parameters for UI actions, especially composables representing screens. Ali’s solution is to aggregate those function type parameters into actions classes, so we get the same functionality with fewer discrete parameters in the composable.

Don’t Lock the Screen Orientation! Handling Orientation in Compose

Eevis Panula (@eevis@mas.to) looks at supporting orientation changes: detecting the orientation of the device, retaining state across orientation changes, etc.

Resource Roundup

100% pure code!

GitHub: ismai117 / kottie

GitHub user ismai117 created a Compose Multiplatform library for rendering Adobe After Effects animations, akin to Lottie.

Multiplatform Compose Animations

Touchlab has released some animation support libraries for Compose Multiplatform, including one with 30 different easing functions and one with animate*ValuesAsState() functions to let you specify multiple waypoints rather than just beginning and ending values.

GitHub: rajdeepvaghela / ValuePickerSlider

Rajdeep Vaghela implemented a horizontal slider styled to resemble classic old radio frequency selectors.

GitHub: LeeWeeder / number-slider

Lyniel Jhay Maquilan implemented the same sort of “pick a number within a range using a horizontal slider” composable, in this case with somewhat different styling.

Notable Releases

Horologist has a 0.6.16 release, switching to DateTimeFormatter for 12-hour time in TimePicker() and adding better responsive support. 0.5.28 is also available, backporting some 0.6.x changes to be compatible with 0.5.x APIs.

Coil is up to 2.7.0, with some performance improvements, plus updates to the versions of Kotlin, Compose, and Okio that it uses.