Conditionals for battery levels not showing on watch

I recently started designing watchfaces, so the use of conditionals and expressions is still new to me. As such I could use some help with this watchface I’m designing in regards to using shapes as indicators of the battery levels for my phone and watch.

I recently discovered this response to another designer’s query. After applying his conditionals and expressions to my watchface (with a few tweaks) and syncing it to my watch, the shapes utilizing those conditionals and expressions do not appear at all.

This is what I should see:

This is what I actually see:

You may notice in this second picture that there is an additional gray line where the watch battery level should be showing. This is because I added two additional shapes, one of which is a gray stroke and the other is a white fill. These two shapes were placed between the phone battery shapes and the watch battery shapes so that the fills for said shapes do not overlap each other if I choose to modify their transparencies later on.

So my questions are thus:

  1. How do I get the shapes with the conditionals and expressions to show up on my watch?
  2. How do I get @gunr2171’s suggestion for each shape’s height to work?
    One of the tweaks I made was eliminating his conditional for height as I could not get it to work with the height I desire.
  3. Is there a better way of doing this that I’m not aware of?

Any help is greatly appreciated! Thanks in advance!

I haven’t got time to look into the code, but something I did notice when I loaded up the web editor was how slow everything functioned. You’ve got a lot of elements on your watch face. I’m not sure if that would have anything to do with the missing elements when it gets to the physical device.

And yes, I loaded the watch face up on my LG G Watch R and also had the same missing elements you describe.

@gunr2171 Thanks for your thoughts. I created a simplified version of the watchface containing only 5 elements, and I’m still missing the shape elements.

Ah, I think I found the problem.

I went back and upgraded my color example that you used originally (here). This is something I knew worked in the past, both on the watch and the web designer. It was set up for PBP - the watch’s battery level, so I included the phone’s battery as well.

For all of these images, Rightclick > View Image … to see the full size.

Those numbers below are for debugging - it shows the computation of the ternary operator function. It’s going to essentially boil down to 100 or 0 for the 4 items.

As we’ve both seen, this works as expected in the web designer. So, let’s go to the phone:

First up, the “My Designs” screen.

I know, I know, I’ll charge my phone soon…

All looks good here, except I have a sneaking suspicion that this is a pre-generated image of the watch face. It would be CPU suicide to render the thumbnail when you go to look at it, or even at all on the client.

Part one of the “good stuff” is when I select the item.

Color boxes are gone, and look at those text boxes underneath. It seems that the engine is not properly recognizing the text as an expression. It got the tags right, but stopped there.

And of course, $36%>=50p?100:0$ is not a valid number between 0 and 100, it’s just a bunch of text.

This is the same result when synced with the watch.

From what I can see, the wiki section on conditionals hasn’t changed. So yeah, @Facer_Official, I think we found a bug.

Oh, and just for completeness sake:

  • Web creator
  • Nexus 5 - Cyananogenmod 13 2016-09-14
  • Android Wear
  • Facer 2.5.2_1013
  • LG G Watch R

@gunr2171 Thank you for confirming the issue isn’t just me! Your visuals are perfect, and I’m sure @Facer_Official is very appreciative of them!

To hopefully further help with troubleshooting, here’s my info:

  • Web creator (unknown)
  • Nexus 6, Android 6.0.1
  • Android Wear
  • Facer 2.5.2_1013-(1013)
  • Sony SmartWatch 3

Thanks a bunch, all! Our QA team is going to investigate using all the info you shared and we’ll tackle that bug ASAP once it’s confirmed!

1 Like

Hey @gunr2171 and @sapph1retw1n,

We looked at your problem and there are some inconsistencies currently in the platform that cause this. The conditional statement;


Is actually not meant to work. #PBP# is outputting text, so trying to compose a conditional function on it will fail. I won’t get into why it works on the web, but we’re sorry about the inconsistency.

Here is a fix:

We provide a tag called #PBN# which actually provides the percentage in a number format. The function:


will work on the web and on your phone. Please note that the ‘p’ after 50 is not necessary.

I hope this solves your problem! And once again, we’re sorry about the confusing inconsistency.

1 Like

Awesome. I sort of figured that was the case.

I modified my color test and now the numbers work on the physical watch.

I’ve still got a problem with the heights - those are now (INT * 100) rather than (% * 100), so the calculation is off, but I can fix that later.

Thanks for the help!