jetc.dev Newsletter Issue #131

Published: 2022-09-06

This week, we look at bottom sheets and the “first composition” fallacy. We look at Glance support, sneak a peek at snapshots, and explore the measurement and drawing phases of compositions. We examine a pair of “speed dial” FAB implementations, plus we revisit some redwood.

One Off the Stack, One Off the Slack

You’ve got questions. That’s understandable!

How Can I Close a Bottom Sheet?

To close a ModalBottomSheetLayout(), we need to call hide() on its associated state object. That is a suspend fun, so we need to remember a CoroutineScope to pull that off. See how we can apply this to a close button in the sheet itself in this week’s highlighted Stack Overflow question.

How Do We Do Something Only on the First Composition?

The answer is “you’re probably doing it wrong”, as you have no way of knowing when the next recomposition will be. Learn more in this week’s highlighted Kotlinlang #compose Slack thread.

Composable Commentary

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

Medium: Experimenting with Jetpack Glance

Google’s Marcel Pintó takes a look at Google’s new glance-experimental-tools repository, including an AppWidgetHost() composable to render your Glance-based RemoteViews within your app, a GlancePreviewActivity to let you @Preview your Glance-based app widgets, and more!

Slides: Hitchhiking Through Jetpack Compose

Amanda Hinchman-Dominguez and Google’s Jossi Wolf delivered a presentation on low-level Compose concepts, including snapshots, how the Compose Compiler works, what the results of the Compiler’s code-generation looks like, and more!

Slides: Opening the Shutter on Snapshots

Google’s Zach Klippenstein also delivered a presentation about Compose snapshots, designed to follow the preceding talk by Amanda and Jossi. As Zach puts it, “snapshots are Git for your variables”, helping multiple threads work with consistent representations of data without locking read access while writes are ongoing. Zach ties snapshots into our Compose MutableState objects and how they interact, as well as how you can use listeners to find out about State or Snapshot changes.

Measuring and drawing in Jetpack Compose

Jorge Castillo returns, looking into the measuring and drawing phases of Compose UI. Jorge discusses the roles of LayoutNode and LayoutNodeWrapper, what purpose the graphicsLayer() modifier serves, where “draw modifiers” come into play, and more!

Medium: Extending ‘SwipeToDismiss’ in Jetpack Compose

Medium member sinasamaki explores the SwipeToDismiss() composable and how it can be improved for customizability, expressiveness, and user discoverability.

Simple RSS Feed Reader - Jetpack Compose

Vincent Tsen walks us through an RSS feed reader app, with a Compose UI interface, Room for article and bookmark storage, and Ktor for accessing feeds.

Other Interesting Posts

• Dual-screen example adds Jetpack Compose to the experience
• Medium: Compose Pager
• Simple Google Map App - Jetpack Compose
• Custom Progress Bar with Jetpack Compose Canvas API: Tutorial
• Learning Kotlin Multiplatfom Mobile: Entry 3.5
• How to Master In Jetpack Compose? Here Are 10 Ways
• Medium: An iOS Engineer learns about Android’s Jetpack Compose and loves it
• Medium: Modern Android for iOS folks: Swift-Kotlin & SwiftUI-Compose
• Jetpack Compose: Basic components

Resource Roundup

100% pure code!

GitHub: cashapp / redwood

A few months ago, I wrote about a forthcoming library from CashApp called “Redwood”. That library is now publicly available, though it is “not ready for use by anyone”. The gist is that Redwood lets you create UIs through composables, but it is not opinionated as to how those UIs get rendered. That aspect is up to the project and is considered to be part of your overall design system. Redwood simply helps you update your design system UI elements — “composable functions render application state into the design system”.

GitHub: leinardi / FloatingActionButtonSpeedDial

Roberto Leinardi created a version of the “speed dial” style of FAB, both using the classic View system and as a composable. SpeedDial() represents the FAB itself, and FabWithLabel() composables represent the secondary buttons.

GitHub: ch4rl3x / SpeedDialFloatingActionButton

Alexander Karkossa also implemented a Material3 version of the “speed dial” style of FAB, with BottomAppBarSpeedDialFloatinActionButton() for the main FAB and FloatingActionButtonItem() composables for the individual secondary buttons.

GitHub: Mindinventory / AndroidCircularSlider

The Mindinventory team brings us a highly-configurable CircularProgressBar() composable that serves both to show progress and as a SeekBar-style rotary input widget.

Other Interesting Links

• Tweet: grayscale() Modifier
• GitHub: Kyant0 / Monet (create custom Material3 palettes)

…And One More Thing

Five weeks ago, I wrote in this space about how Compose 1.2.0 coming out a year after 1.0.0 was a nice update pace.

Last week, Google released the first beta for Compose 1.3.0, less than three months after the corresponding beta release for Compose 1.2.0.

🙃

The closer you are to being a platform, the more important predictability becomes in release cycles. Updating to a new version of a platform tends to be more involved and take more effort than is updating to a new version of other libraries. Third parties that depend on the platform also need to update, adding to the overall complexity.

That’s why nobody bats an eye about release cycles for OkHttp, despite that library being all but essential to modern Android app development. Yet, Google’s release of Android 12L broke established release cycle patterns and caused a lot more concern. Android is a platform, OkHttp is not. Compose, especially Compose UI, is far closer to being a platform than is OkHttp.

I am not saying that the 1.0.0 -> 1.2.0 timeframe was right, or that the 1.2.0 -> 1.3.0 timeframe is wrong. I am saying that the apparent lack of release cycle predictability may add friction to Compose UI usage.