Image Layer rotation

Hi folks,
I'm trying to figure out how layer rotation is supposed to work.

  • I've got an image for the hour arm of size (59,20). It should rotate around its point (8,10).
  • I've got an image for the minute arm of size (72,29). It should rotate around its point (63,16).
  • The rotation axis should be at (73,64) on the screen.
I just can't figure out how to calculate the correct frame position. I tried various calculation of how I thought it could work for over an hour now. Through trial and error I've now determined that for the hour arm, I need to set the frame origin to (21,12) and the minute position to (7,-2). But I just can't see how I would correctly calculate these values. Can anybody enlighten me? Thanks.

Here's how I set up the hour arm:

    rotbmp_pair_init_container(RESOURCE_ID_IMAGE_HOUR_ARM_WHITE, RESOURCE_ID_IMAGE_HOUR_ARM_BLACK, &gHoursLayer);
    gHoursLayer.layer.layer.frame.origin.x = 21;
    gHoursLayer.layer.layer.frame.origin.y = 12;
    rotbmp_pair_layer_set_src_ic(&gHoursLayer.layer, GPoint(kHourArmCenterX, kHourArmCenterY)); // 8, 10
    layer_add_child(&gBackgroundLayer.layer.layer, &gHoursLayer.layer.layer);


  • PhilipPhilip Posts: 420Administrator admin
    It's important to know that the size of the image "on the watch" is the smallest bounding box that fits the image in all possible rotations (i.e. the sides of the image on the watch are equal to length of the diagonal on the original). So you need to take that into account in your calculations.

    Have you seen how this example does it:
    SDK Guy | Team Pebble |
Sign In or Register to comment.