Rotating images distorts if not working in 90-degree intervals

Hi all!

Just getting into making a game, and I'm looking to create a dial which turns via the crank. I started with a basic circle with some marks on it so I can see how the rotation works, and then I use image.drawRotated(x, y, angle) to rotate the image clockwise. If I work in 90 degree angles, it will rotate without any issues, but if I do anything else, the image distorts and actually appears to move, even though I am continuing to draw it at the same position.

I'm new to this so I might be missing something obvious. Any help would be appreciated!

Thanks!

Can you share a gif of the faulty rotation? Thanks!

rotation

And here is the code used for my rotate function:


function rotate()

    local c = playdate.getCrankTicks(60)

    if (c > 0 or c < 0) then

        circle2 = circle1:rotatedImage(c)

        circle1:clear(1)

        gfx.image.draw(circle2, 100, 100)

        circle1 = circle2:copy()

       

    end

end

Thanks for the help!

I actually ended up figuring it out! Using the rotatedImage() function was changing the image size and getting things funky.

If it helps anyone else, I used this code:

local c1 = 0

function playdate.update()

    if (playdate.buttonIsPressed("a")) then

        circle1:draw(100, 100)

    end

    local c = playdate.getCrankTicks(80)

    if (c>0 or c<0) then

        c1 = c1 + c

        circle2 = circle1:copy()

        circle1:clear(1)

        circle1:draw(100,100)

        circle2:drawRotated(151, 151, c1)

        circle1 = circle2:copy()

    end

Gif below (some of the jerkiness is due to the way I was rotating the crank in the simulator):

rotation

1 Like