jetc.dev Newsletter Issue #205

Published: 2024-03-05

JetBrains released Compose Multiplatform 1.6.0, so we celebrate! 🎉

We also hear from Googlers regarding shape morphing and strong skipping. We implement sticky headers in lazy grids for a calendar, and we accept GIFs in our text fields. Plus we look at a Compose Multiplatform table implementation and a player composable for YouTube videos.

NOTE: I am taking a one-week break from the newsletter. The next issue will be out in two weeks, on March 19th.

Ooooo… What Did We Get?

Reviewing the release notes for the latest Jetpack Compose update!

Compose Multiplatform 1.6.0 is final!

We now have a stable release with the resources API, UI testing, @Preview support in the Fleet IDE, and more.

One Off the Stack, One Off the Slack

You’ve got questions. That’s understandable!

How Do We Detect If the User Is Scrolling?

Sometimes, we want our UI to be subtly different while the user is scrolling (e.g., a lazy list) and when the user has stopped scrolling. We can explicitly declare a LazyListState for the list to use and observe changes in isScrollInProgress for this, as we see in this week’s highlighted Stack Overflow question.

How Can We Expire State?

Sometimes, we have state that gets stale, simply due to the passage of time. We explore options for implementing this efficiently, without busy loops or the like, in this week’s highlighted Kotlinlang #compose Slack thread.

Composable Commentary

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

Medium: Fun with shapes in Compose

Google’s Rebecca Franks not only points us to new documentation on the Compose UI graphics-shapes library but explores how to use it. Rebecca demonstrates RoundedPolygon for polygonal shapes, Morph to represent a transition between two shapes, and a variety of fancy Path tricks!

Medium: Jetpack Compose: Strong Skipping Mode Explained

Google’s Ben Trengrove dives into “strong skipping” mode, an experimental feature in Compose 1.5.x and 1.6.x and the default behavior in 1.7.0 alphas. Strong skipping mode allows many more recompositions to be skipped than does the default behavior. This greatly increases performance, but it comes at the cost of potentially introducing some bugs in your code.

Medium: Creating a Sticky Months Calendar UI with Jetpack Compose

Sibel Nalop wanted a vertically-scrolling montly calendar where not only were the days of the week pinned at the top, but the name of the top-most month would be sticky as the user scrolls up and down. This is rather complex, as “sticky” behavior is not included in the lazy containers, so Sibel supplies an implementation.

Rich media input from the keyboard in Compose

Soft keyboards that support GIFs, animated emojis, stickers, and the like require app support to consume that rich content. Historically, that was limited to the View system, but the 1.7.0 alphas have added a receiveContent() modifier that we can apply to BasicTextField2(). Shreyas Patil explores how this works, including how you get a Uri to the rich content media.

Medium: Firing Side Effects from Compose using SnapshotFlow

Efe Ejemudaro describes a situation where state changes do not drive UI changes, but rather trigger side effects such as logging or analytics. Efe compares and contrasts derivedStateOf() and snapshotFlow() as ways of observing the state changes, with snapshotFlow() causing fewer pointless recompositions.

Yahor Urbanovich describes Tiamat, his team’s implementation of a navigation system for Compose Multiplatform. Tiamat supports object-based navigation (vs. strings), has its own multiplatform viewmodel, supports nested navigation, and more.

Medium: State Management in Jetpack Compose: ViewModel vs. Remember Function

Kerry Bisset uses the case of tracking a list’s scroll position, comparing and contrasting holding that in a composable via remember() or holding it in a ViewModel. Both have their places, and Kerry examines what a hybrid approach might look like.

Medium: Overcoming Common Performance Pitfalls in Jetpack Compose

Pushpal Roy explores performance issues in Compose and how to address them. While strong skipping may alleviate some of the concerns over unstable parameters and needing to remember() lambdas, it is useful to understand why these concerns exist in the first place.

Jetpack Compose Tips and Conventions for the @Composables to Make Them Better

Tomáš Repčík outlines a series of general recommendations for composables, based on the official recommendations.

Resource Roundup

100% pure code!

GitHub: windedge / compose-table

GitHub user windedge brings us DataTable() and PaginatedDataTable() composables for Compose Multiplatform, supporting Material and Material3. It covers many of the CMP platforms: Android, desktop, iOS, and Web/WASM.

GitHub: dautovicharis / Charts

Haris Dautović released a library of charting Material3 composables. The library includes pie charts, bar/stacked-bar charts, and line/multiline charts.

GitHub: IlyaPavlovskii / YouTubePlayer

Ilia Pavlovskii gives us a YouTubePlayer() composable that embeds a YouTube video player in your app, with a variety of configuration options and commands to control video playback.

Notable Releases

MaterialKolor, a library for generating Material3 color palettes, is up to 1.4.2, supporting Compose Multiplatform 1.6.0, including Compose for Web/WASM.

Featured here? Please add this badge to your article or repo!

Or, you can subscribe to the Atom feed or follow Mark Murphy in the Fediverse.

Recent Issues:

All Issues

Spread the Word!

Suggestions?

If you have ideas for items for future newsletter editions, reach out via email or contact Mark Murphy on kotlinlang Slack!