jetc.dev Newsletter Issue #145
The December 2022 BOM contains some patches, and we also got a new alpha besides!
Beyond that, this week we look at ribbons, new project templates, and cross-platform Compose UI. We look at a grid container and speech bubbles. Plus, we spend time talking about editing live electric eels and flamingos. Or something like that.
Ooooo… What Did We Get?
Reviewing the release notes for the latest Jetpack Compose update!
The Compose BOM is up to
androidx.compose:compose-bom:2022.12.00, to pull
in the latest patch releases. This includes some security
fixes, so it’s a good idea to update.
We also have
1.4.0-alpha03, which brings us a bunch of bug fixes, plus:
Better Perfetto support, including
VerticalPager()composables, presumably adapted from Accompanist
One Off the Stack, One Off the Slack
You’ve got questions. That’s understandable!
How Can We Render a Diagonal Ribbon?
A diagonal ribbon in the corner of some UI element is a common form of badge or banner, adding some note (“New!”, “Updated!”, “Free!” etc.) without disturbing the core of the UI element. See how to create a modifier to add such a ribbon in this week’s highlighted Stack Overflow question!
Is Passing Serializable Navigation Parameters OK?
The general rule is to pass identifiers that can be resolved into model objects
via some sort of repository layer. Some developers push back on this, arguing that
they do not have identifiers to use. That indicates a data structure problem,
not a Navigation for Compose problem, as we see in this week’s highlighted
#compose Slack thread.
Posts, videos, and other new information related to Jetpack Compose!
Medium: Introducing the Architecture Templates
Google’s Jose Alcérreca announced the inaugural release of Google’s Android Architecture Starter Templates. Compared to Android Studio templates, these will be updated more frequently and will be more extensive, albeit somewhat more difficult to use.
Video: Live Edit Jetpack Compose
The Code with the Italians team had Google’s Alan Leung and Leland Richardson over to explore Live Edit capability in the Electric Eel and Flamingo editions of Android Studio. Electric Eel lets you update literals without redeploying your debug build of the app, while Flamingo extends that to more aspects of composables.
Medium: UI tests with Jetpack Compose and Appium x UIAutomator
Julien Salvi returns, this time looking at using Appium and UIAutomator to verify
that a composable edition of a screen works the same as the previous
implementation. This involves ensuring that the composables expose the same identifiers
as the views used, so the test can be adapted to test composables with minimal changes.
Compose TwoPaneLayout updates
Kristen Halper reviews some recent changes to Microsoft’s
composable, which helps developers deal with larger screen sizes, including
foldables. In particular,
TwoPaneLayout() now offers independent back stacks
per pane, leveraging Jetpack Navigation for Compose.
Medium: AutoSizing TextField in Jetpack compose
Radhika S is back, this time looking at applying auto-sizing of fonts in a text field to ensure that three lines of text are always visible, at the cost of ever-shrinking font sizes.
Using Compose Across Platforms
Júlia Jakubcová examines the state of cross-platform Compose UI: Android, iOS, desktop, and Web. Júlia provides brief overviews of setting up projects to support those platforms, how stable Compose UI is for the platforms, and more.
Other Interesting Links
- Medium: Dark Theme in Jetpack Compose with Material 3
- Implementing a circular carousel in Jetpack Compose
- Medium: Navigation Bar & Bottom App Bar in Jetpack Compose with Material 3
- Beautiful LazyList(RecyclerView) Parallax Scrolling
- Medium: Modifier Extensions for Jetpack Compose
- Medium: App Bar and Navigation Drawer in Jetpack Compose
- Medium: Injecting SavedStateHandle into ViewModel using Dagger 2 and Jetpack Compose
- Medium: Jetpack Compose Visual Transformations Recipes
- Medium: Tabs (TabLayout) in Jetpack Compose
- Medium: Jetpack Compose Smart Padding
- Medium: Bottom Sheet in Jetpack Compose
- Medium: Jetpack Compose & best practices you must always remember
- Jetpack Compose BasicTextField (with Examples)
- Medium: Navigation with Arguments in Jetpack Compose
- Medium: Compose Navigation: Passing Objects
- Medium: Introduction to Jetpack Compose
100% pure code!
GitHub: MathRoda / Snackie
GitHub user MathRoda brings us a series of snackbar composables that are not
as tightly tied to structures like
Scaffold() and offer solid customizability.
GitHub: touchlane / gridpad-android
The Touchlane team created a
GridPad() composable, implementing a non-lazy
grid layout. You provide the row and column count, plus the content, and
GitHub: jayasuryat / mendable
Jaya Surya Thotapalli created a tool to convert Compose compiler metrics into HTML reports, focusing on those that need your attention, using color-coding to help point out the reported problems. Mendable also works will multi-module projects, combining the results from all the modules where your composables reside.
GitHub: SmartToolFactory / Compose-Speech-Bubble
The Smart Tool Factory team is back, this time with a
drawBubbleWithShape() modifiers to convert a
Box() into a speech bubble.
Other Interesting Links
- GitHub: alexstyl / Jetpack-Compose-Desktop-Themes (Compose for Desktop themes)
- GitHub: cometj03 / ComposeTimeTable (schedule grid)
- GitHub: MaximillianLeonov / BlurImage (applying a blur to an image)
- Gist: shakir915 / DatePicker.kt (single-month date picker)
- GitHub: KlassenKonstantin / ComposePhysicsLayout (dyn4j wrapper)
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! @firstname.lastname@example.org 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!