Today, I want to show you how to create a very simple battery indicator in Garmin. I want to create a label that shows the current battery percentage which also changes colour depending on the percentage level.
So, I’ll start by creating a new label in the watch that I will use. This is my layout.xml:
Now, in the View.mc file I will use this label to add the battery percentage and assign a colour based on that percentage.
First, I will paste in my updateDisplayObject method to update the label text:
I will then create a method to update the battery label’s text colour based on the battery percentage. This will need to take in the battery percentage as a parameter:
From the above code, you can see I am assigning a specific color based on the batter percentage on a three tier system. The label colour will be based on the following rules:
|Greater than 75%||Green|
|Lower than 75% and higher than or equal to 25%||Yellow|
|Lower than 25%||Red|
I can now update the onUpdate method to use the above methods to show the battery indicator correctly. This is what the onUpdate method looks like:
After all that, you can see the watch face showing the correct three colours below: