jetc.dev Newsletter Issue #197
Published: 2024-01-09
This week, we see how to replace View.GONE
and what it means for composable parameters
to be “equal” for skipping. We explore BasicTextField2()
and compose with Decompose.
We build a semi-circular slider and a segmented picker. And Canopas has been busy,
giving us a showcase library and a composable wrapper for RecyclerView()
!
One Off the Stack, One Off the Slack
You’ve got questions. That’s understandable!
How Do I Replicate View.GONE
?
With classic views, we had the ability to retain the View
but eliminate its UI.
Google’s Rebecca Franks steers us away from that towards conditional compositions,
but does offer an implementation of a gone()
modifier, in this week’s highlighted
Stack Overflow question.
How Are Composable Parameters Compared for Skipping?
If we want a composable to be skipped for recomposition, its parameters must be
equal to those from the previous invocation. But, what exactly constitutes “equals” here?
Is it ==
? Is it ===
? Does the Compose Compiler define ========
?!? Learn more
in this week’s highlighted Kotlinlang #compose
Slack thread.
Composable Commentary
Posts, videos, and other new information related to Jetpack Compose!
Video: TextField in Jetpack Compose: past, present and future
In a presentation for Women Techmakers Berlin,
Alejandra Stamato walks us through the limitations of BasicTextField()
and composables
that wrap it, such as TextField()
and OutlinedTextField()
. Alejandra then
explains how the replacement — currently known as BasicTextField2()
—
will address those concerns and improve the API surface.
Medium: Learn How To Create Shared KMP Navigation With Decompose
Michal Ankiersztajn explains how to use the Decompose library to have navigation within a Compose Multiplatform project, including Android, iOS, and desktop support.
Slides: Architectural Pattern for Large-Scale Jetpack Compose Apps
In a presentation for GDG Ahmedabad, Bhoomi Vaghasiya Gadhiya reviews the main MV* family of architectural patterns, examines how to choose the one that makes sense for your app, and how to implement it in Compose.
Medium: Mastering Text Field Customization in Android with VisualTransformation: A Jetpack Compose Guide
William Rai takes a deep dive into VisualTransformation
with Compose fields, including
the roles of TransformedText
and OffsetMapping
in defining what should appear based
on what a user enters.
The fundamentals of building a circular draggable Slider in Jetpack Compose
Terrence Aluda needed a semi-circular slider, such as you might see in some thermostats.
Terrence accomplished this using a Canvas()
and its drawArc()
and drawCircle()
DSL
functions, along with a pointerInteropModifier()
for handling the touch input.
Medium: Custom Reusable Segmented Picker in Jetpack Compose
Marwa Diab walks us through the implementation of a “segmented picker”: a row of items
where the current selection is highlighted using a rounded rectangle background. This
includes the use of LazyRow()
for the core content, plus a Canvas()
and AnimatedContent
for handling the animation of the selection indicator.
Power Up Your Jetpack Compose Previews
Mitchell Giles explores the range of configuration properties on the @Preview
annotation,
along with other techniques such as having multiple @Preview
annotations for a composable,
defining custom annotations, and applying PreviewParameterProvider
to help supply test
data for the previews.
Other Interesting Links
- Demystifying Jetpack Compose Modifier Order
- Medium: Exploring rememberSaveable in Android Compose
- Medium: How to create Animated Progress Bar in Jetpack Compose using Canvas
- Medium: How to handle multiple Bottom Sheet in Jetpack Compose
- Medium: How to implement Expandable Text in Jetpack Compose
- Medium: How to use Lottie files in Jetpack Compose
- Medium: How to Use Moko-Media and Moko-Permissions in Compose MultiPlatform
- Medium: Jetpack Compose Step by Step Integration Guide
- Medium: Jetpack Compose: Layouts, Animation, and Theming
- Medium: Optimizing Lazy List in Jetpack Compose: Best Practices
- Medium: Scoping shared View Model dependencies in Single Activity Android Apps using Hilt
- rememberSaveable in Jetpack Compose
- Understanding file associations in JVM apps
- Using CSS libraries with Compose for Web
Resource Roundup
100% pure code!
GitHub: canopas / compose-intro-showcase
The Canopas team released a library offering a “showcase” style UI to highlight particular
UI elements, typically for first-time users. It consists primarily of an IntroShowcase()
composable wrapping your UI and an introShowcCaseTarget()
modifier to use on the composables
that you wish to highlight.
GitHub: canopas / compose-recyclerview
The Canopas team also released a library that wraps RecyclerView
in a composable, as
an alternative to LazyColumn()
or LazyRow()
. It supports drag-and-drop, item swipes,
and configuration of the underlying RecyclerView
.
GitHub: frank-nhatvm / jnav
GitHub user frank-nhatvm created another KSP-based annotation processor that simplifies the development of routes for Navigation for Compose.
GitHub: pablichjenkov / macao-sdk
GitHub user pablichjenkov offers us a Compose Multiplatform library with pre-defined composables for navigation and common UX patterns (e.g., authentication).
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?!?