Posted by Kseniia Shumelchyk, Android Developer Relations Engineer
Today we’re launching version 1.0 of Compose for Wear OS, the first stable release of our modern declarative UI toolkit designed to help developers create beautiful, responsive apps for Google’s smartwatch platform.
Compose for Wear OS was built from the bottom up in Kotlin with assumptions of modern app architecture. It makes building apps for Wear OS easier, faster, and more intuitive by following the declarative approach and offering powerful Kotlin syntax.
The toolkit not only simplifies UI development, but also provides a rich set of UI components optimized for the watch experience with built-in support of Material design for Wear OS, and it’s accompanied by many powerful tools in Android Studio to streamline UI iteration.
What this means
The Compose for Wear OS 1.0 release means that the API is stable and has what you need to build production-ready apps. Moving forward, Compose for Wear OS is our recommended approach for building user interfaces for Wear OS apps.
Your feedback has helped shape the development of Compose for Wear OS; our developer community has been with us each step of the way, engaging with us on Slack and providing feedback on the APIs, components, and tooling. As we are working on bringing new features to future versions of Compose for Wear OS, we will continue to welcome developer feedback and suggestions.
We are also excited to share how developers have already adopted Compose in their Wear OS apps and what they like about it.
What developers are saying
Todoist helps people organize, plan and collaborate on projects. They are one of the first companies to completely rebuild their Wear OS app using Compose and redesign all screens and interactions:
“When the new Wear design language and Compose for Wear OS were announced, we were thrilled. It gave us new motivation and opportunity to invest into the platform.”
Todoist applicationRelying on Compose for Wear OS has improved both developer and user experience for Todoist:
Outdooractive helps people plan routes for hiking, cycling, running, and other outdoor adventures. As wearables are a key aspect of their product strategy, they have been quick to update their offering with an app for the user’s wrist.
“Huge improvement is how lists are created. Thanks to ScalingLazyColumn it is easier (compared to RecyclerView) to create scrolling screens without wasting resources. Availability of standard components like Chip helps saving time by being able to use pre-fabricated design-/view-components. What would have taken us days now takes us hours.”
The Outdooractive team also highlighted that Compose for Wear OS usage help them to strive for better app quality:
“Improved animations were a nice surprise, allowing smoothly hiding/revealing components by just wrapping components in “AnimatedVisibility” for example, which we used in places where we would normally not have invested any time in implementing animations.”
Another developer we’ve been working with, Period Tracker helps keep track of period cycles, ovulation, and the chance of conception.
Similarly to other developers, Period Tracker noted that Compose for Wear OS helped them to achieve better developer experience and improved collaboration with design and development teams:
“For example, before Chips components were available, we had to use a custom way to load images on buttons which caused a lot of adaptation work. Yes, Compose for Wear OS improved our productivity and made our designers more willing to design a better user experience on wearables.”
Check out the in-depth case studies to learn more about how other developers are using Jetpack Compose.
1.0 release
Let’s look into the key features available with 1.0 release:
Material: The Compose Material catalog for Wear OS already offers more components than are available with View-based layouts. The components follow material styling and also implement material theming, which allows you to customize the design for your brand.
Declarative: Compose for Wear OS leverages Modern Android Development and works seamlessly with other Jetpack libraries. Compose-based UIs in most cases result in less code and accelerate the development process as a whole, read more.
Interoperable: If you have an existing Wear OS app with a large View-based codebase, it’s possible to gradually adopt Compose for Wear OS by using the Compose Interoperability APIs rather than having to rewrite the whole codebase.
Handles different watch shapes: Compose for Wear OS extends the foundation of Compose, adding a DSL for all curved elements to make it easy to develop for all Wear OS device shapes: round, square, or rectangular with minimal code.
Performance: Each Compose for Wear OS library ships with its own baseline profiles that are automatically merged and distributed with your app’s APK and are compiled ahead of time on device. In most cases, this achieves app performance for production builds that is on-par with View-based apps. However, it’s important to know how to configure, develop, and test your app’s performance for the best results. Learn more.
Note that using version 1.0 of Compose for Wear OS requires using the version 1.2 of androidx.compose libraries and therefore Kotlin 1.7.0. Read more about Jetpack Compose 1.2 release here.
Tools and libraries
Android Studio
The declarative paradigm shift also alters the development workflow. The Compose tooling available in Android Studio will help you build apps more productively.
Android Studio Dolphin includes a new project template with Compose for Wear OS to help you get started.
The Composable Preview annotation allows you to instantly verify how your app’s layout behaves on different watch shapes and sizes. You can configure the device preview to show different Wear OS device types (round, rectangle, etc):
import androidx.compose.ui.tooling.preview
@Preview(
device = Devices.WEAR_OS_LARGE_ROUND,
showSystemUi = true,
backgroundColor = 0xff000000,
showBackground = true
)
@Composable
fun PreviewCustomComposable() {
CustomComposable(…)
}
Starting with Android Studio Electric Eel, Live Edit supports iterative code development for Wear OS, providing quick feedback as you make changes in the editor and immediately reflecting UI in the Preview or running app on the device.
Horologist
Horologist is a group of open-source libraries from Google that supplement Wear OS development, which we announced with the beta release of Compose for Wear OS. Horologist has graduated a number of experimental APIs to stable including TimeText fadeAway modifiers, WearNavScaffold, the Date and Time pickers.
Learning Compose
If you are unfamiliar with using Jetpack Compose, we recommend starting with the tutorial. Many of the development principles there also apply to Compose for Wear OS.
To learn more about Compose for Wear OS check out:
Compose for Wear OS codelab for hands-on experience
Documentation for a quick start guide and implementation guidance
Learning pathway for a step-by-step journey
Wear OS samples repository on GitHub.
Now that Compose for Wear OS has reached its first stable release, it’s time to create beautiful apps built for the wrist with Compose!
Join the community
Join the discussion in the Kotlin Slack #compose-wear channel to connect with the team and other developers and share what you’re building.
Provide feedback
Please keep providing us feedback on the issue tracker and let us know your experience!
For more information about building apps for Wear OS, check out the developer site.
