Computer Science Canada

[Tutorial] Rotating Pictures Based on Mouse Position

Author:  wierdo1111 [ Sun Mar 24, 2013 12:26 am ]
Post subject:  [Tutorial] Rotating Pictures Based on Mouse Position

This will cover how to rotate pictures based on it's position relative to the mouse.

Before I start somethings to note; I have included the picture i used as an attachment, your picture must have some padding or some of it may get clipped
during the rotation unless your picture is just a circle like mine, and to get rid of the white border you can just use picMerge and Pic.SetTransparentColor.



Have your basic variables You can assume what they are, and specifying what image to use.
code:
var mx, my, b : int
var px : int := maxx div 2
var py : int := maxy div 2
var ang : real := 0
var chars : array char of boolean

var pic, pic1 : int
pic := Pic.FileNew ("circlep.gif")

View.Set ("offscreenonly")


Here is some code that will let you move your picture around, I'm not going to talk about how it works.
code:
loop
    cls
    drawfillbox (0, 0, maxx, maxy, blue)
    mousewhere (mx, my, b)
    Input.KeyDown (chars)
    %%%%%%%%%%%%%%%%%%%%%% left
    if chars ('a') or chars (KEY_LEFT_ARROW) then
        if px > 60 then
            px := px - 4
        end if
    end if
    %%%%%%%%%%%%%%%%%%%%% right
    if chars ('d') or chars (KEY_RIGHT_ARROW) then
        if px < maxx - 90 then
            px := px + 4
        end if
    end if
    %%%%%%%%%%%%%%%%%%%%%%% up
    if chars ('w') or chars (KEY_UP_ARROW) then
        if py < maxy - 90 then
            py := py + 4
        end if
    end if
    %%%%%%%%%%%%%%%%%%%%%%%% down
    if chars ('s') or chars (KEY_DOWN_ARROW) then
        if py > 60 then
            py := py - 4
        end if
    end if


Now whats happening is that we are getting an x and a y value based off the position of the center of the image relative to the mouse position.
Based on the combination of these x and y values being positive or negative we can determine the quadrant the mouse is in.
Using this info we can use sohcahtoa and related angles to find the theta (angle), so RA = arctand (|opp|/|adj|) or so RA = arctand (|y|/|x|),
following that up with, then theta can be found using some related angle knowledge.


code:
    if px - mx < 0 and py - my < 0 then  %checks quadrant 1
        ang := arctand (abs (py - my) / abs (px - mx))
    elsif px - mx > 0 and py - my < 0 then % checks qudrant 2
        ang := 180 - arctand (abs (py - my) / abs (px - mx))
    elsif px - mx > 0 and py - my > 0 then % checks qudrant 3
        ang := 180 + arctand (abs (py - my) / abs (px - mx))
    elsif px - mx < 0 and py - my > 0 then % checks qudrant 4
        ang := 360 - arctand (abs (py - my) / abs (px - mx))
    end if


Now all that's left is to make pic1 become pic rotated by the angle we got from before, draw it, then free pic1 or Turing will eventually crash.
The parameters for Pic.Rotate are (variable of pic to rotate, angle (must be integer), pivot point or point of rotation in pic)

code:
pic1 := Pic.Rotate (pic, (round (ang)), 50, 50)
    Pic.Draw (pic1, px - 50, py - 50, picCopy)
    Pic.Free (pic1)
    View.Update
    delay (15)
end loop


: