Difference between revisions of "love.graphics.rotate"

m (Rotating a static scene: Updated colors to 0..1 range, simplified example)
(See Also)
Line 79: Line 79:
 
* [[love.graphics.translate]]
 
* [[love.graphics.translate]]
 
* [[love.graphics.origin]]
 
* [[love.graphics.origin]]
 +
* [[love.graphics.polygon]]
 
[[Category:Functions]]
 
[[Category:Functions]]
 
{{#set:Description=Rotates the coordinate system in two dimensions.}}
 
{{#set:Description=Rotates the coordinate system in two dimensions.}}
 
{{#set:Since=000}}
 
{{#set:Since=000}}
 
{{#set:Sub-Category=Coordinate System}}
 
{{#set:Sub-Category=Coordinate System}}
 +
 
== Other Languages ==
 
== Other Languages ==
 
{{i18n|love.graphics.rotate}}
 
{{i18n|love.graphics.rotate}}

Revision as of 15:04, 19 September 2021

Rotates the coordinate system in two dimensions.

Calling this function affects all future drawing operations by rotating the coordinate system around the origin by the given amount of radians. This change lasts until love.draw() exits.

Function

Synopsis

love.graphics.rotate( angle )

Arguments

number angle
The amount to rotate the coordinate system in radians.

Returns

Nothing.

Examples

Rotating a static scene

This example shows how to rotate a static scene around a given point. Since the rotation is always around the origin, translating the center of the screen to the origin and back around the rotate operation makes the effective rotation point be the center of the screen. This is demonstrated by drawing a rectangle that shows the rotation and a point that is right in the center and thus does not move when the scene rotates. Note that the drawing commands have coordinates that depend solely on the screen size.

local angle = 0

function love.draw()
	local width = love.graphics.getWidth()
	local height = love.graphics.getHeight()
	-- rotate around the center of the screen by angle radians
	love.graphics.translate(width/2, height/2)
	love.graphics.rotate(angle)
	love.graphics.translate(-width/2, -height/2)
	-- draw a white rectangle slightly off center
	love.graphics.setColor(1, 1, 1)
	love.graphics.rectangle('fill', width/2-100, height/2-100, 300, 400)
	-- draw a five-pixel-wide blue point at the center
	love.graphics.setPointSize(5)
	love.graphics.setColor(0, 0, 1)
	love.graphics.points(width/2, height/2)
end

function love.update(dt)
	love.timer.sleep(.01)
	angle = (angle + dt * math.pi/2) % (2*math.pi)
end

Rotating the entire screen

This example shows how you can rotate the screen 90 degrees, counter clockwise. Especially useful if you just distribute .love files for android, where the game always starts in landscape mode. After this, the width and height of the canvas will be "swapped". Don't forget to always translate the input and do all the screen bounds specific checks accordingly.

function love.load()
	--get the width and height of the CANVAS, not of the DESKTOP
	width, height = love.graphics.getWidth(), love.graphics.getHeight()
end

function love.draw()
	love.graphics.translate(width/2, height/2)
	love.graphics.rotate(-math.pi / 2)
	love.graphics.translate(-height/2, -width/2)

	love.graphics.setColor(255, 0, 0)
	love.graphics.points(0, 0)
	--It will require zoom to observe the 1 pixel point, but it goes to show that it works.
end

-- simple function for translating mouse input, for example
local function translate(_x, _y)
	local y = _x
	local x = height - _y

	return x, y
end
--[[
--Say you are doing love.graphics.rectangle("fill", 150, 170, 125, 145), in the translated system, like above
--You would just need to translate(x, y) the mouse input and then check the x to be within
--[150, 275] and y within [170, 315] respectively. No inversion of width and height.
--]]

See Also



Other Languages