jetc.dev Newsletter Issue #62
Published: 2021-04-27
beta05
shipped, with relatively few changes!
Beyond that, we look at migrating to Compose, creating lists with all sorts of stuff in them, and try to make sense of effects. We also see a library for material chips and a project template for IntelliJ plugins using Compose for Desktop.
Plus, a special guest appearance by JetBrains’ Roman Elizarov! Or, at least,
he popped into the #compose
channel in Slack, to help explain why we need to type
@
a lot with Compose.
Beta Breakdown
Reviewing the release notes for the latest Jetpack Compose update!
By and large, beta05
was a fairly quiet release, but there still were a few changes
worth pointing out.
If you are using the ui-test-manifest
or ui-tooling-data
artifacts, they have been
updated to support Android 12 a bit better, as is noted in
the compose-runtime
release notes.
The compose-foundation
release notes
point out that FlingBehavior
now has the @Stable
annotation. If you have created
a custom implementation of FlingBehavior
, be sure that it complies with the rules
for @Stable
classes.
And, strangely, there are new experimental APIs in a beta, related to focus management and
text input selection, as is mentioned in
the compose-ui
release notes.
One Off the Stack, One Off the Slack
You’ve got questions. That’s understandable!
drawableStart Equivalent in TextField()
With EditText
, we have android:drawableStart
and android:drawableEnd
to add
icons inside the text field. With TextField()
, we have leadingIcon
and trailingIcon
,
as we see in this week’s highlighted Stack Overflow question.
Why is @Composable an Annotation?
This comes up a lot: why did Jetpack Compose use a @Composable
annotation instead
of adding a composable
keyword? After all, coroutines added suspend
. We get the
answer from JetBrains’ head of Kotlin in this week’s highlighted
Kotlinlang #compose
Slack thread.
Composable Commentary
Posts, videos, and other new information related to Jetpack Compose!
Lessons Learned When Migrating My App to Jetpack Compose
Igor Escodro leads off with a walkthrough of the lessons learned while migrating an existing app to Compose UI, including various stumbles along the way.
Creating a Heterogeneous List with Jetpack Compose
A lot of examples of scrolling lists focus on simple cases, where every row in the list
has the same basic structure. Often, though, we need a mixed set of rows, such as headers
and detail rows. In the first of two posts in this week’s newsletter, Francesc Vilarino Guell
explores how we handled such heterogenous lists with RecyclerView
and how much simpler
this is with the LazyColumn()
builder API.
Video: Side Effects & Effect Handlers
Effects are one of the more confusing aspects of Compose development. In this
screencast, Phillipp Lackner explores this area, including DisposableEffect
and LaunchedEffect
.
Handling User Selectable Themes in Jetpack Compose
Every Compose UI-based app will wind up defining a theme. Francesc Vilarino Guell
demonstrates how to have that theme be chosen by the user, backed by SharedPreferences
,
and driving how our composables get rendered.
Navigation Drawer Using Jetpack Compose
Avanish Agarwal explores using Scaffold()
in conjunction with Navigation for Compose
to set up a nav drawer and display different composables based on what the user clicks there.
Jetpack Compose: Building a Generic Grid Canvas
Patxi Bocos wanted to make a composable in the style of the IntelliJ IDEA splash screen
with a grid of colored circles and circle segments. This week’s post follows up from
Patxi’s original post
and looks at how to implement a flexible grid structure atop a Compose Canvas()
.
Why Declarative UIs on Android?
Raul Hernandez Lopez asks a popular question: why? 🤔
More specifically, Raul explores why we need a declarative UI for Android, contrasting it with imperative UI systems (like views and layouts) and exploring how each get implemented in a unidirectional data flow (UDF) architecture.
Real-Time Lifecycle-Aware Updates in Jetpack Compose
Denis Rudenko is back, with a review of how composables and coroutines interact.
In particular, Denis looks at the lifecycle ramifications of observing a Flow
,
both for simple I/O and for real-time continuous data updates.
Implementing a Number Pad in Jetpack Compose
While usually we want to use standard Android keyboards for data entry, sometimes we have a need for custom text entry keypad. Thomas Künneth walks through how to set up a numeric keypad in this fashion, with click handlers to find out what the user types.
Other Interesting Links
- Handling lifecycle events on Jetpack Compose
- Using State in Jetpack Compose
- Managing State in Compose
- Pi Practice App in Compose
- Complex UI in Jetpack Compose
- Learning Live Templates for Jetpack Compose
Resource Roundup
100% pure code!
GitHub: compose-museum / SimpleTags
GitHub user compose-museum wrote a library offering material chips (“tags”), with text, associated icons, background colors, and a slot for a click listener.
GitHub: c5inco / Compose-Desktop-Plugin-Template
Google’s Chris Sinco crafted a project template that creates a Compose for Desktop project that implements an IntelliJ plugin, for extending IDEA, Android Studio, etc.
GitHub: joreilly / StarWars
John O’Reilly is back, this time with a Kotlin/Multiplatform sample app, with SwiftUI and Compose UI, that uses GraphQL to display information from the Star Wars database. It is unclear why John released this now versus waiting for May 4th, though. 😁
GitHub: Tlaster / Swiper
GitHub user Tlaster returns, this time with another library offering another take on the swipe-to-dismiss UI pattern.
Gist: vganin / FlexRow.kt
Vsevolod Ganin brings us a code snippet for a “flow row” (i.e., a row whose contents wrap when it runs out of horizontal space).
…And One More Thing
Jetpack Compose still has a lot of bugs. While many of those issue tracker entries are not actual bugs (feature requests, random questions, etc.), many of them are bugs. For example, text entry has problems with non-GBoard keyboards.
If you are experimenting with Compose UI, you are likely to run into some problems. When you do:
-
Check to see if there is a bug report for it
-
If there is none, file a bug report with a sample app that reproduces the problem
Far too many issues filed on Google’s issue tracker lack that sort of sample app. While the Compose team does an exemplary job with such issues, it still slows their response time.
There is a good chance that Google is going to consider the May 5 beta06
to be the last beta release, with the final 1.0.0 version shipping during
Google I|O. Any bugs that we find and report now would then get addressed in 1.0.x
patch releases or perhaps a 1.1 alpha. However, the more details that we can provide
about the bug, the more likely it is that Google can fix the bug faster.
Conversely, not providing a project that reproduces the error – or at the very least the source of a composable – means that the Compose team will need to create their own project, and they may have difficulty reproducing your problem.
In other words, the easiest way for Google to help you (by fixing bugs) is for you to help Google (by providing clear ways to reproduce the bugs).
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?!?