How do I make an image rotate to where I am touching the screen?

Dear all,

I have an image of an arrow and I want it to point to a specific coord on the screen when I touch it.

How do I do this?

Many Thanks,

James Mallon

If you mean when you touch the screen, use math.atan2(dy,dx) this takes two offsets (y offset and x offset) and returns an angle between the two in radians.

You then convert this to a degree angle (using math.deg()) and apply this to the rotation of the arrow. 

You might have to negate the y offset because trigonometry has y going upwards, and Corona has y going downwards. Probably a good idea to have the anchor in the middle of your arrow image.

Ok sorry im terrible at this maths, is there anyway you could give me some example code with an event listener?

should only take two secs?

Many Thanks,

James

If you don’t mind waiting a bit :slight_smile: Not that it would take long but I’m just about to have dinner…

of course not :slight_smile:

Try this - sets up a blue background which receives the taps, creates a polygon arrow and rotates it when you click on the blue background. Is this what you meant ?

display.setStatusBar(display.HiddenStatusBar) local rect = display.newRect(0,0,320,480) rect.anchorX,rect.anchorY = 0,0 rect:setFillColor(0,0,0.5) display.newLine(0,240,320,240):setStrokeColor( 1,1,0 ) display.newLine(160,0,160,480):setStrokeColor( 1,1,0 ) local arrow = display.newPolygon( 160,240, { -20,15,-20,-15,40,0 }) arrow:setFillColor(1,0,0) arrow.strokeWidth = 1 rect:addEventListener( "tap", function(e) local radians = math.atan2(e.y - arrow.y, e.x - arrow.x) local degrees = math.deg(radians) arrow.rotation = degrees end)

Ah brilliant you made it work! I was wondering how I would fire a projectile in the direction the arrows pointing,

Thanks so much!

If you mean when you touch the screen, use math.atan2(dy,dx) this takes two offsets (y offset and x offset) and returns an angle between the two in radians.

You then convert this to a degree angle (using math.deg()) and apply this to the rotation of the arrow. 

You might have to negate the y offset because trigonometry has y going upwards, and Corona has y going downwards. Probably a good idea to have the anchor in the middle of your arrow image.

Ok sorry im terrible at this maths, is there anyway you could give me some example code with an event listener?

should only take two secs?

Many Thanks,

James

If you don’t mind waiting a bit :slight_smile: Not that it would take long but I’m just about to have dinner…

of course not :slight_smile:

Try this - sets up a blue background which receives the taps, creates a polygon arrow and rotates it when you click on the blue background. Is this what you meant ?

display.setStatusBar(display.HiddenStatusBar) local rect = display.newRect(0,0,320,480) rect.anchorX,rect.anchorY = 0,0 rect:setFillColor(0,0,0.5) display.newLine(0,240,320,240):setStrokeColor( 1,1,0 ) display.newLine(160,0,160,480):setStrokeColor( 1,1,0 ) local arrow = display.newPolygon( 160,240, { -20,15,-20,-15,40,0 }) arrow:setFillColor(1,0,0) arrow.strokeWidth = 1 rect:addEventListener( "tap", function(e) local radians = math.atan2(e.y - arrow.y, e.x - arrow.x) local degrees = math.deg(radians) arrow.rotation = degrees end)

Ah brilliant you made it work! I was wondering how I would fire a projectile in the direction the arrows pointing,

Thanks so much!