jetc.dev Newsletter Issue #38
It’s Navigation for Compose week!
Navigation for Compose is out, and we look at some of the initial stumbling blocks
when trying to use it. Beyond that, we see touch-based drawing in 50 lines of Compose,
@Preview annotation parameters for customization, and look at some
custom modifiers. Plus, there is an 11-hour marathon live coding video… in costume.
One Off the Stack, One Off the Slack
You’ve got questions. That’s understandable!
navigation-compose library exposes some of its API in the form
of extension functions.
navigate() — your primary way of navigating to
another composable — is one. So, you need to remember to
import that, as we
see in this week’s highlighted Stack Overflow question.
Navigation for Compose is slick, but it poses some fairly stringent limitations on
your argument types. Notably,
Parcelable is not an option. That can catch the unwary,
as we see in this week’s highlighted Slack thread.
Posts, videos, and other new information related to Jetpack Compose!
Ben Trengrove wasted no time in trying out the
navigation-compose library and using
official Jetpack Navigation for navigating between screens from a
This blog post provides a brief outline of Ben’s experiments.
Elye returns with a simple “fingerpaint”-style drawing app, letting the user sketch something.
It only takes around 50 lines of Compose UI code to track the
MotionEvents and update
Path object that gets rendered on a
Canvas() to draw where the user’s finger traced.
Joe Birch reviewed the
@Preview annotation, in particular examining many of the
annotation properties that you can use to customize how the preview looks and
what sort of environment is used for the simulation.
Ryan Kay held an 11-hour livestream of a coding session to write a “day planner” sort of personal organizer app. And, since this was recorded on Halloween, Ryan even was in costume (alas, not for all 11 hours).
100% pure code!
NotyKT is a note-taking app crated by Shreyas Patil. What makes the project interesting is that not only does it use Compose UI for the app, but it also has a server implementation in Kotlin (using Ktor) that the app uses for storage. As such, it provides a nice demonstration of using Kotlin on the client and on the server.
Aditya Wasan created a small
Modifier that randomly chooses a color and uses
that to render a border for your composable. While this modifier is not very
complicated, it helps to illustrate how simple creating a custom
Modifier can be.
…And One More Thing
Now that Jetpack Navigation for Compose is available, it is important for early adopters of Compose to “kick the tires” on it and see how well it works in your use cases.
While both Compose and Navigation for Compose are in early alpha releases, each has been around for a while independently. As a result, we already have experiences to draw upon for each of them. The question is how well those experiences mesh with one another.
In particular, Navigation for Compose uses a different Kotlin DSL for describing the destinations, and it uses a fourth system for passing arguments (somewhat independent from the classic arguments, SafeArgs, and original Kotlin DSL approaches to arguments). So, while elements of our existing Navigation experience will carry over to Navigation for Compose, some problems will be brand-new. And, there are going to be problems, simply because all of this is very new.
So, try it out, ask questions if you encounter problems, file issues if you have feature requests or reproducible bugs, and see how Navigation for Compose works for you. The sooner we can give Google actionable feedback, the sooner they can take that feedback into account in future releases.
Just remember to
navigate() extension function, and try to avoid
If you encounter problems in subscribing, let us know!
- 2021-01-19: alpha10 changes! Floating action menus! Charts! The Surface Duo! Input methods built with Compose! ...and ellipsizing text!
- 2021-01-12: layout()! Navigation with Parcelables! Custom drawers! Compose for Desktop! And Compose... for iOS?!?
- 2021-01-05: Navigation arguments! ViewModel? Shapes! GraphQL and Compose! More shimmers! In-browser Compose! And the power of names!