jetc.dev Newsletter Issue #178

Published: 2023-08-22

This week, we look at sending results back to previous composables via Navigation for Compose, both from the navigated-to composable and from a viewmodel.

We also explore conditional modifiers, accessible graphs, and how the K2 compiler helps with Compose Multiplatform build times. And, we examine both a drag-and-drop framework and a Material-free pull-to-refresh implementation.

One Off the Stack, One Off the Slack

You’ve got questions. That’s understandable!

Can We Send Back Results from a ViewModel?

Sending results back from one composable to a previous one (using Navigation for Compose) works, but doing that from a viewmodel gets a bit tricky. Google’s Ian Lake walks us through the approach in this week’s highlighted Stack Overflow question.

Do We Need The Latest Compiler?

Suppose we have newer Compose libraries but an older compiler. Will that cause a rupture in the space-time continuum? Or will it work fine? Explore more with Google’s Ben Trengrove in this week’s highlighted Kotlinlang #compose Slack thread.

Composable Commentary

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

Medium: Jetpack Compose Tricks: Conditionally Applying Modifiers for Dynamic UIs

Katie Barnett demonstrates a conditional() custom modifier, one that applies other modifiers based on the result of a Boolean condition. This can improve readability compared to trying to have the conditional logic lie outside the modifier chain.

Zsolt Kocsi walks us through the changes in Appyx 2.0. Appyx now has a layered set of artifacts, along with Compose Multiplatform support and gesture-based navigation options (e.g., Tinder-style card swipes).

K2 Compiler Chronicles: Jetpack Compose

Ian Okumu looks at using the new pre-release K2 compiler for Kotlin on Compose UI modules. In particular, Ian explores the performance gains of K2 when building Compose Multiplatform code, finding that it is an improvement if not quite to the level that JetBrains touts.

More Accessible Graphs with Jetpack Compose Part 3: Differentiating without Color

Eeva-Jonna Panula continues her series of posts examining the intersection of accessibility and graphs in Compose UI. This time, Eeva-Jonna looks at the impact of color blindness on typical graphs and how to use shapes and patterns to differentiate graph lines, in addition to using color.

Passing Arguments While Navigating Back in Jetpack Compose

Joel Kanyi examines what it takes to send a result along the back stack with Navigation for Compose, to deliver information to some prior screen or navigation point. This leverages the SavedStateHandle that is part of each Navigation for Compose back stack entry, providing a communications bridge between the navigated-to composable and the composable that initiated that navigation.

Medium: Animated Circular Progress Indicator using Jetpack Compose

Shoaib Mushtaq walks us through the implementation of an AnimatedCircularProgressIndicator() composable, which uses a Canvas() to draw the overall circle and the completion arc, while animating the changes as you increase or decrease how much has been completed.

Alexandre Bruneau wanted a HorizontalPager() with lots of pages: 100 or more. The ordinary “pager dots” approach does not scale well to this many pages. Alexandre explores making the pager indicator itself be paged, so users get a sense that there are more pages without flooding them with dots.

Medium: Mastering Jetpack Compose State Management: A Deep Dive into Modern UI Data Flow

Joseph James takes a tour of State and related items, such as rememberSaveable() and derivedStateOf(). Joseph also examines composition locals, including when to use them (and when not to use them).

Resource Roundup

100% pure code!

GitHub: TinyHai / ComposeDragDrop

GitHub user TinyHai offers us DragTarget() and DropTarget() composables, designed to be wrapped in a DragDropBox() that can manage the drag-and-drop state. The result is the ability to drag any drag targets onto any drop targets, with an onDrop event for when the drop occurs.

GitHub: MateriiApps / pullrefresh

GitHub user MateriiApps published a library with a Material-free pull-to-refresh implementation, centered around a PullToRefreshIndicator() composable and associated state.

GitHub: levinzonr / jetpack-compose-ui-arch-plugin

Roman Levinzon built a plugin for Android Studio that offers live templates and a new feature dialog that make it easy to implement Roman’s approach to Compose UI architecture.