Could use some feedback for first Watch Face.

Hey Community,

been lurking for a moment and thought I'd like to get some constructive feedback on my first Watch Face. I come from a JS/TypeScript background and really wanna wrap my head around the intricacies of Monkey C and Garmin.

Repo on GitHub

I'm creating a Watch Face for my running club - should be very simple for now, but there's a couple of things I'd like to talk about:

  • In general: Is there anything particularly _wrong_ that you can spot?
  • I'm targeting the Forerunner Series. I scaled the logo to 200px width, so it should fit on every watch. Am I right that there's now way to scale it according to the available display width?
  • I'm using the Logo in a layout - does that mean it only gets drawn once in onLayout() and I don't need to worry about expensive re-drawings?
  • It seems like the Watch Face drains my battery very fast and I wonder if that also has to do with all the trigonometric functions I'm using to draw the little arrows?
  • So far I couldn't find out how to learn more about power consumption, render times, etc in the ConnectIQ sim, could anyone point me in the right direction?
  • Next I want to include a little Menu/Options to turn on the arrow clock vs numeric one. Where would I look first to do that?

Thank you so much in advance,

Kevin

  • The logo dimensions differ on almost all devices. IMHO you don't need to scale it, when you build for any device you'll see the "warning" in the console that it's being automatically resized. I usually make it big enough for the biggest size needed, so at least all are being down-sized and not up.

    Nothing is drawn in onLayout, only in onUpdate. in onLayout you have the dc so you can do heavy calculations and save the results and use the pre-calculated values in onUpdate.

    You can use the profiler to see which part of the code runs for the most time, that usually indicates also which part of the code is bad for the battery. When I started to read your post my 1st thought was: why don't you find something ready? The time to make something new good enough for others (especially if this is your first CIQ app) could've maybe be invested better. My second thought was: for sure the battery will drain fast. My 3rd thought was: if it's a running group then why watchface and not a datafield?

    You can find the profiler in the simulator: File > View Profiler . Do as little in onUpdate as possible. Also learn about onPartialUpdate, though not sure if that matters a lot in forerunners.

    About app settings: developer.garmin.com/.../

    About on-device settings/menu: https://developer.garmin.com/connect-iq/core-topics/native-controls/

  • thanks for your input!

    when talking about the logo, i'm talking about a png, not the loading-triangle thing. but does your comment still apply? then i'd try to just leave it bigger.

    found the profiler and will have a look into it - i was thrown of by it only showing data once stopped and not "in real time" i guess.

    And regarding the project itself: well, i like a good challenge. and i code 30 hours a week so i'm pretty confident i'll get the hang of it pretty quick. The idea would be for my running group to be able to download the watch face and have it display our logo - that's about it. just for fun.

  • I'm targeting the Forerunner Series. I scaled the logo to 200px width, so it should fit on every watch. Am I right that there's now way to scale it according to the available display width?

    I assume you're using a bitmap and not just the launcher icon.

    You can have the compiler scale it for the screen size by doing something like this:

    <bitmap id="x" filename="test.png" scaleRelativeTo="screen" scaleX="100%" scaleY="100%"></bitmap>

    where this will make it 100%x100% regardless of the screen dimensions.  For example, a fr965 is 454x454 so you may want something larger than 200px

  • I was talking about the launcherIcon. 

    Ah I see now that there's another logo. I see you have it 50%. I hope that that's only done once... It's a good question, and I don't no neither the answer nor how to check it (maybe the profiler by down-sizing a huge image to some small one, and then compare it when you resize the image offline and the layout doesn't need to resize it)

  • this is really cool, i managed to get it to work:
    by omiting the scaleY, it keeps the ratio. now it's always 90% of the displayWidth

    <bitmap id="IpLogo" filename="../drawables/ip-logo.png" x="center" y="center" scaleRelativeTo="screen" scaleX="90%" />