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.