jetc.dev Newsletter Issue #111
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.
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
consumeWindowInsetsextension property on
ComposeView, to control whether that view consumes
KeyboardType.Decimalto request an IME that has both numbers (like
KeyboardType.Number) and a decimal key
Nested scroll interoperability between views and composables
A bunch of changes around font management, if you are using
Also, we have
1.0.0-alpha20 of Wear Compose, including:
SwipeToDismiss(), to allow swipe-to-dismiss to only be active on the left edge
SwipeToDismissBox()variant with an
onDismissedparameter, to get control after a swipe gesture has completed (e.g., for a navigation event)
PageIndicatorslot in the Wear-specific edition of
Scaffold(), 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
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.
Posts, videos, and other new information related to Jetpack Compose!
Composed modifiers in Jetpack Compose
Jorge Castillo compares and contrasts using
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
Canvas() implicitly via modifiers like
drawBehind(), and how to wrap
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
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
to composables, complete with a “cheat sheet” for common
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
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
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
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.
- 2023-05-30: Compose beta! Tracking continuous composable presses! Animated carousels! MVI! 2D scrolling layouts! Tables! And... a stable function?!?
- 2023-05-23: Focus and preview cards for Compose for TV! Interactions and visual states! ViewCompositionStrategy! Compose for iOS, for real! @email@example.com is zooming! Data tables! And... BasicTextField2, the sequel?!?
- 2023-05-16: Google I/O! New Compose BOM and alpha! Viewmodels! BottomScaffold()! SealedX! Lottie! Dynamic themes! Floating action menus!