jetc.dev Newsletter Issue #159
This week, we wonder about stateful composables and long for a donut. We
explore circuits, paparazzi, pagers, and
LiveData problems. And we see
a way to figure out why our composables might be recomposing, along with
a Kotlin/Mutliplatform project generator.
One Off the Stack, One Off the Slack
You’ve got questions. That’s understandable!
How Do I Implement a Donut Chart?
A donut chart is like a pie chart with the center cut out. Learn how to render one, even with animated effects, in this week’s highlighted Stack Overflow question.
Should Composables Be Stateful?
In theory, we prefer stateless composables, for easier testing and greater
flexibility. In practice, we sometimes prefer composables like
which manage some state internally, because they are easier to use. We explore
this dichotomy in this week’s highlighted Kotlinlang
#compose Slack thread.
Posts, videos, and other new information related to Jetpack Compose!
Mercari reduces 355K lines of code, a 69% difference, by rebuilding with Jetpack Compose
This is an official Compose UI “puff piece”, outlining the results of Mercari’s rewrite of the app UI in Compose.
Video: The Circuit - Compose-driven Architecture for Kotlin and Android
The Talking Kotlin crew met up with Amrita Venkatraman, Kieran Elliott, and Zac Sweers of Slack, to discuss Circuit. Circuit was mentioned here back in issue #144 and is a Kotlin/Multiplatform library that implements the entire UI architecture via composables, not just the UI elements.
Compose & Paparazzi: Automatically find @Preview composables at runtime
codedogg likes Paparazzi for UI testing,
comparing screenshots with known-good copies. However, by default, Paparazzi
requires you to manually set up those UI tests. codedogg illustrates how we can
use reflection to identify relevant
@Preview-annotated functions and test
them from a single test class.
Medium: Exploring the Official Pager Composable in Jetpack Compose
Many developers used the pager composables from Accompanist, and now they have been
replaced by official implementations. Domen Lanišnik examines the
VerticalPager() composables, including manually setting the page size and
content padding, the impact of
beyondBoundsPageCount, and more.
Medium: Performance Issues with Jetpack Compose & LiveData as a state holder
Roman Kamyshnikov reports on a specific problem with using
where composables that depend on the
LiveData as a source of state might lag
due to the asynchronous nature of
Change themes programmatically
Alex Styl explores supporting both light and dark themes, either implicitly
isSystemInDarkTheme()) or explicitly (parameter supplied to the theme-defining)
Medium: How to Fix Keyboard Issues Introduced in the Latest Jetpack Compose (1.4.0)
Patryk Kosieradzki ran into problems with Compose 1.4.0,
ComposeView, where the soft keyboard (IME) stopped working. While there is an
official bug report for the problem, Patryk demonstrates how to create a
replacement that works around the bug.
Medium: Using Deeplink and UI Testing in Jetpack Compose Navigation
Mert Toptas explores Navigation for Compose’s support for deeplinks, in particular
how to write a UI test using
ActivityScenarioRule that tests whether the deeplink
renders the UI that you expect.
Other Interesting Links
- Using the Navigation Component in Jetpack Compose
- How to handle state in Jetpack Compose
- Medium: Jetpack Compose: Creating Expandable Cards With Content
- Medium: Making a custom shape widget on jetpack compose using Figma and AndroidVectors
- Decimal Input Formatting with Jetpack Compose’s VisualTransformation
- Medium: Migrate from MVVM to MVI
- Medium: Jetpack Compose — Respect the contract of Modifiers
- Medium: Beautiful way to access touch interactions in Jetpack Compose
- Medium: The Pitfalls of Jetpack Compose Recomposition: How to Avoid Breaking Your App
- Medium: Top 5 Android Studio Plugins for Jetpack Compose to Boost Your Productivity
- Medium: How to change status bar color to match your app’s theme in Compose
- Medium: All about AnnotatedString (Jetpack Compose)
- Medium: Android Jetpack Compose for beginners — Part 2
- Medium: Jetpack Compose Tutorial Part 2
- Getting Started with Jetpack Compose Textfield
- What is Jetpack Compose
100% pure code!
GitHub: theapache64 / rebugger
GitHub user theapache64 gives us a
Rebugger() composable that logs to Logcat
State change(s) triggered a recomposition. This is helpful to
determine the “why” of recomposition, given that you have an idea of what composables
GitHub: ygorluizfrazao / composed-permissions
Ygor Frazão offers up a library that helps to hide the complexity of runtime
permission requests, via a
WithPermission() composable that has a slot-based
API for the content to show before permission is granted, after the permission is
granted, and after the permission is denied.
Compose Multiplatform Wizard
This site generates a Compose-centric Kotlin/Multiplatform project for you, given an application ID and display name. You can choose from a small set of initial dependencies for networking, navigation, resource management, and more.
GitHub: Mercandj / compose-aspect-ratio-reference
Jonathan Mercandalli released a small library that adds an
modifier, to allow you to specify an aspect ratio whose sizes are tied to a parent
composable. See this Medium post
Other Interesting Links
- GitHub: tunjid / Tiler (paging API with Compose support)
- GitHub: Mr-Pine / Zoomables (zoom composables)
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!