jetc.dev Newsletter Issue #111
Published: 2022-04-12
1.2.0-alpha07
is out, as well as Wear Compose’s 1.0.0-alpha20
— we look at what’s new
in each of those!
Plus, we look at centered cursors, custom modifiers, Canvas()
basics, and
drag-and-drop. We look at some colorful sliders, and I put out a call for somebody
to write the “go-to” rich text editor for Compose UI.
Alpha Analysis
Reviewing the release notes for the latest Jetpack Compose update!
1.2.0-alpha07
was released, and with it, we got:
-
Snapshot.withoutReadObservation()
, as a way to read a snapshot-managed value without subscribing to changes and triggering recomposition -
A
consumeWindowInsets
extension property onComposeView
, to control whether that view consumesWindowInsets
or not -
A
KeyboardType.Decimal
to request an IME that has both numbers (likeKeyboardType.Number
) and a decimal key -
Nested scroll interoperability between views and composables
-
A bunch of changes around font management, if you are using
FontFamily
,Font()
, etc.
Also, we have 1.0.0-alpha20
of Wear Compose, including:
-
A new
edgeSwipeToDismiss
modifier forSwipeToDismiss()
, to allow swipe-to-dismiss to only be active on the left edge -
A new
SwipeToDismissBox()
variant with anonDismissed
parameter, to get control after a swipe gesture has completed (e.g., for a navigation event) -
A new
PageIndicator
slot in the Wear-specific edition ofScaffold()
, to help with round watches
One Off the Stack, One Off the Slack
You’ve got questions. That’s understandable!
How Can We Center a Field’s Cursor?
On rare occasion, we might need to have a BasicTextField()
where the cursor remains
centered. The fix involves a custom textStyle
, where we configure the textAlign
property, as we see in this week’s highlighted Stack Overflow question.
How Do We Have Immutable State?
Suppose you have a condition where you want a State
in one branch and an immutable
value in another — how do you handle this? By “rethinking your priors”, as we see
in this week’s highlighted Kotlinlang #compose
Slack thread.
Composable Commentary
Posts, videos, and other new information related to Jetpack Compose!
Composed modifiers in Jetpack Compose
Jorge Castillo compares and contrasts using then()
and composed()
for constructing
custom modifiers. The primary difference is in state: then()
is for the (preferred)
stateless modifier, while composed()
is for one that has state.
Medium: Jetpack compose navigation with custom NavType
Yves Kalume explores using Parcelable
parameters in Navigation for Compose, including
how we wrap them in a NavType
to allow them to be passed both in a Bundle
and in
a stringified form.
Getting started with Canvas in Compose
James Shvarts is back, this time looking at the Canvas()
composable, which underlies
most of the Compose UI composables. James reviews basic drawing operations, how we can
work with Canvas()
implicitly via modifiers like drawBehind()
, and how to wrap Canvas()
in a custom composable.
How to Drag And Drop Views in Jetpack Compose
Radhika S examines what it takes to create drag-and-drop interfaces with Compose UI, using
the detectDragGesturesAfterLongPress()
modifier to trigger drag-and-drop from a long-press
gesture on a composable.
Slides: Something old, something new
Maia Grotepass delivered a presentation at DevConf 2022, talking about interoperability between Compose UI and existing Android app code, particularly legacy UIs.
Medium: Jetpack Compose Test with WireMock
Swarnlata Kumari looks at how to use WireMock for mocking Web service responses, within the context of testing your composables.
Medium: From View to Composable: A Quick jump to Jetpack Compose from an Android View mindset
Alex Styl walks newcomers to Compose UI to how to map core View
constructs
to composables, complete with a “cheat sheet” for common View
->composable conversions.
Other Interesting Links
- Podcast: Jetpack Compose UI Development with Thomas Künneth
- Slides: UI Testing Jetpack Compose apps
- Medium: 2-Way flow using Jetpack compose and Datastore
- Medium: 7 Annoying Things About Jetpack Compose According to Me
- Shader based render effects in Compose Desktop with Skia
- Medium: Build Modern UIs with Compose, PageUiState and FlowState
- OutlinedTextField - Jetpack Compose
Resource Roundup
100% pure code!
GitHub: SmartToolFactory / Compose-Colorful-Sliders
The team at SmartToolFactory has released a library containing a variety of slider composables, including ones with associated labels, custom thumbs, and more!
Gist: darvld / StaggeredVerticalGrid.kt
Dario Valdespino assembled a simple staggered grid implementation.
…And One More Thing
If you wanted to try to leave a lasting mark on Compose UI development, you could try to write a rich text editor.
Google has never offered a rich text editing component for Android, despite there
seeming to be wide interest in one. We have a few options using classic Views
, though
some of those simply load JavaScript rich text editors into a WebView
. While that
works, it can be slow to initialize, is fairly heavyweight in terms of resource usage,
and is at risk of any problems stemming from the Chrome implementation of WebView
.
Writing a rich text editor as a native custom View
is possible — I took a stab
at it a decade or so ago and the results were less than stellar.
But, it is 2022, and it is high time that we had a “go-to” rich text editor. I have seen some nascent Compose UI options, and it will be interesting to see if any of them become popular, if something new shows up that becomes dominant, or if we wind up in the same situation as we have been, with no popular options.
Or, you can subscribe to the Atom feed or follow Mark Murphy in the Fediverse.
Recent Issues:
- 2024-11-12: @cbruegg@mastodon.green on Compose 1.7 and compatibility! @eevis@mas.to on rendering text in a Canvas! @sinasamaki@androiddev.social and a centered slider! @touchlab@mastodon.social with a Compose-Swift bridge! And... is NavigationSuiteScaffold() FAB?!?
- 2024-11-05: Compose patch release! Compose alpha! 2025 Compose Multiplatform plans! Glance! Side panels! @theapache64@androiddev.social on performance! Tables! And... reacting to a broadcast from a composable?!?
- 2024-10-29: Relay! Paparazzi! droidcon Lisbon 2024! Server-defined UI! And... desktop OS trays?!?