MovementBar in Watchface (FR235)

Former Member
Former Member
Hello,

I try to make a new Watchface for my FR235. I've got the data I want to and now I want to have the MovementBar (moveBarLevel) like in the original watchface (the red one on the left site, a bent arrow if you like). How can I do that in a good way? I've tryed to use the fillpolygon() method, but I don't know if this is a good idea. I've read something like polygons are battery killers and if I have to draw 5 bars with a lot of coordinates this could be an issue, right?

Thanks in advance
Thomas
  • I don't know how costly it is to draw a polygon with 6 (or is it 7) points. I doubt it all that expensive. You could definitely do it that way if you wanted though.

    Another possible option would be to use bitmaps. I believe you'd need up to 5 different bitmaps. Your MoveBar class would just just select the appropriate bitmap and draw it.

    Travis
  • One thing to consider with using bitmaps, is that the color is in the bitmap, so if you want to allow for different colors, you'll have different bitmaps. If you draw the movebar, it's easy to change the color.
  • Former Member
    Former Member over 8 years ago
    I don't think I can draw the polygon with 6 or 7 points. Look, I mean this bar:



    I think at least I need 20-30 points for the large bar.

    Also I think, to create a bitmap isn't easy as well, but I am not an expert with bitmaps, is there an (easy) way to create a bitmap programaticaly?

    Maybe I'm just too blind to see. Maybe you can give me a hint, show me a direction to walk.
  • I don't think I can draw the polygon with 6 or 7 points. Look, I mean this bar:

    If you were drawing the move bar on a square device, you would repeatedly draw 6 or 7 point polygons, one for each segment. Since you are talking about a round or semi-round device, you would need more points with fillPolygon() or use drawArc() to draw the bulk of the shape and then fillPolygon() to draw the ends.

    Also I think, to create a bitmap isn't easy as well, but I am not an expert with bitmaps, is there an (easy) way to create a bitmap programaticaly?

    You don't want to create the bitmap programmatically in ConnectIQ. You could do it using image editing software pretty easily. You'd create image files with transparency (.png would work) that included just the area that you want to draw. Then you'd use dc.drawBitmap() to render them on screen.

    Travis
  • One thing you can look at if you want the move bar to look like in your pic, is to use drawArc() for it, and then a bit more drawing if you want the pointy ends. You could just leave the ends flat if that's a problem, but you've have the curve. So you'd draw 1 to 5 arcs, with a space between each one.
  • Former Member
    Former Member over 8 years ago
    Thank you for the drawArc() hint. That's what I was looking for! I saw that method before, but I haven't had a clue of it's purpose.

    Now it looks like this:



    It still needs a bit of fine tuning for the gaps between the bars, but in general that's what I was looking for. Maybe I'll add pointy ends later, maybe not.

    Thank you all for you help!