jetc.dev Newsletter Issue #48
Published: 2021-01-19
alpha10
is out! So, this week, we look at the release notes and see what changes
are in store (focus, animation, and more). We also look at floating action menus,
charts, and the Surface Duo. Plus, we look at the challenges we face when applying
Compose UI in unusual situations, such as for implementing an input method.
…and we see how to ellipsize text.
One Off the Stack, One Off the Slack
You’ve got questions. That’s understandable!
Ellipsizing Text
With the classic TextView
, we have ways to control how many lines are used
for our text and what to do when we run out of room (e.g., append an ellipsis).
BasicText()
offers similar maxLines
and overflow
properties to control
this behavior, as we see in this week’s highlighted Stack Overflow thread.
Matching the Parent’s Size
Box()
has some convenient modifiers in its BoxScope
, such as matchParentSize()
,
to cause a child to size itself based on the parent’s size. Those modifiers
are only available on Box()
, though. However, there are more flexible alternative
solutions for the same problem, as we see in this week’s highlighted kotlinlang
Slack thread.
Alpha Analysis
Reviewing the release notes for the latest Jetpack Compose update!
Compose Runtime alpha10 Release Notes
If you have written utilities or similar code that work at a low level with
nodes, you may run into a breaking change in alpha10
. There is a new batch API
for applying changes to nodes, and apparently you do not have access to nodes
until those changes get applied. The release notes mention a workaround using
a SideEffect
to defer execution of your code until the proper time.
Compose Foundation alpha10 Release Notes
FlowRow()
and FlowColumn()
were deprecated, with no replacements. Also, a bunch of
specialty items were renamed, such as EditOperation
to EditCommand
.
Compose UI alpha10 Release Notes
Some focus-related improvements were released, including a focusOrder()
modifier to let you control focus traversal. animate()
is now animateAsState()
,
with a corresponding change in the return type to be a State
rather than just
the underlying type being animated. And there is a newAnimatable
API.
Compose Material alpha10 Release Notes
We finally get disabled and read-only text fields, via enabled
and readOnly
parameters on BasicTextField()
and its wrappers (e.g., TextField()
, OutlinedTextField()
).
Composable Commentary
Posts, videos, and other new information related to Jetpack Compose!
Jetpack Compose Components (Part 2)
Siva Ganesh Kantamani continues his quick tour of major Compose UI elements,
this time looking at Icon()
and Image()
for images, progress indicators,
RadioButton()
, Spacer()
, and more.
Helping You Understand The Syntax of Jetpack Compose
Oussama Hafferssas takes a look at the Kotlin syntax used by Compose and discusses how much of it is ordinary, if sophisticated, Kotlin programming. No magic required!
Video: Pagination with Jetpack Compose
Mitch Tabian adds to his lengthy roster of Compose screencasts with a look at Paging for Compose, using it to drive a UI backed by a paged API for accessing a roster of recipes.
Building a Multi-Action Floating Action Button in Jetpack Compose
Joe Birch returns, this time taking a look at the floating action menu pattern and how to implement one in Compose UI, complete with a translucent overlay, custom menu images and captions, and more!
Customize a Compose for Desktop AlertDialog
Thomas Kuenneth continues documenting his Compose for Desktop experiences, this
time with a look at showing desktop dialogs and shows how AlertDialog()
gives you
a lot of control… which you need to get the dialog to look and work correctly.
Thomas also has another post up this
week, continuing his examination of the Canvas()
API in Compose UI.
Shapes in Jetpack Compose
Rasul Aghakishiyev returns with another look at using lower-level shape APIs
in Compose UI, including a brief look at a triangular SeekBar
-style UI element.
Compose (UI) beyond the UI (Part I): big changes
Jordi Saumell takes a more strategic look at Compose and Compose UI, pointing out various aspects of traditional Android app development that are likely to change a lot in the coming years.
How to Create Realistic UI with Jetpack Compose (Part II)
Kruti Kamani brings us another tour of setting up a Compose UI project and creating a UI, in this case showing a catalog of various types of flowers.
Resource Roundup
100% pure code!
GitHub: tehras / charts
Taras Koshkin offers up a demonstration of implementing composables for common chart formats, including line, bar, and pie charts.
GitHub: TheCodeMonks / TopCorn2
The Code Monks bring us a Compose UI app to display movie listings, pulled from IMDB’s Web service.
GitHub: microsoft / surface-duo-compose-samples
In 2020, Microsoft released the Surface Duo, an Android-powered dual-screen device. Microsoft has been pretty good about making code samples available to show how to work with those dual screens, and this repo contains Compose UI-specific examples.
GitHub: joreilly / chip-8
John O’Reilly is back, this time with a Kotlin/Multiplatform port of Cedric Beust’s Chip-8 game emulator. John’s version supports iOS via SwiftUI, plus Android and the desktop using Compose UI.
…And One More Thing
Right now, the focus is on using Compose UI for traditional activity/fragment-style Android app screens. This is perfectly reasonable, as those screens are the backbone of most apps.
However, View
gets used in a number of other places and other ways. Over time,
we will need to identify which of those can be adapted to work with Compose UI.
For example, GitHub/Stack Overflow user Yannick has been experimenting with
Compose UI… for an InputMethodService
. We should be perfectly capable of
creating soft keyboards using Compose UI, as that is all in-process UI
rendering (as opposed to app widgets or other use cases for RemoteViews
).
However, Compose UI needs some lifecycle support, and Yannick
ran into problems with that.
Not only does InputMethodService
not offer any Lifecycle
-related APIs,
but we cannot even use something like LifecycleService
, as that is set to
extend Service
, not InputMethodService
.
Yannick eventually figured out how to grab code from ComponentActivity
to create an InputMethodService
with support for LifecycleOwner
,
ViewModelStoreOwner
, and SavedStateRegistryOwner
. This GitHub repo
contains Yannick’s results.
Other areas will need similar treatment. In the “Resource Roundup” section,
I pointed out Microsoft demonstrating using Compose UI for the Surface Duo’s dual screens.
I expect to do some work tying Compose UI into Presentation
for external display
support (monitors, projectors, etc.). And, undoubtedly, there will be other
use cases for this sort of solution.
We might get official support for these atypical View
consumers from Google.
But, in many cases, I suspect that we will not. For example, I will be surprised
(but pleased) if Google offered an official rendition of Yannick’s solution
for InputMethodService
. Google does not have infinite amount of development
time, and so the “long tail” of View
consumers may get neglected. It will
be up to the Yannicks of the world — the Android developer ecosystem —
to fill in the gaps.
What I do hope for is some official guidance for the general approach to take for filling in those gaps. While Yannick’s approach looks reasonable, there may be some subtle API nuances that Yannick and I are missing, ones that may prove important over time.
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?!?