Figured Out How To Do Multicolored Progress Movements

I’ve seen watch faces with multicolored progress displays for battery and other things, never could figure out how to do one, until today. MAG 1432

Now that I have figured it out it was amazingly easy to do.

6 Likes

Good morning mratisocialguy !!!
For example, I use different images, with their different percentages …


And when my battery is low (minus 7%), I always use that blink, pulse or move. With different images…

Others, I imagine, that they must use with layers, covering the layers, rotating them with each other …

Your design is presentable and very cool as the function of the battery looks like … I like it a lot :wink: :+1: :+1:
Cordially !

2 Likes

Congratulations Sir, looks real cool :sunglasses:
I use different colours for different levels, but your multicolour looks better in my opinion :clap:

3 Likes

You could have asked, with mask its really easy :slight_smile:
Just kidding. I prefer the bar to gradually change colour from green trough yellow to red in relation to remaining power.

4 Likes

Same Battery Levels tastes as me Peter :grin:

1 Like

I’ve done that using three different colored progress bars with accompanying numbers and icons. But mine shifted color at a fixed battery level using opacity. I didn’t know you could slide colors like that in Facer. Unless you are coding to gradually fade each layer exposing the color below.

1 Like

I am gradually fading. Inspector is on.
-green over yellow from 100% at 100% to 0% opacity at 50% battery
-yellow over red from 100% at 50%battery to 0% at 0%.

2 Likes

I checked, but inspection isn’t turned on yet.

1 Like

I just have the Opacity set for the different colours at different levels -
Low Red colour, 0-25% - $#BLN#>=1&&#BLN#<25?70:0$
Medium Yellow, 25-50% - $#BLN#>=25&&#BLN#<=50?70:0$
Higher Green, 50% and above - $#BLN#>=50?70:0$
The 70 at the end is just the Opacity that I set so the image behind is still visible.

2 Likes

sorry I tried to update it twice, but still it cant enable it. dont know why

1 Like

On computer click on the “3 dots” button then click “Enable Inspection”. If that doesn’t work it’s an issue with the creator that only @Facer_Official can fix.

Capture

2 Likes

Ok, seems that worked :slight_smile: thanks

2 Likes

Neat trick! Never thought to try it that way, you learn every day :smiley:

2 Likes

Hi Mrantosocial how did you do the battery bars with the colour change?
They look really great and might try something like that in my next watch design aswell??

1 Like

If you go to the web page that the watch face is on, next to the face is a vertical row of links. If you click on the rocket ship link that will allow you to go inside the watch face and inspect it. That will show you exactly how the battery levels and everything else is done.

Hi was trying to see how you made your multicloured indicators but your inspection mode (rocket) is off.

You have to click the name of the watchface to open it in its own separate page.
Then the rocket will show on any of the examples from this thread.

1 Like

Yes, just as @petruuccios has said, Inspection Mode IS on, you just need to open the Watch Face in a new window -

2 Likes