How do I use image for analog watch pointers?

Ok so I have followed the guides and setup a basic analog watch face. I also have been able to replace the background image with a new one. My next task is to change the hands from simple lines to a png so I can customize the look. How would I do this? I'm assuming from what I have learned so far that I need to load the png for the hour and min hand to the recourse/image folder and add it to the recourse.xml. But how do I implement it so that it rotates to show the hour,min?
  • To use a bitmap for this, you need a separate image for each position, as there's no way to rotate a bitmap on the watch.

    Maybe look at using drawPolygon()? With it you can calculate the points. (also, since you draw it, you can change colors, where a bitmap would also need different bitmaps for different colors.)
  • Pinilla

    Maybe also have a look in the sample folder that is provided with the SDK.
    The sample "Analog" shows a simple analog face, how to define hands and how to transform the coordinates (rotate the hands)
  • Ok I'm trying drawPolygon but can't seem to figure out how the string works... I have read that it has a min of three points to make, is there a limit to how many points? (Beyond processing time) also I can not seem to figure out how to write it correctly. Would it be like

    drawPolygon( (x1,y1), (x2,y2), (x3,y3), color) ?
  • More like this:
    var points=[[1,1],[25,50],[55,10]];
    dc.setColor(Gfx.COLOR_GREEN,Gfx.COLOR_GREEN);
    dc.fillPolygon(points);


    You want to handle "points" differently, as this is just a triangle pointing toward the top left corner using fixed locations. Here I only use 3 points, but you can add more.See the Analog sample in the SDK.