jetc.dev Newsletter Issue #98
Published: 2022-01-04
It was a quiet week in the world of Compose. Still, we try to remember when we need
to use rememberSaveable()
, deal with composables per product flavor, and implement
an animated loading button. We also look at adding action menus and preference screens,
mimicking what we are used to in the pre-Compose world. And Kirill Grouchnikov
takes a deep dive into why some Compose-defined gradients turn out ugly.
One Off the Stack, One Off the Slack
You’ve got questions. That’s understandable!
Why Does rememberLauncherForActivityResult() Lose State?
Whenever your app’s UI moves to the background, your process is at risk of being
terminated to free up system RAM. We think of this a lot with system HOME navigation, and
occasionally for other things like launching a camera app. However, it could happen for
other launch-an-app scenarios as well. To handle those, we need to rely on rememberSaveable()
,
not just remember()
, as we see in this week’s highlighted Stack Overflow question.
Is It Safe to Nest Coroutines?
LaunchedEffect()
runs your supplied lambda in a coroutine. The question is: is it
safe to then launch()
another coroutine from inside of that coroutine? In short, the answer
appears to be “yes”, as we see in this week’s highlighted Kotlinlang #compose
Slack thread.
Composable Commentary
Posts, videos, and other new information related to Jetpack Compose!
Medium: Jetpack Compose in Multi Flavor Apps
Sebastian Rieger works on a “white label” app, one that uses product flavors
to customize the app for different targets. In a View
-based system, you can easily
override resources for that. Porting that to Compose UI requires different approaches,
and Sebastian demonstrates how they handled per-flavor colors in this Medium post.
Medium: Creating a Loading Button in Jetpack Compose
Francesc Vilarino Guell returns, this time looking at a button that changes
its content from a typical text label to an animated loading state and back again.
This is a bit tricky, particularly if you want the button to stay the same
size, rather than resizing as the content changes. Francesc demonstrates a
LoadingIndicator()
composable for the animated loading state and a LoadingButton()
composable that handles the full UI.
Medium: Screen templates — using Compose, SwiftUI & KMM
Ian Alexander wrote about how to minimize code duplication in a Kotlin/Multiplatform project by use of screen templates, to try to isolate only the differences in UI rendering and keep the rest of the presentation logic common between platforms.
Polish your Jetpack Compose dev experience
Thomas Künneth is back, looking at how we can use file templates and live templates in Android Studio to simplify some aspects of our Compose development process.
Compose Desktop gradients and Skia shaders
Kirill Grouchnikov continues an exploration of Compose for Desktop. Gradient fills
are popular, but the way that the Skia-backed Brush.horizontalGradient()
actually interpolates between start and end colors sometimes gives poor results.
Kirill experiments with a few other gradient implementations to try to improve
on those results.
Jetpack Compose - Configuring Slider with Label
You have probably seen volume sliders and the like that have a floating bubble over
the slider thumb, showing the current value of the slider. That bubble moves along
with the thumb and updates to reflect changes in the value. Since the Slider()
composable in Compose Material does not currently support this, MK decided to create
one, and in this post shows how it is accomplished.
Medium: Interacting with Composable Canvas
Piotr Prus needed to build an interactive bar chart, supporting both bar selections
and horizontal swipe gestures to show more of the chart. After an initial Box()
-based
implementation failed for performance reasons, Piotr created one using a raw Canvas()
with some custom gesture management to handle the selections and scrolling.
Other Interesting Links
- Swipe to Dismiss — Jetpack Compose
- Medium: Using Jetpack Compose in XML/View and Vice Versa: Perfect Interoperability
- Medium: How to play youtube videos in Jetpack Compose
- Jetpack Compose Tidbits: The first dance with JC - Learning the steps
Resource Roundup
100% pure code!
GitHub: jacobras / ComposeActionMenu
TopAppBar()
does not handle all of the functionality that we associate with an
action bar/toolbar/app bar. To help fill the gap, Jacob Ras released an implementation
of an action menu for TopAppBar()
, with support for toolbar icons, an overflow
menu, checkable items, and more!
GitHub: JamalMulla / ComposePrefs
PreferenceScreen
and its related Preference
types handle both the UI for
displaying/collecting preference values and the logic to persist those. Jamal Mulla
took the same approach here, where you use PrefsScreen()
and related composables
to build up an equivalent UI with built-in DataStore
support.
Other Interesting Links
…And One More Thing
This section took a vacation the week between Christmas and New Year’s, but it should return next week!
Or, you can subscribe to the Atom feed or follow Mark Murphy in the Fediverse.
Recent Issues:
- 2024-12-03: Rebecca Franks on clipping and masking! Stefano Natali on graphicsLayer()! FunkyMuse on type-safe nav results! And... if we have enough maps, do we need to store our maps in a Map?!?
- 2024-11-26: Math! Shared element transitions! Custom modifiers! Macrobenchmark! Adapting to platform-specific design systems! And... why does wrapContentSize() not wrap my content size?!?
- 2024-11-19: Compose alphas! Compose Multiplatform patch! PaddingValues! Graphics layers! Swiping! Heatmaps! Navigation! And... why did we get a new production Compose BOM?!?