Compose for Put on OS 1.1 is now steady: take a look at new options!

Posted by Kseniia Shumelchyk, Android Developer Relations Engineer

Immediately we’re releasing model 1.1 of Compose for Wear OS, our fashionable declarative UI toolkit to assist builders construct lovely, responsive apps for Put on OS.

Since the first stable release earlier this yr, we now have seen many builders benefiting from the highly effective instruments and intuitive APIs to make constructing their app less complicated and extra environment friendly. Todoist and Outdooractive are a number of the builders that rebuilt their Put on apps with Compose and accelerated the supply of a brand new, purposeful consumer expertise.

Todoist increased its growth rate by 50% since rebuilding their app for Put on 3 and Outdooractive reduced development time by 30% and noticed a big increase in developer productiveness and higher design/developer collaboration:

“Compose makes the UI code extra intuitive to put in writing and skim, permitting us to prototype quicker within the design section and in addition collaborate higher on the code. What would have taken us days now takes us hours.”

The Compose for Put on OS 1.1 launch comprises new options and brings enhancements to present parts, specializing in UX and accessibility. We’ve already up to date our samples, codelab, and Horologist libraries to work with Compose for Put on OS 1.1.

New options and APIs

The Compose for Put on OS 1.1 launch contains the next new performance (baseline profiles already added for brand spanking new parts):

Outlined type for Chips and Buttons

To provide you extra capacity to customise the consumer interface, we added outlined kinds for Chips and Buttons. New OutlinedChip and OutlinedButton composables present a clear element with a skinny border that can be utilized for medium-emphasis actions. Additionally out there for compact variations: OutlinedCompactChip and OutlinedCompactButton.
Demonstration of OutlinedChip and OutlinedButton composables on a round watch face
OutlinedChip and OutlinedButton composables

Modifying Chip and Button shapes

Ranging from model 1.1, you can even modify shapes for Chip/ToggleChip and Button/ToggleButton parts utilizing new features overloads.

Demonstration of Different Chip and Button shapes on a round watch face
Totally different Chip and Button shapes

Placeholder API

A brand new experimental API has been added to implement placeholder assist. This can be utilized to realize three distinct visible results individually or all collectively:

  • A placeholder background brush impact utilized in containers equivalent to Chip and Playing cards to attract over the traditional background when ready for content material to load.
  • A Modifier.placeholder() to attract a stadium formed placeholder widget excessive of content material that’s being loaded.
  • A Modifier.placeholderShimmer() for gradient/shimmer impact that’s drawn excessive of the opposite results to point to customers that the present state is ready for information to load.

These results are designed to be coordinated and shimmer and wipe-off in an orchestrated trend.

Moving demonstration of Placeholder API usage examples on a round watch face
Placeholder API utilization examples

Try the reference docs and sample in Horologist to see how you can apply the placeholder to frequent use circumstances, equivalent to a Chip with icon and a label that places placeholder over particular person content material slots and attracts a placeholder shimmer on prime whereas ready for information to load.


Horologist’s fadeAway modifier has been graduated to scrollAway modifier in model 1.1. Modifier.scrollAway scrolls an merchandise vertically out and in of view, based mostly on the scroll state, and already has overloads to work with Column, LazyColumn and ScalingLazyColumn.

Use this modifier to make TimeText fade out of the view because the consumer begins to scroll an inventory of things upwards.
Moving demonstration of ScrollAway modifier usage with TimeText on a round watch face
ScrollAway modifier utilization with TimeText

Further parameters in CurvedTextStyle

CurvedTextStyle now helps extra parameters (fontFamily, fontWeight, fontStyle, fontSynthesis) to specify font particulars when making a curved textual content type. Prolonged curved textual content type can be utilized on each curvedText and basicCurvedText.

Demonstration of applying different font to curved text on a round watch face
Making use of totally different font to curved textual content

UX and accessibility enhancements

The 1.1 launch additionally focuses on bringing a refined consumer expertise, enhancements for TalkBack assist and total higher accessibility:

  • ToggleChip and SplitToggleChip assist utilization of animated toggle controls (Checkbox, Swap and RadioButton) that can be utilized as an alternative of the static icons supplied by ToggleChipDefaults.
  • Default gradient colours for Chip/ToggleChip and Playing cards had been adjusted to match the most recent UX specification.
  • Up to date quite a few the default colours within the MaterialTheme to enhance accessibility as the unique colours didn’t have ample distinction.
  • Accessibility enhancements to Picker in order that multi-picker screens are navigable with display readers and the content material description is accessible.
  • InlineSlider and Stepper now have button roles, in order that TalkBack can acknowledge them as buttons.
  • The PositionIndicator in Scaffold is now positioned and sized in order that it solely takes the house wanted. That is helpful when semantic data is added to it, so TalkBack will get the right bounds of the PositionIndicator on display.

It’s time ⌚ to convey your app to the wrist!

Get began

To start creating with Compose for Put on OS, get began with hands-on expertise making an attempt our codelab, and ensure to take a look at the documentation and samples. Go to Compose for Wear OS release notes for full record of modifications out there in model 1.1.

Notice that utilizing model 1.1 of Compose for Put on OS requires utilizing the model 1.3 of androidx.compose libraries and subsequently Kotlin 1.7.10. Try the Compose to Kotlin Compatibility Map for extra data.

Present suggestions

Compose for Put on OS continues to evolve with the options you’ve been asking for. Please do proceed offering us suggestions on the issue tracker and be a part of Kotlin Slack #compose-wear channel to attach with the Google workforce and dev group.

We’re excited to see a rising variety of apps utilizing Compose for Put on OS in manufacturing, and we’re grateful for all points and requests that assist us to make the toolkit higher!

Begin constructing for Put on OS now

Uncover much more with technical sessions from the Android Dev Summit offering steerage on app structure, testing, dealing with rotary enter, and verticalized classes for media and health.

Recent Articles

Childcare Centre: How to Find an Affordable but Quality Centre

Finding a childcare centre in Adelaide is a journey that requires careful research, assessment, and decision-making. When the time comes to entrust your child to...

Remedial Massage Adelaide: Understanding Remedial Massage – Techniques and Benefits Explained

Remedial massage offers an effective and holistic treatment for various physical and emotional conditions. A remedial massage in Adelaide is a therapeutic method in Adelaide...

Removalists Adelaide Piano Removalists

Moving Companies must establish their brand, get the word out about themselves and develop an attractive pricing structure for themselves in order to compete...

Transform Your Outdoor Space with Stunning Tile Ideas

Adding tile to your outdoor space is a great way to give it beauty, colour, and texture. Are you looking to give your outdoor space...

Plumber Elizabeth Hot Water Systems

Hot water systems are essential components of your Elizabeth home and should be regularly serviced by a certified plumber to prevent running out of...

Related Stories

Leave A Reply

Please enter your comment!
Please enter your name here

Stay on op - Ge the daily news in your inbox