jetc.dev Newsletter Issue #173
This week, we look at ellpisizing and custom design systems. We explore where Coil is going and take a deep dive into accessibility. And we examine dealing with avoiding font scaling, from a simple extension property to a KSP-based code generator for creating dimension values tied to screen widths.
One Off the Stack, One Off the Slack
You’ve got questions. That’s understandable!
Text() that we want to ellipsize is alongside other elements in a
Getting that text to properly truncate, without harming the other elements, can be a
bit tricky —
weight() alone might not be enough. Learn more in this week’s
highlighted Stack Overflow question.
Designers do not always like using Material Design. Sometimes they try applying iOS
designs to Android, or they just do something totally different. Compose UI has the
capability of supporting a fully custom design system, but much of the documentation
and examples assume Compose Material or Compose Material3. See how various developers
approached the problem in this week’s highlighted Kotlinlang
#compose Slack thread.
Posts, videos, and other new information related to Jetpack Compose!
Eeva-Jonna Panula continues the accessibility theme and dives into more modifier-centric
ways to improve accessibility. Topics include the
role parameter to
selectableGroup() for radio buttons and their captions,
toggleable() for switches/checkboxes and their captions.
The YML Innovation Lab describes their Y-Charts library for implementing bar charts, line charts, wave charts, bubble charts, pie charts, and donut charts in Compose UI. So. Many. Charts.
Last week, I blogged about how text will not always scale.
Katie Barnett follows up with an implementation of a
nonScaledSp extension property
that is usable with
TextStyle but avoids applying the system font scale for
situations where that is unnecessary.
Glenn Sandoval has been exploring the collapsing-toolbar UI pattern in Compose UI over
several Medium posts. In this one, Glenn adds some “fine-tuning” polish to the
Other Interesting Links
- Android Development: Using Alert Dialog with Button in Jetpack Compose
- Creating a Dashed Border in Jetpack Compose
- ElevatedButton in Material 3 Jetpack Compose
- Lottie Animations in Jetpack Compose (with Examples)
- Medium: Creating interactive UIs with Motion Layout using Jetpack Compose
- Medium: Error Handling in Clean Architecture using Flow and Jetpack Compose
- Medium: Navigating Back with Data in Jetpack Compose
- Navigation With Compose
- TextButton in Material 3 Jetpack Compose
100% pure code!
affogato library suite has a library for Compose unit sizes.
In addition to implementations of
ssp units, it also offers
@Dimen annotation that uses a KSP code generator to allow you to easily
adjust dimensions based on current screen width. This library also a variety
of extensions for window size classes, folding device postures, and more.
You may have seen video editors that explode a video into a series of thumbnails, allowing you to navigate through the video via a thumbnail carousel. GitHub user realOxy offers an implementation of that for Compose UI.
Other Interesting Links
- 2023-09-12: Compose 1.5.1! Glance 1.0.0! Compose Multiplatform! Themes! Photos! Coachmarks! A bit of CommonsWare history! And @email@example.com tells us what not to do!
- 2023-09-05: Compose Compiler 1.5.3! Compose Multiplatform 1.5.0! @firstname.lastname@example.org on greyscaling composables! @email@example.com on Espresso testing with Compose interop! Scrollbars! AnnotatedString!
- 2023-08-29: Compose Compiler 1.5.2! Compose and Wear Compose alphas! Capture composables to bitmaps! Testing! Recomposition! Compose Multiplatform! And... Accompanist is downsizing?!?