Roku Developer Program

[crawfishmedia]

Hi all, Can someone please tell me why rotating an image in Image Canvas is so difficult? Based on the documentation this should work. What am I missing? The image is a PNG. Thanks.
canvasItems = []
photo_x = 600
photo_y = 300
photo_h = 300
photo_w = 300
photo_w_t = photo_w / 2
photo_h_t = photo_h / 2
rotate = 90.0
canvasItems.Push({
url:URLtoImage
TargetRect:{ x:photo_x, y:photo_y, w:photo_w, h:photo_h }
TargetTranslation:{ x:photo_w_t, y:photo_h_t }
TargetRotation:rotate
})
canvas = CreateObject("roImageCanvas")
port = CreateObject("roMessagePort")
canvas.SetMessagePort(port)
canvas.AllowUpdates(true)
canvas.SetRequireAllImagesToDraw(false)
canvas.SetLayer(0, {Color:"#FF000000", CompositionMode:"Source"})
canvas.SetLayer(1, canvasItems)
canvas.Show()

[renojim]

It's been a while since I did any rotations, but as I recall you generally want to rotate around the center point of the image and then translate it the position on the screen where you want it to appear. This means you have to shift the image down and left by half the height and width putting the 0,0 point at the center of the image. Here's the code I used for the Video Poker screensaver:

x = rnd(dsize.w)
y = rnd(dsize.h)
r = rnd(180) - 90
item = [{ url:url,TargetRect:{x:Int(-cardw/2), y:Int(-cardh/2), w:cardw, h:cardh},TargetRotation:r,TargetTranslation:{x:x,y:y}}]
canvas.SetLayer(1,item)

Hope this helps!
-JT