Difference between revisions of "love.graphics.rotate"
(→See Also: Removed links that don't fit.) |
(Updated note about persistence.) |
||
(One intermediate revision by the same user not shown) | |||
Line 1: | Line 1: | ||
Rotates the coordinate system in two dimensions. | 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 | + | 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 the next [[love.draw]] call, or a [[love.graphics.pop]] reverts to a previous [[love.graphics.push]], or [[love.graphics.origin]] is called - whichever comes first. | ||
+ | |||
== Function == | == Function == | ||
=== Synopsis === | === Synopsis === | ||
Line 11: | Line 14: | ||
=== Returns === | === Returns === | ||
Nothing. | Nothing. | ||
+ | |||
== Examples == | == Examples == | ||
+ | |||
=== Rotating a static scene === | === 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. | 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. | ||
+ | |||
<source lang="lua"> | <source lang="lua"> | ||
local angle = 0 | local angle = 0 | ||
+ | |||
+ | function love.update(dt) | ||
+ | -- Rotate a quarter turn per second. | ||
+ | angle = angle + .5*math.pi * dt | ||
+ | end | ||
function love.draw() | function love.draw() | ||
− | local width = love.graphics. | + | local width, height = love.graphics.getDimensions() |
− | local height | + | |
− | -- | + | local centerX = width/2 |
− | love.graphics.translate( | + | local centerY = height/2 |
+ | |||
+ | -- Rotate around the center of the screen by angle radians. | ||
+ | love.graphics.translate(centerX, centerY) | ||
love.graphics.rotate(angle) | love.graphics.rotate(angle) | ||
− | love.graphics.translate(- | + | love.graphics.translate(-centerX, -centerY) |
− | -- | + | |
+ | -- Draw a white rectangle slightly off center. | ||
love.graphics.setColor(1, 1, 1) | love.graphics.setColor(1, 1, 1) | ||
− | love.graphics.rectangle( | + | love.graphics.rectangle("fill", centerX-100, centerY-100, 300, 400) |
− | -- | + | |
+ | -- Draw some black text with the top left corner at the center. | ||
+ | love.graphics.setColor(0, 0, 0) | ||
+ | love.graphics.print("Lorem ipsum.", centerX, centerY) | ||
+ | |||
+ | -- Draw a five-pixel-wide blue point at the center. | ||
love.graphics.setPointSize(5) | love.graphics.setPointSize(5) | ||
love.graphics.setColor(0, 0, 1) | love.graphics.setColor(0, 0, 1) | ||
− | love.graphics.points( | + | love.graphics.points(centerX, centerY) |
− | |||
− | |||
− | |||
− | |||
− | |||
end | end | ||
</source> | </source> | ||
Line 41: | Line 56: | ||
=== Rotating the entire screen === | === 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. | 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. | ||
+ | |||
<source lang="lua"> | <source lang="lua"> | ||
− | function | + | -- Simple function for translating on-screen coordinates to in-game coordinates. |
− | + | local function screenToGame(xOnScreen, yOnScreen) | |
− | + | local xInGame = love.graphics.getHeight() - yOnScreen | |
+ | local yInGame = xOnScreen | ||
+ | |||
+ | return xInGame, yInGame | ||
end | end | ||
function love.draw() | function love.draw() | ||
− | + | local screenWidth, screenHeight = love.graphics.getDimensions() | |
− | |||
− | |||
− | love.graphics. | + | -- Transform the coordinate system so the top left in-game corner is in |
− | love.graphics. | + | -- the bottom left corner of the screen. |
− | -- | + | love.graphics.translate(0, screenHeight) |
− | + | love.graphics.rotate(-math.pi/2) | |
+ | |||
+ | -- Draw some text in the (translated) top left corner. | ||
+ | love.graphics.setColor(1, 1, 1) | ||
+ | love.graphics.print("Lorem ipsum.", 5, 5) | ||
+ | |||
+ | -- Draw a rectangle that lights up when hovered. | ||
+ | local rectX = 150 | ||
+ | local rectY = 250 | ||
+ | local rectWidth = 180 | ||
+ | local rectHeight = 110 | ||
+ | |||
+ | local mouseX, mouseY = love.mouse.getPosition() -- On-screen. | ||
+ | mouseX, mouseY = screenToGame(mouseX, mouseY) -- In-game. | ||
− | + | local isHovered = (mouseX >= rectX and mouseY >= rectY and mouseX < rectX+rectWidth and mouseY < rectY+rectHeight) | |
− | local | ||
− | |||
− | |||
− | + | if isHovered then | |
+ | love.graphics.setColor(1, 1, 1) | ||
+ | else | ||
+ | love.graphics.setColor(1, 0, 0) | ||
+ | end | ||
+ | love.graphics.rectangle("fill", rectX, rectY, rectWidth, rectHeight) | ||
end | end | ||
− | |||
− | |||
− | |||
− | |||
− | |||
</source> | </source> | ||
Latest revision as of 18:23, 3 June 2022
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 the next love.draw call, or a love.graphics.pop reverts to a previous love.graphics.push, or love.graphics.origin is called - whichever comes first.
Contents
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.update(dt)
-- Rotate a quarter turn per second.
angle = angle + .5*math.pi * dt
end
function love.draw()
local width, height = love.graphics.getDimensions()
local centerX = width/2
local centerY = height/2
-- Rotate around the center of the screen by angle radians.
love.graphics.translate(centerX, centerY)
love.graphics.rotate(angle)
love.graphics.translate(-centerX, -centerY)
-- Draw a white rectangle slightly off center.
love.graphics.setColor(1, 1, 1)
love.graphics.rectangle("fill", centerX-100, centerY-100, 300, 400)
-- Draw some black text with the top left corner at the center.
love.graphics.setColor(0, 0, 0)
love.graphics.print("Lorem ipsum.", centerX, centerY)
-- Draw a five-pixel-wide blue point at the center.
love.graphics.setPointSize(5)
love.graphics.setColor(0, 0, 1)
love.graphics.points(centerX, centerY)
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.
-- Simple function for translating on-screen coordinates to in-game coordinates.
local function screenToGame(xOnScreen, yOnScreen)
local xInGame = love.graphics.getHeight() - yOnScreen
local yInGame = xOnScreen
return xInGame, yInGame
end
function love.draw()
local screenWidth, screenHeight = love.graphics.getDimensions()
-- Transform the coordinate system so the top left in-game corner is in
-- the bottom left corner of the screen.
love.graphics.translate(0, screenHeight)
love.graphics.rotate(-math.pi/2)
-- Draw some text in the (translated) top left corner.
love.graphics.setColor(1, 1, 1)
love.graphics.print("Lorem ipsum.", 5, 5)
-- Draw a rectangle that lights up when hovered.
local rectX = 150
local rectY = 250
local rectWidth = 180
local rectHeight = 110
local mouseX, mouseY = love.mouse.getPosition() -- On-screen.
mouseX, mouseY = screenToGame(mouseX, mouseY) -- In-game.
local isHovered = (mouseX >= rectX and mouseY >= rectY and mouseX < rectX+rectWidth and mouseY < rectY+rectHeight)
if isHovered then
love.graphics.setColor(1, 1, 1)
else
love.graphics.setColor(1, 0, 0)
end
love.graphics.rectangle("fill", rectX, rectY, rectWidth, rectHeight)
end
See Also
- love.graphics
- love.graphics.push
- love.graphics.pop
- love.graphics.scale
- love.graphics.shear
- love.graphics.translate
- love.graphics.origin
Other Languages
Dansk –
Deutsch –
English –
Español –
Français –
Indonesia –
Italiano –
Lietuviškai –
Magyar –
Nederlands –
Polski –
Português –
Română –
Slovenský –
Suomi –
Svenska –
Türkçe –
Česky –
Ελληνικά –
Български –
Русский –
Српски –
Українська –
עברית –
ไทย –
日本語 –
正體中文 –
简体中文 –
Tiếng Việt –
한국어
More info