Watch face editor for Amazfit watch on ZeppOS

[SashaCX75]

Alternative watch face editor for Amazfit watch on ZeppOS.

Supported watch models

- Amazfit Active
- Amazfit Active 2
- Amazfit Active 2 (Square)
- Amazfit Active Edge
- Amazfit Active Max
- Amazfit Band 7
- Amazfit Balance
- Amazfit Balance 2
- Amazfit Bip 5
- Amazfit Bip 5 Unity
- Amazfit Bip 6
- Amazfit Cheetah
- Amazfit Cheetah Pro
- Amazfit Cheetah (Square)
- Amazfit Cheetah 2 Pro
- Amazfit Falcon
- Amazfit GTR 3
- Amazfit GTR 3 Pro
- Amazfit GTR 4
- Amazfit GTR mini
- Amazfit GTS 3
- Amazfit GTS 4
- Amazfit GTS 4 mini
- Amazfit T-Rex 2
- Amazfit T-Rex 3
- Amazfit T-Rex 3 Pro
- Amazfit T-Rex Ultra
- Amazfit T-Rex Ultra 2

When unpacking the watch faces, it is advisable to immediately select the correct watch model, otherwise the colors may be distorted.

It is desirable to create a new project in a separate folder. Image names do not have to consist only of numbers, you can add short prefixes (for example, date_01, time_01).
Watch faces created in the editor and on Huami's website should unpack normally. Watch faces from Zepp and those created based on them will not be unpacked.
In a set of images for displaying one parameter (for example, images for displaying the day of the week), all images should preferably be the same size. If the size of the images is different, then the first image in the set should be the largest.

All new features in this and next release will be tested on the GTR4 and may not work on other models.

List of changes

v17.1

Fixed the bugs that were found.
Added support for Cheetah 2 Pro.

v17.0

Added the ability to create a ZAB file for publication in the store (button in settings)
Added wind speed in km/h
Added atmospheric pressure in mm Hg
Added support for T-Rex Ultra 2.

v16.1

The ability to invert time circles has been added.
Active Max support has been added.
Image file name verification has been added.
The behavior of application shortcuts in editable elements has been fixed.

v16.0

Added sleep widget.
Added text widgets.

v15.1

Added support for new watch models.
Added BioCharge widget.
Added buttons to launch new applications.

v15.0

Time circles added.
Added world time (time, city, time zone, time offset).
Added text display around the circle.
Added the ability to create watch faces in developer mode (for experienced users, allows logs to be displayed in watch faces).

v14.0

Added support for widgets: ALARM_CLOCK, TRAINING_LOAD, VO2MAX, AQI, BODY_TEMP, FLOOR, READINESS, HRV.
Added support for Balance 2.
Changed the structure of the Preview.States file.
When creating an animated preview, frames with a switchable background have been added.
Added the ability to display the city name in uppercase letters in the weather forecast.
Added links to lessons.

v13.2

Added support for Bip 6.
Fixed the progress display using the image set for most widgets. It should now be more similar to how it is displayed on the watch.
Reworked the code for displaying heart rate with a circular scale. It now uses the standard widget in place of the sensor.
Fixed PAI progress display. Note that the maximum value for the PAI pointer is 525, not 100. This is a feature of the watch, not the editor.
Added warning if files in watch face are in *.bin format.

v13.1

Added ability to make a shortcut to any application in editable items.
Added support for Active 2.
Fixed display of buttons and shortcuts when creating a GIF file.

v13.0

Added autosave (enabled in settings).
Added ability to switch background image by tap.
Added ability to switch background colour by tap.

v12.1

Added transparency for some widgets. Does not work on all models.
Added support for Amazfit T-Rex 3.

v11.2

Fixing the smooth second hand on the GTR4.

v11.1

Updated the digital time widget.
Updated shortcuts widget.
Added new application launch commands for buttons.

v11.0

Completely redesigned the weather widget.
Added weather widget for several days (forecast).
Added support for Bip 5 Unity.

v10.4

Added ability to display month names in a font.
Added Compass widget (works on ZeppOS 2 or later).
Added ability to create *.zpk file (enabled in settings).

v10.3

Added display of hours:minutes:seconds in a single line font.
Added display of date/month/year in one line font (order depends on the watch setting).
Added display of the day of the week in font.
Added new presets for button functions.

v10.2

Added ability to copy widget properties (context menu on the properties field).

v10.1

Added display of time and date in font.
Added widget for adding scripts to watch face.
Fixed bugs in sunrise/sunset operation on circle and at an angle.
Fixed bugs in digital time alignment.

v10.0

]Added support of fonts for data display (after installing such watch faces it is better to restart the watch).
Added possibility to display altitude (in barometer).
Completely redesigned the moon widget.
The arrow pointer for sun and moon should now not be displayed after sunset.
All images are now copied to the watch face, even if they are in folders.

v9.1

Fixed working with Amazfit Balance.
Added support for Amazfit Active.
Added support for Amazfit Active Edge.
Fixed display of distance on a circle.
Fixed displaying sunrise and sunset at an angle.
Added ability to convert images to ARGB format in settings.
Fixed continuous vibration in notifications.

v9.0

Added ability to create shortcuts for a set of images (IMG_LEVEL).
Added support for buttons and presets to launch inbuilt apps.
Added support for Amazfit Balance (not tested).

v8.2

Added ability to display angled or circumferential data for sunrise/sunset, maximum and minimum temperatures (for weather, separate units of Celsius and Fahrenheit only work on newer models).
Added support for Cheetah / Cheetah Pro.
Added support for Bip 5.
Theoretically it is now possible to add support for new models by editing the file in the model_config folder.

v8.1

Added ability to display data at an angle or in a circle for date and time.
Fixed found errors when unpacking dials.
Fixed found errors when working with UHD monitors.

v8.0

Added support for T-Rex Ultra
Added support for GTR Mini
Added the ability to display data at an angle or in a circle (battery, steps, distance, calories, heart rate, PAI, SpO2, stand)

v7.3

Fixed problems with icons in editable items.
Fixed problems with circular progress in editable items.
Added ability to set data rotation angle for some models (ZeppOS 2).
Improved algorithm for unpacking dials that contain additional features. Increased probability of partial dial recognition.

v7.2

Added the ability to change the type of line ending for linear and circular progress.
Added the ability to create shortcuts without using an image.

v7.1

Added independent element with image and top image.
For editable items on the clock, an additional selection in the form of a list is included.
Changed the function of creating an editable element for fat burning.
Fixed motion animation and rotation animation for GTR4 and GTS4.
Added wind direction.
Updated watch face file format.

v7.0

Added smooth second hand (several types)
Added alert every hour
Added the ability to change the direction of rotation of the hour hands
Added the ability to set the sector in which the hour hands work

v6.4

Improved the stability of the bluetooth connection loss notification function
Updated German and Spanish translation

v6.3

Added the possibility of notifications when the connection is broken and restored
Fixed work progress for fat burning
Fixed work progress for the pulse
Fixed bugs in temperature display
Fixed display of shortcuts in AOD mode

v6.1

Added Falcon support.
Changed the algorithm of shortcuts to eliminate conflicts with editable elements.
The configuration of created watch faces has been updated to version 2.

v6.0

Added support for editable background.
Added support for editable arrows.
Added support for editable elements.
Added German translation.

v5.0

Added support for GTR 4
Added support for GTS 4 Mini
Added support for Amazfit Band 7 (not to be confused with Mi Band 7)

v4.1

Fixed bugs when creating and unpacking GTR 3 Pro watch faces

v4.0

Added animation support.
Added Ukrainian language.
Added a tab with some tips on working with the editor.
Added the ability to display the distance in miles.

v 3.0

Added sunrise / sunset
Added barometer
Added stress
Wind added
Added fat burning
Added moon phases

v 2.0

Added weather.
Added workout (stand).
Added oxygen (SpO2).
Added humidity.
Added UV index.
Added the ability to highlight shortcuts when saving gif files (enabled in the settings).
Updated the display of shortcuts in connection with the firmware update on the watch.
Added Italian language.
Added Spanish language.

v 1.1

Fixed loss of error symbol for pulse.
Fixed errors when unpacking dials.
Fixed bug with incorrect model definition for GTS 3.

Version 17.1
Fixed the bugs that were found.
Added support for Cheetah 2 Pro.

Old versions

v 10.0
v 10.1
v 10.2
v 10.3
v 10.4
v 11.0
v 11.1
v 11.2
v 12.1
v 13.0
v 13.1
v 13.2
v 14.1
v 15.0
v 15.1
v 16.0
v 16.1
v 17.0

PS. The interface was translated using an online translator. If someone wants to improve the translation, then write to the PM.

PS2. Many people ask how to install watch faces. For starters, I advise you to read this topic. Personally, I prefer to use this program to install the created watch faces on the GTR 3 (for the GTS 3)

Сollection of code examples for use in watch faces.

Donate to the author - PayPal: [email protected].
Buy me a coffee

[SashaCX75]

@Beartoe No

[Beartoe]

Hi Sasha, I have a question I've asked over on Zepp-OS discussion on Github. (That forum seems, um, pretty sleepy -- I've gotten no response.) I want to change a watchface element based not on a click, but on the value of system data, in this case AQI. I can put a widget up on my WF that has a type of "hmUI.data_type.AQI", but how do I return the actual value of AQI to a variable that I can use to control my display?

Is it just variableName = AQI? Or is this not possible? Also, since this would need to be refreshed, I assume it would go in the bottom part of the WF script.

[SashaCX75]

data_type.AQI should work
It is not possible to get the value and use it in the code
https://docs.zepp.com/docs/watchface/ap ... d/WEATHER/
Here you can see all the sensors from which you can get data at once.

[Beartoe]

Thanks, Sasha! So I understand can't make an "AQI sensor" for real-time data. Are there other ways to refresh the variable periodically, say once per hour?

[Emiliomc]

Hi Sasha. I have version 10.3 installed on my Windows 11 (recently updated). It works perfectly. But now I noticed that you have released new updates. I have installed the latest version (12.1) and when I unpack a watchface created with version 10.3 I get a "continue" or "exit" error. The png are loaded, but the preview of the watchface is not shown and the error window that I mentioned is displayed. What have I done or am I doing wrong?

[SashaCX75]

@Beartoe
There are always options. But it is unlikely that you will be satisfied with them.
You can put an application Notify for AQI and watch the data in it.
You can write such an application to share data with the watch face.
You can try to make a watch face that will receive data and site. But I am not sure that this is possible on watch faces.

[SashaCX75]

@Emiliomc Most likely the problem is with the watch face. Send me the watch face and I will check it.

[Emiliomc]

Thanks Sasha. I'll send it to you by private message. I have many spheres created with your application. I have tried this one that I will send you, which is very simple (minimalist). I created this one with version 10.3. It works perfectly on my GTS 4. It opens perfectly on your app version 10.3. But in version 12.1 that error window is shown, in addition to not showing the preview. I haven't uninstalled version 10.3 just in case. Since with version 10.3 I can continue creating spheres.

[taw_bip]

So I'm really trying to make a go of using the tool but I am having difficulty. With the older tool, I could see all the JSON coding and it was straightforward to edit the code.
With the newer tool, it seems you can't see the code until the watchface is packed. But is there a way to adjust the coding before packing?
I opened the following watchface and converted to T-Rex 2 format and did not see an easy way to modify other than selecting the prefabricated elements.
https://amazfitwatchfaces.com/balance/view/239
I don't see where or how to edit the code until the watchface is packed, then I can see the index.js file.
It would help if there was a basic tutorial to follow.
I think if I could follow a tutorial to get the basics down then I might have an easier time.

[SashaCX75]

@taw_bip
You can see the watch face code only after it is packed.

In the editor you can insert ready functions into the watch face code. There is a corresponding widget for this in the System section. But you will not see the results of this code in the editor. The correctness of the code is not checked in any way.

A watch face is a full-fledged JS application and that's why it's impossible to write one tutorial that can explain everything.

[taw_bip]

A watch face is a full-fledged JS application and that's why it's impossible to write one tutorial that can explain everything.

Thanks. I think because I have experience with the earlier version of the editor and older watches, I have difficulty adjusting to the new concepts of the latest editor. I see now that you're providing the building blocks. I just need to wrap my head around it because I was used to adjusting the code from the start.

[Guydu91]

Hello everyone,
I would like to know if there is a way to create a touch shortcut to Flow (with JavaScript I think...).
Thanks in advance for your answers.
Best regards from France.
Guy.

[SashaCX75]

@Guydu91
Most likely the link will vary depending on the model. For example, for Balance the link to the main page looks like this

Code: Select all

hmApp.startApp({ appid: 1038314, url: 'page/gtr/home/index.page'});

I haven't tested this, but it should open the Flow home page.

[Guydu91]

@Guydu91
Most likely the link will vary depending on the model. For example, for Balance the link to the main page looks like this

Code: Select all

hmApp.startApp({ appid: 1038314, url: 'page/gtr/home/index.page'});

I haven't tested this, but it should open the Flow home page.

OK Sasha,
Thanks for your quick reply.
I will test this on a future project and let you know the result.
Best regards.
Guy.

[Guydu91]

@Guydu91
Most likely the link will vary depending on the model. For example, for Balance the link to the main page looks like this

Code: Select all

hmApp.startApp({ appid: 1038314, url: 'page/gtr/home/index.page'});

I haven't tested this, but it should open the Flow home page.

OK Sasha,
Thanks for your quick reply.
I will test this on a future project and let you know the result.
Best regards.
Guy.

I installed this shortcut in a watchface for GTS4 (ZeppOS 3.5)... and it worked the first time.
Well done Sasha, you are a genius.
Thanks again for this wise advice.
Kind regards from France.
Guy.

[Guydu91]

Oops!
I got a little excited about the shortcut to Flow...
Actually, it only works once and then it blocks all the other shortcuts.
To reset it, you have to change the watchface and then go back to the initial watchface to make it work again... only once.
So, I think this JS is not quite adapted to the GTS4.
Maybe it's related to ZeppOS 3.5...
Any idea?
Thanks in advance.

[SashaCX75]

After launching any third-party application, the code in the watch faces stops working. Usually it is enough just to switch off the screen and after that the watch face starts working normally.

[Guydu91]

After launching any third-party application, the code in the watch faces stops working. Usually it is enough just to switch off the screen and after that the watch face starts working normally.

OK Sasha, thanks for your answer.
I did try this method but it's not very intuitive and I think most users will think it's a bug.
I prefer to put this feature aside for now until a simple method is available.
Best regards.
Guy.

[ZiMiZ]

I downloadad some watchfaces, but are .bin, how can i edit that?

[asoo]

I downloadad some watchfaces, but are .bin, how can i edit that?

if you mean .BIN for GTS
if you want to edit or modify you must use "AmazFit WatchFace editor for Windows by SashaCX75"
viewtopic.php?p=3789#p3789

[Emiliomc]

Is there a tutorial to create with the SashaCX75 weather widget for several days (forecast) application? I've been searching the forum, but can't find anything. I know how to create watchface with the application and I use almost all the tools, but I want to use this one and I don't know how to use it. I want to make a watchface that has the forecast for the five days following the current one. With maximum and minimum temperatures. Indicating the day of the week and the icon that corresponds to the weather condition that is forecast.

[Emiliomc]

Hi. I have a problem with a watchface. I have created thirteen png for the battery images. They are all the same size and are located correctly at the coordinates I have set. The first three images are a red circle and the next ten are transparent circles. They are named like this (the first three being red): B_00, B_01, B_02, B_03, ..., B_12. In the preview, when you put the battery at 30%, the third image is shown. That is to say; the B_02. Indicating that the battery is already at 30%. Well, on my GTS 4, when I reach 30% (or less than 30%), the red circle does not show. I have restarted the device after installation, but I still have the same problem. I don't know what I'm doing wrong. I don't have numeric values ​​or anything else in "Battery". Just the images.

[SashaCX75]

@Emiliomc
The algorithm of displaying images from the set changes in different firmware versions and on different models. Therefore, if you want the images to change exactly at certain charge values, you need to write your own code instead of using standard widgets.

You can also choose the necessary number of images for your model. But please note that in the standard widget at a small value of charge (about less than 5%) images may not be displayed at all.

[Emiliomc]

Thanks for responding. Honestly, I don't know how to do it with code. But in relation to the second proposal you make to me, I don't know if I understood you correctly. Do you mean that in my case, if instead of creating 13 png (3 png in color), I create 26 png (6 png in color) or even 39 png (9 png in color), I will have a better chance of working correctly with images?

[Emiliomc]

Please, can someone help me?