jetc.dev Newsletter Issue #228
Published: 2024-08-20
This week, we look at enterTransition
and play with a Brush
. We learn more
about the implementation of rememberCoroutineScope()
and use AGSL-based shaders
across platforms. And we look at a lot of composable icons (so. many. icons.).
One Off the Stack, One Off the Slack
You’ve got questions. That’s understandable!
How Can I Have Different enterTransition
Values?
With Navigation for Compose, it may be that you need different enterTransition
values based on circumstances, such as the navigation route you are taking. Fortunately,
Navigation for Compose gives you access to an AnimatedContentScope
to address
this concern, as we see in this week’s highlighted Stack Overflow question
How Can I Conditionally Apply a Modifier?
You have several options for adding a modifier to your chain only under certain
conditions: scope functions like let()
or apply()
, then()
, or custom wrappers
around those. Learn more in this week’s highlighted Kotlinlang #compose
Slack
thread.
Composable Commentary
Posts, videos, and other new information related to Jetpack Compose!
Video: Brush (Compose Tips)
Rebecca Franks (@riggaroo@androiddev.social) continues Google’s series of short Compose videos, this one looking
at solid and gradient Brush
objects and how you can use them in rendering
backgrounds, Canvas()
drawing directives, and more.
Medium: Why you can’t use random Coroutine scope in Compose?
Rajesh Hadiya explains why we use rememberCoroutineScope()
as opposed to
just whipping up our own CoroutineScope
instance. Along the way, Rajesh
explains what is missing in our CoroutineScope
(the MonotonicFrameClock
)
and how to fill that gap.
Medium: Pushing the Boundaries of Compose Multiplatform with AGSL Shaders
Manel Martos Roldán demonstrates how to add AGSL-defined shaders to the graphics pipeline,
both on Android and on Skia-powered Compose Multiplatform targets. Manel shows how
to create an expect
/actual
Kotlin Multiplatform API that helps hide the differences
between the targets.
Medium: Guiding Users with Subtlety: Implementing Rich Tool Tips for Onboarding in Jetpack Compose
Kerry Bisset walks us through a few onboarding UI approaches (slides, walkthroughs,
etc.), before exploring TooltipBox()
and RichTooltip()
in Compose Material3
and how to use a sequence of those in a similar role.
Medium: Тhe Power of Jetpack Compose and Coroutines for Modern Android Development
Dobri Kostadinov takes a broad look at how Compose works with coroutines, from
LaunchedEffect()
and rememberCoroutineScope()
to integration with viewmodels.
Medium: Designing Effective UIs For Enhancing Compose Previews
Jaewoong Eum (@skydoves@androiddev.social) provides advice for writing quality @Preview
functions, including
what to do about viewmodels, how to leverage LocalInspectionMode
for tailored
mock data, creating custom multi-preview annotations, and more.
Other Interesting Links
- Medium: Compose Navigation in KMP
- Medium: Dynamic Color Retrieval from Images using Jetpack Compose
- Medium: HomeMade ImageLoading Library for KMP from Scratch — Part 1
- Medium: Introduction to Jetpack Compose Animations
- Medium: Jetpack Compose Keyboard: Quick Tips
- Medium: Mastering Layouts in Jetpack Compose: Understanding Padding and Margin
- Medium: Pagination With Room Database and Jetpack Compose — Part 1
- Medium: Refactoring from MVVM to MVI: A Practical Guide
- Medium: Understanding MVI Architecture in Android Jetpack Compose
- Why not JetPack Compose with DiffUtil?
Resource Roundup
100% pure code!
GitHub: Lennoard / Snappier
Lennoard Silva is building a Compose Multiplatform server-defined UI framework, supporing Android, iOS, desktop, and Web/JS. Snappier will load the UI from the Web for you, or you can handle the transport and let it just handle the rendering.
Compose Icons
Alex Styl has compiled a catalog of over 7,000 icons, all of which can be added to your Compose project by clicking on the icon, choosing “Copy Compose”, and then pasting the resulting composable into your project. The site also supports copying SVGs for use in design tools, etc.
GitHub: burnoo / compose-remember-setting
Bruno Wieczorek previously published a library for remembering composable state using DataStore. This new library fills a similar role, but for Compose Multiplatform, leveraging Russell Wolf’s multiplaform-settings library for storage.
KLocation
The Addhen Limited team has published a Kotlin Multiplatform library for location retrieval (e.g., GPS) on Android and iOS. It includes a dedicated artifact for Compose Multiplatform, offering a convenient API to get locations directly into your composables.
GitHub: SimformSolutionsPvtLtd / SSComposeCookBook
The Simform Solutions team has published a “cookbook” for building user interfaces with Compose, with many code samples to help simplify adoption.
Notable Releases
Coil’s 3.0.0-alpha10
release
supports loading images from Compose Multiplatform resources. It also adds a
maxBitmapSize
property to help avoid out-of-memory errors, among other improvements.
Circuit’s 0.23.1
release
adds a CircuitPreview()
function for previews of Circuit-powered composables, among
other changes.
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?!?