Posted by Garan Jenkin – Developer Relations Engineer
Put on OS has a thriving watch face ecosystem that includes quite a lot of designs that additionally goals to attenuate battery affect. Builders have embraced the simplicity of making watch faces utilizing Watch Face Format – within the final 12 months, the variety of printed watch faces utilizing Watch Face Format has grown by over 180%*.
Right now, we’re persevering with our funding and asserting model 4 of the Watch Face Format, out there as a part of Put on OS 6. These updates permit builders to precise even larger ranges of creativity via the brand new options we’ve added. And we’re supporting marketplaces, which supplies flexibility and management to builders and extra selection for customers.
On this weblog put up we’ll cowl key new options, take a look at the documentation for extra particulars of modifications launched in latest variations.
Supporting marketplaces with Watch Face Push
We’re additionally asserting a very new API, the Watch Face Push API, aimed toward builders who need to create their very own watch face marketplaces.
Watch Face Push, out there on units operating Put on OS 6 and above, works solely with watch faces that use the Watch Face Format watch faces.
We’ve partnered with well-known watch face builders – together with Facer, TIMEFLIK, WatchMaker, Pujie, and Recreative – in designing this new API. We’re excited that every one of those builders might be bringing their distinctive watch face experiences to Put on OS 6 utilizing Watch Face Push.
Watch faces managed and deployed utilizing Watch Face Push are all written utilizing Watch Face Format. Builders publish these watch faces in the identical method as publishing via Google Play, although there are some further checks the developer should make that are described within the Watch Face Push steering.
The Watch Face Push API covers solely the watch a part of this typical market system diagram – because the app developer, you might have management and duty for the cellphone app and cloud elements, in addition to for constructing the Put on OS app utilizing Watch Face Push. You’re additionally answerable for the phone-watch communications, for which we advocate utilizing the Knowledge Layer APIs.
Including Watch Face Push to your undertaking
To begin utilizing Watch Face Push on Put on OS 6, embody the next dependency in your Put on OS app:
// Guarantee newest model is utilized by checking the repository implementation("androidx.put on.watchface:watchface-push:1.3.0-alpha07")
Declare the required permission in your AndroidManifest.xml:
"com.google.put on.permission.PUSH_WATCH_FACES" />
Receive a Watch Face Push consumer:
val supervisor = WatchFacePushManagerFactory.createWatchFacePushManager(context)
You’re now prepared to begin utilizing the Watch Face Push API, for instance to record the watch faces you might have already put in, or add a brand new watch face:
// Record present watch faces, put in by this app val listResponse = supervisor.listWatchFaces() // Add a watch face supervisor.addWatchFace(watchFaceFileDescriptor, validationToken)
Understanding Watch Face Push
Whereas the fundamentals of the Watch Face Push API are simple to know and entry via the WatchFacePushManager interface, it’s vital to think about a number of different elements when working with the API in observe to construct an efficient market app, together with:
- Setting energetic watch faces – By means of a further permission, the app can set the energetic watch face. Find out about the way to combine this function, in addition to the way to deal with the totally different permission situations.
To study extra about utilizing Watch Face Push, see the steering and reference documentation.
Updates to Watch Face Format
Photographs
Accessible from Watch Face Format v4
The brand new Photographs aspect permits the watch face to include user-selectable photographs. The aspect helps each particular person photographs and a gallery of photographs. For a gallery of photographs, builders can select whether or not the photographs advance mechanically or when the consumer faucets the watch face.
The consumer is ready to choose the photographs of their selection via the companion app, making this an effective way to incorporate true personalization in your watch face. To make use of this function, first add the required configuration:
"myPhoto" configType="SINGLE"/>
Then use the Photographs aspect inside any PartImage, in the identical method as you’d for an Picture aspect:
"[CONFIGURATION.myPhoto]" defaultImageResource="placeholder_photo"/>
For particulars on the way to help a number of photographs, and the way to configure the totally different change behaviors, consult with the Photographs part of the steering and reference, in addition to the GitHub samples.
Transitions
Accessible from Watch Face Format v4
Watch Face Format now helps transitions when exiting and coming into ambient mode.
That is achieved via the prevailing Variant tag. For instance, the hours and minutes within the above watch face are animated as follows:
"AMBIENT" goal="x" worth="100" interpolation="OVERSHOOT" />
By default, the animation takes the total extent of allowed time for the transition. The brand new interpolation attribute controls the animation impact – on this case the usage of OVERSHOOT provides a playful expertise.
The seconds are carried out in a separate DigitalClock aspect, which reveals the usage of the brand new period attribute:
"AMBIENT" goal="alpha" worth="0" period="0.5"/>
The period attribute takes a price between 0.0 and 1.0, with 1.0 representing the total extent of the allowed time. On this instance, by utilizing a price of 0.5, the seconds animation is faster – taking half the allowed time, compared to the hours and minutes, which take your entire transition interval.
For extra particulars on utilizing transitions, see the steering documentation, in addition to the reference documentation for Variant.
Shade Transforms
Accessible from Watch Face Format v4
We’ve prolonged the usefulness of the Remodel aspect by permitting coloration to be reworked on the vast majority of components the place it’s an attribute, and likewise permitting tintColor to be reworked on Group and Half* components comparable to PartDraw and PartText.
The primary exceptions to this addition are the clock components, DigitalClock and AnalogClock, and likewise ComplicationSlot, which don’t presently help Remodel.
Along with extending the record of transformable attributes to incorporate colours, we’ve additionally added a handful of helpful capabilities for manipulating coloration:
To see these in motion, let’s take into account an instance.
The Climate knowledge supply supplies the present UV index via [WEATHER.UV_INDEX]. When representing the UV index, these values are sometimes additionally assigned a coloration:
We need to characterize this data as an Arc, not solely displaying the worth, but additionally utilizing the suitable coloration. We will obtain this as follows:
"0" centerY="0" top="420" width="420" startAngle="165" endAngle="165" path="COUNTER_CLOCKWISE"> "endAngle" worth="165 - 40 * (clamp(11, 0.0, 11.0) / 11.0)" /> "20" coloration="#ffffff" cap="ROUND"> "coloration" worth="extractColorFromWeightedColors(#97d700 #FCE300 #ff8200 #f65058 #9461c9, 3 3 2 3 1, false, clamp([WEATHER.UV_INDEX] + 0.5, 0.0, 12.0) / 12.0)" />
Let’s break this down:
- The primary Remodel restricts the UV index to the vary 0.0 to 11.0 and adjusts the sweep of the Arc in keeping with that worth.
- The second Remodel makes use of the brand new extractColorFromWeightedColors operate.
- The first argument is our record of colours
- The second argument is an inventory of weights – you’ll be able to see from the chart above that inexperienced covers 3 values, whereas orange solely covers 2, so we use weights to characterize this.
- The third argument is whether or not or to not interpolate the colour values. On this case we need to stick strictly to the colour conference for UV index, so that is false.
- Lastly within the fourth argument we coerce the UV worth into the vary 0.0 to 1.0, which is used as an index into our weighted colours.
The consequence seems to be like this:
In addition to having the ability to present uncooked colours and weights to those capabilities, they can be used with values from issues, comparable to HR, temperature or steps objective. For instance, to make use of the colour vary laid out in a objective complication:
"coloration" worth="extractColorFromColors( [COMPLICATION.GOAL_PROGRESS_COLORS], [COMPLICATION.GOAL_PROGRESS_COLOR_INTERPOLATE], [COMPLICATION.GOAL_PROGRESS_VALUE] / [COMPLICATION.GOAL_PROGRESS_TARGET_VALUE] )"/>
Introducing the Reference aspect
Accessible from Watch Face Format v4
The brand new Reference aspect permits you to consult with any transformable attribute from one a part of your watch face scene in different components of the scene tree.
In our UV index instance above, we’d additionally just like the textual content labels to make use of the identical coloration scheme.
We may carry out the identical coloration remodel calculation as on our Arc, utilizing [WEATHER.UV_INDEX], however that is duplicative work which may result in inconsistencies, for instance if we modify the precise coloration hues in a single place however not the opposite.
Returning to the Arc definition, let’s create a Reference to the colour:
"0" centerY="0" top="420" width="420" startAngle="165" endAngle="165" path="COUNTER_CLOCKWISE"> "endAngle" worth="165 - 40 * (clamp(11, 0.0, 11.0) / 11.0)" /> "20" coloration="#ffffff" cap="ROUND"> "coloration" identify="uv_color" defaultValue="#ffffff" /> "coloration" worth="extractColorFromWeightedColors(#97d700 #FCE300 #ff8200 #f65058 #9461c9, 3 3 2 3 1, false, clamp([WEATHER.UV_INDEX] + 0.5, 0.0, 12.0) / 12.0)" />
The colour of the Arc is calculated from the comparatively complicated extractColorFromWeightedColors operate. To keep away from repeating this elsewhere in our watch face, we now have added a Reference aspect, which takes as its supply the Stroke coloration.
Let’s now take a look at how we will devour this worth in a PartText elsewhere within the watch face. We gave the Reference the identify uv_color, so we will merely consult with this in any expression:
"0" y="225" width="450" top="225"> "225" centerY="0" width="420" top="420" startAngle="120" endAngle="90" align="START" path="COUNTER_CLOCKWISE"> "SYNC_TO_DEVICE" measurement="24"> "coloration" worth="[REFERENCE.uv_color]" /> %d "[WEATHER.UV_INDEX]" />
Consequently, the colour of the Arc and the UV numeric worth at the moment are coordinated:
For extra particulars on the way to use the Reference aspect, consult with the Reference steering.
Textual content autosizing
Accessible from Watch Face Format v3
Generally the precise size of the textual content to be proven on the watch face can fluctuate, and as a developer you need to steadiness having the ability to show textual content that’s each legible, but additionally full.
Auto-sizing textual content can assist clear up this downside, and may be enabled via the isAutoSize attribute launched to the Textual content aspect:
"CENTER" isAutoSize="true">
Having set this attribute, textual content will then mechanically match the out there house, beginning on the most measurement laid out in your Font aspect, and with a minimal measurement of 12.
For example, step rely may vary from tens or a whole bunch via to many hundreds, and the brand new isAutoSize attribute permits finest use of the out there house for each attainable worth:
For extra particulars on isAutoSize, see the Textual content reference.
Android Studio help
For builders working in Android Studio, we’ve added help to make working with Watch Face Format simpler, together with:
- Run configuration help
- Auto-complete and useful resource reference
- Lint checking
That is out there from Android Studio Canary model 2025.1.1 Canary 10.
Study Extra
To study extra about constructing watch faces, please check out the next assets:
We’ve additionally lately launched a codelab for Watch Face Format and have up to date samples on GitHub to showcase new options. The subject tracker is accessible for offering suggestions.
We’re excited to see the watch face experiences that you simply create and share!
Discover this announcement and all Google I/O 2025 updates on io.google beginning Might 22.
* Google Play knowledge for interval 2024-03-24 to 2025-03-23
