jetc.dev Newsletter Issue #125

Published: 2022-07-26

This week, we look at updated instructions for using composables in a RecyclerView, window insets, and AnimatedVisibility(). We explore movableContentOf() and JSON-defined, Compose-implemented forms. And in “And One More Thing” I explain why you will be seeing fewer “more things”. 😞

Beta Breakdown

Reviewing the release notes for the latest Jetpack Compose update!

Compose Compiler now has a 1.3.0-beta01, independent of the other Compose libraries. Specifically, this beta adds support for Kotlin 1.7.10.

One Off the Stack, One Off the Slack

You’ve got questions. That’s understandable!

How Do I Overlap a Composable’s Corner?

Sometimes, we need to have one composable overlap (on the Z axis) another composable at a particular location, such as in a corner. You can accomplish that using the offset() modifier to adjust a composable’s position after it has been positioned by something like align(). See an example in this week’s highlighted Stack Overflow question!

How Do We Get Layout Coordinates More Quickly?

Sometimes, you need to know the size and/or position of some composable. There are a variety of ways to get that, such as onGloballyPositioned(), onPlaced(), and onSizeChanged(). However, they all get fired on the next composition, not immediately. Learn more about the limitations of these approaches in this week’s highlighted Kotlinlang #compose Slack thread!

Composable Commentary

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

Medium: Jetpack Compose Interop: Using Compose in a RecyclerView

Google’s Chris Arriola updates Google’s recommendations for how to work with composables as items in a RecyclerView. The new approach requires pre-release libraries (right now), but it allows for reuse of ComposeView instances when they are part of a RecyclerView or similar pooled container.

Video: Insets with Alex Vanyo

Google’s Alex Vanyo joined the Code with the Italians team to talk about window insets in Compose UI apps, for avoiding hinges and pinhole cameras and the like.

Medium: Exploring AnimatedVisibility in Compose

Siva Ganesh Kantamani uses this post to examine AnimatedVisibility() to change the visibility of composables using animations, as opposed to simple “smash cut” hiding and showing of those UI elements. Siva looks at a variety of configuration options as well, from duration to customizing the animation effects.

Medium: Appyx is released! (1.0-alpha02)

Zsolt Kocsi announces Appyx, yet another alternative for Compose UI navigation. Appyx skips the typical “define your app in terms of screens” approach, allowing you to navigate to any particular portion of the UI. As a result, navigation can work at any level, from a screen to a small screen element, because Appyx is just focused a state machine — you define the UI to be rendered for any given navigation state.

Medium: Creating a simple colour picker in Jetpack Compose

Jamal Mulla returns, this time looking at implementing a color picker, using a Canvas() for individual color swatches inside of a LazyVerticalGrid() wrapped in an AlertDialog().

movableContentOf and movableContentWithReceiverOf

Jorge Castillo is back, taking a look at movableContentOf() and movableContentWithReceiverOf(), functions that wrap compositions and make it easy to “replay” those in another location within your composition tree. They are designed for helping with shared element transitions, especially when coupled with LookaheadLayout().

Other Interesting Links

• Positional memoization in Jetpack Compose
• How to change system bar colors using Jetpack Compose
• How to use CompositionLocal to implement Analytics in Jetpack Compose
• Medium: Dynamic Bottom Tabs for Jetpack Compose
• Video: TwoPaneLayout on Dual-Screen Devices
• Medium: Animated Splash Screen in Android with Compose
• How to understand Jetpack Compose code
• Requesting Location Permission in Jetpack Compose - UI UX
• Medium: Layouting in Jetpack Compose
• Medium: Mobile Development with SwiftUI and Jetpack Compose

Resource Roundup

100% pure code!

GitHub: copper-leaf / kotlin-json-forms

The Copper Leaf team has created a library that leverages the JSON Schema standard and the JSON Forms format for creating forms on the fly, such as for use as a server-defined UI system. This is available for standard Android-based Compose UI and Compose for Desktop.

Gist: kafri8889 / PickerManager.kt

Anaf Naufalian created a small wrapper around MaterialDatePicker and MaterialTimePicker from the Material Components for Android, so that they can be more easily used from composables. See Anaf’s tweet for a screencast.

…And One More Thing

This section is going to appear only sporadically going forward, and I thought that I should explain why, along with providing a bit of history behind this newsletter.

I started the newsletter about 2.5 years ago. It was part of a plan to position me and my firm (CommonsWare) front-and-center in the world of Compose and Compose UI. I had grand plans for the jetc.dev domain as part of that, much more than the newsletter. However, the newsletter was an easy way to get some stuff going while I executed the rest of those plans, so I started there.

Except… I never executed the rest of those plans.

By this point, CommonsWare was floundering fairly badly. Shortly after starting the newsletter, I faced a choice: aggressively try to keep CommonsWare afloat, or just let it slowly fade while I worked full-time for somebody else. I took the latter route, which eventually culminated in CommonsWare becoming “a hobby with a logo” late last year.

The problem is: the firm I’m working for is not using Compose for much right now. We may get into it more starting later this year or early next year, but we have not decided that yet. Plus, I have not been doing a lot of hobby-level work using Compose, preferring to use 2022 to “decompress” a bit after 13.5 years as a freelance Android developer advocate.

Most of this newsletter does not require me to be doing Compose work “day-in and day-out”. However, many weeks this particular section is a struggle. That is part of the reason why I have taken a break from it a few times. Had I realized when I started the newsletter that things would work out the way that they had, I probably would not have included this section in the first place, or would have set it up to be sporadic from the outset.

So, rather than fight this section every week, I will cut back and only include it some of the time. I apologize to those of you who strongly value this section. My hope is that the rest of the newsletter, highlighting new posts and libraries pertaining to Compose and Compose UI, will still be worthwhile to you.

If you have any questions or concerns about this, feel free to reach out!