jetc.dev Newsletter Issue #82
Published: 2021-09-14
This week, we look at the composable equivalent of theme overlays and how to implement a drop-down menu. We explore writing tests for in-progress Compose migrations and look at a syntax highlighter library. We even look at how donut holes relate to recomposition.
Plus, Doris Liu helps us make sense of all the types of animations in Compose UI. So. Many. Animations.
One Off the Stack, One Off the Slack
You’ve got questions. That’s understandable!
Passing Identifiers to Viewmodels
Sometimes, we would like our viewmodels to get identifiers as constructor parameters.
If you are using Navigation for Compose, SavedStateHandle
support makes that fairly
easy, as Google’s Ian Lake shows us in this week’s highlighted Stack Overflow question.
How Do We Implement Theme Overlays in Compose UI?
Arranging to override certain colors for certain portions of your app was sometimes
a bit confusing with the classic View
system. Compose UI makes it blissfully
simple, as we see in this week’s Kotlinlang #compose
Slack thread.
Composable Commentary
Posts, videos, and other new information related to Jetpack Compose!
Podcast: Compose Tooling
Google’s Diego Perez, Nicolas Roard, and Chris Sinco joined this episode of Android Developers Backstage to discuss how Android Studio is approaching Compose, including how code-based UIs required a new way of thinking for tools like the Layout Inspector.
Video: Animations - with Doris Liu
Ivan Morgillo and Sebastiano Poggi of “Code with the Italians” have another two-hour episode up, this one featuring Google’s Doris Liu, looking at the dizzying array of animation options in Compose UI and how to choose between them and apply them.
Testing Hybrid Jetpack Compose Apps
Annyce Davis wrote about writing tests for apps that are partway through a migration to
Compose UI, with a bunch of fragments wrapping ComposeView
widgets for displaying composables.
Annyce covers how to test this case, when your app is using Jetpack Navigation… but
not Navigation for Compose, since the navigation is between fragments, not composables.
Build Android DropdownMenu in Jetpack Compose
Siva Ganesh Kantamani is back, this time looking at how to build a ComposeMenu()
to handle scenarios in your UI where you might have used Spinner
with the classic
View
system. ComposeMenu()
, in turn, uses the DropdownMenu()
from Compose Material.
What is “donut-hole skipping” in Jetpack Compose?
One of the perpetual mysteries of Compose is “when do things gets recomposed?”. Vinay Gaba
takes a look at that, with a SideEffect()
-based logging composable, to show that what
gets recomposed might not be what you expect. And, yes, the explanation involves donuts.
Jetpack Compose Side-Effects II — rememberCoroutineScope
Udit Verma continues a tour of the effect API and related concerns.
Previously
Udit looked at LaunchedEffect()
for coroutines — this time, Udit looks
at rememberCoroutineScope()
as another way to get a CoroutineScope
tied to
the lifecycle of your composable.
Emoji Slider in Jetpack Compose using Canvas API
Mohit Sharma created custom SeekBar
-style composable, with emojis as the thumbs
and showing a resized edition of the emoji while the user is dragging that thumb.
In this post, Mohit shows, piece by piece, how to build up this UI, from rendering
the emoji to processing the touch events.
Medium: Handling StatusBar colors when using ModalBottomSheets in Jetpack Compose.
Lorenzo Benevento ran into a problem: by default, when using ModalBottomSheetLayout()
, the status
bar’s color remains the same, even if the rest of your content gets grayed out due to the
modality of the bottom sheet. Lorenzo was unhappy about this and elected to use
Accompanist, some theme tweaks, and a few composables to address the concern.
Other Interesting Links
- Podcast: Talking Compose in Production with Jossi Wolf
- Jetpack Compose - States and Custom Shapes (Part 2)
- Creating a Repeating Button with Jetpack Compose
- Jetpack Compose: InteractionSources, Ripple, and You
- Video: Exploring Advanced Jetpack Compose Features
- Video: Jetpack Compose for Beginners
- Animated Splash Screen in Android Using Jetpack Compose
- Adopting Jetpack Compose with Interop API
- Video: Jetpack Compose Navigation
- Video: Jetpack Compose, Ktor & Coil
- Medium: Jetpack Compose — pros and cons of using it in production
Resource Roundup
100% pure code!
GitHub: Madrapps / plot
GitHub user Madrapps offers us a LineGraph()
composable for rendering a line graph for multiple
data sets. It includes a full set of gestures (e.g., zooming) and is fairly customizable.
GitHub: GerardPaligot / kighlighter
Gérard Paligot created a syntax highlighter based on Text()
and AnnotatedString
,
and supporting both Compose for Android and JetBrains Compose for Desktop.
…And One More Thing
Once again, a couple of weeks ago, a reader asked in Kotlinlang Slack:
Moreover, is there a plan to make Jetpack Compose the primary view system for Android, or just an alternative?
This depends a lot on what one means by “the primary view system”. And, of course, it also depends on the definition of “a plan”, as Google famously tries to minimize any statements regarding future development.
If by “primary view system”, one means “the UI system that ships in the OS”, then no, Compose UI
will not be replacing the View
system. As I wrote in that Slack thread:
in the end, Compose UI is a very very very very complex custom
View
ComposeView
is not just a way to get a composable into an existing layout. It
is also the underpinning of setContent()
on a ComponentActivity
. And ComposeView
is “just” a View
, albeit one with an absolutely massive set of functionality.
So, Compose UI needs the View
system to work in Android, as the View
system is the
way to get to the screen. Between that, 13+ years of legacy code, and Compose’s status
as a set of libraries, it is inconceivable that Android will somehow remove View
and replace it with Compose UI in some future Android release (e.g., Android W).
If by “primary view system”, one means “the way that Google delivers new UI constructs to developers”,
then probably that will be the case eventually. As Compose UI rises in popularity,
some Google teams are going to elect to create new UI patterns as composables and
either not bother with a View
implementation or settle for using ComposeView
as the way to bridge the two worlds. A major milestone, years away, will be if and
when the Material Components for Android are considered to be frozen and all new
Material Design work would be done as part of Compose Material or other composable libraries.
The person who started the Slack thread might have been considering “primary view system” to mean “how Google expects developers to create a UI”, based on the follow-up question in the thread:
I’m wondering how much Google with promote Jetpack Compose as the primary way to make android UI. At the moment it’s the forth tab along to get to Jetpack and then the fifth tab along to get to Compose. I wouldn’t say it’s the mainstay of Android development currently. WIl Google, in time, push it further to the front?
I expect that Google will steadily ramp up the push for developers to use Compose. The analogy I drew in the Slack thread is one that I have used before, which is how Google approached Kotlin:
- “Would you like another programming language?”
- “OK, we added support for Kotlin”
- “We are now ‘Kotlin first’”
And, there is an implied fourth bullet: “Um, why are you not using Kotlin?”. Eventually, while Google will still support Java code, they might elect to stop supporting Java education, and elect to have all future SDK documentation and similar resources be purely in Kotlin. They are fairly far down that path already.
My guess is that we will see a similar progression with Compose UI:
- “Would you like an overhauled UI system?”
- “OK, we implemented Jetpack Compose and Compose UI”
- “We are now ‘Compose first’”
- “Um, why are you not using Compose UI?”
Right now, we are at the second bullet, but I think we will progress through the other two bullets in the coming years.
Or, you can subscribe to the Atom feed or follow Mark Murphy in the Fediverse.
Recent Issues:
- 2024-10-01: Lazy grids! Focus! @colinmarsch@androiddev.social on CMP accessibility! @skydoves@androiddev.social on Landscapist! @sinasamaki@androiddev.social on Slider()! And... what is it?!?
- 2024-09-24: A Compose security fix and a new alpha! clipToBounds()! Localization! offset()! @skydoves@androiddev.social on server-defined UI! Bottom sheets! And... someone set us up *3* BOMs?!?
- 2024-09-17: Compose 1.7.1 and Compose Multiplatform 1.7.0-beta02! Flow layouts! TV Compose! SharedBounds! Image cropping! And... why does remember() not seem always to remember?!?