메뉴 건너뛰기

창작에 관련된 질문이나 간단한 팁, 예제를 올리는 곳

이미지가 중요한 글인데 이미지가 다 짤렸네요. 압박.


준비물은 일단 이미지입니다.

예제 이미지로 럭키♥를 준비했습니다.




럭키! 럭키! 럭키! 와아아아!

어쨌든 이 럭키를 가지고 예제를 진행하겠습니다! 와아아! 글쓸 맛 난다!


일단 Love2D에서 뭔가 그린다는 건 좌표입니다.

저번의 배열에서 [y][x]로 처리했던것과 달리 이번엔 진짜 (x, y)꼴입니다.

와아아!



이런 럭키가 있으면 럭키의 x는 30, y는 10이 됩니다.

x 30, y 10에 그리면 저렇게 그려지는 겁니다.

(어쩐지 위키에 있는 그림이랑 똑같이 그려졌지만 럭키가 있으니 이쪽을 쓰겠습니다.)


하지만 파일이 있다고 바로 그릴 수 있는 게 아닙니다.

파일을 먼저 불러와야 합니다.

이것을 love.graphics.newImage로 불러옵니다.


[이미지] = love.graphics.newImage([파일경로])


[이미지] 부분에는 불러온 이미지를 식별할 수 있는 이름을,

[파일경로]에는 파일의 경로를 넣습니다.

Love2D의 main.lua와 같은 경로에 있으면 파일 이름만 적어도 됩니다.

이것을 유식한 말로 상대경로라고 합니다.


저는 pokemon이라는 이미지를 생성해보겠습니다.


pokemon = love.graphics.newImage("lucky.png")


공 식 위키에 따르면, 여러 번 실행되는 콜백(뭔지는 다뤘죠?)에서 저런 짓을 하면 상당히 게임이 느려진다고 합니다. 그러니까 그냥 한번만 불러온 뒤 (love.load 같은 콜백에서요!) 나중에 여러 번 호출하는 것이 훨씬 더 효율적이겠죠.

love.update나 love.draw같은 콜백에는 넣지 맙시다.


예제 코드:

function love.load()

pokemon = love.graphics.newImage("lucky.png")

end


이미지를 불러왔으니 이제 그릴 수 있습니다.

이미지를 그리는 것은 보통 love.draw 콜백에서 하게 됩니다.


love.graphics.draw(drawable, x, y, r, sx, sy, ox, oy, kx, ky) <br />

이게 뭔 개소리야?!

하나하나 뜯어봅시다.


Lua 글에서 설명했듯, 괄호 안에는 인수가 들어갑니다.

저기에 넣는 값에 따라 어떻게 그려질지가 달라지겠지요.


drawable는 그릴 수 있는 것이니, 이미지가 되겠네요.

방금 생성한 이미지 (예제에서는 pokemon)를 넣어주면 되겠습니다.


x랑 y는 뭔지 감이 잡히지 않습니까? 그림이 어디에 그려질지를 넣어주면 됩니다.

위의 그림이라면 x가 30이고 y가 10이겠지요.


r은 뭘까요? 회전시키는 겁니다.

그냥 그리고 싶을 때는 0을 넣습니다.


love.graphics.draw(pokemon, 100, 100, 0, 1, 1, 0, 0, 0, 0)

모르는 건 그냥 다 눈치껏 넣었을 때 어떻게 그려지냐면..



그럼 회전이니까 30도 돌리고 싶으면 어떻게 하나요? 30 넣으면 되나요?

위키에 조건이 있네요, 라디안으로 넣어달라고 합니다. 그게 뭐죠? 우걱우걱?

그래서 그냥 위키의 예제를 배껴서 math.rad(30) 를 넣었습니다.


love.graphics.draw(pokemon, 100, 100, math.rad(30), 1, 1, 0, 0, 0, 0)



얍.


주의할 점(?)은.. 기울어지면 좌표도 같이 기울어지는 듯 합니다.

90을 넣었더니 90도로 기울어지면서 아주 좌측의 창 테두리에 달라붙어 버리는 현상이;;

좀 더 파보면 좋겠지만 귀찮아서 생략,


sx랑 sy의 s는 scale의 약자입니다.

크기 조절!

기본값은 1이며, 넣은 만큼 크기가 줄어나거나 늘어듭니다.

0.5를 넣으면 반으로 줄어들고, 2를 넣으면 두배로 커집니다.

sx와 sy가 같을 필요는 없으며, 음수가 들어가면 그 쪽으로 잡아당겨서 커집니다.

그러니까.. -2를 넣으면 반으로 줄어드는 게 아니라 2배로 커지는데 좌표가 이동하면서 커집니다.

직접 한번 여러가지 해 보세요,



love.graphics.draw(pokemon, 100, 100, 0, 0.5, 1, 0, 0, 0, 0)

(가로를 반으로 축소)



love.graphics.draw(pokemon, 100, 100, 0, 1, 2, 0, 0, 0, 0)

(세로를 2배로 확대)


여담이지만 게임 엔진의 편리함을 몸으로 체험하고 있습니다.

빌려온 '세가의 신입 사원 교육 과정에서 배우는 게임 프로그래밍의 정석' 에서는 이미지의 확대, 축소, 회전을 큰 비중으로 다루고 있는데 엔진을 쓰면 코드 한 줄 쓰면 끝입니다.

얼핏 보니 회전을 다룰 때 삼각함수를 썼던가... 하지만 엔진을 쓰면 복잡한 수학은 그리 필요 없습니다.

하지만 엔진을 써도 어떻게 돌아가는지 원리는 알아야 합니다.

아니면, 엔진이 문제를 일으키면 속수무책이 되어버리던지, 엔진이 아직 없는 새로운 플랫폼에서 뭔가 개발하려면 무능해진다던지 하는 문제가 생깁니다.


ox와 oy는 뭘까요?

o는 아마 Origin, 시초? 뭐 그런 뜻입니다.

어디서부터 그릴지를 알려주는 것이라고 할 수 있습니다.



(위 그림은 예를 위해 그린 그림으로 실제 픽셀수와는 다릅니다.)


ox가 20, oy가 20이라면 그림의 20, 20 되는 점에서부터 그리기를 시작한다는 것입니다.

결과적으로 저렇게 잘린 럭키 이미지를 그리게 되는 것입니다.


이것만으로 '이미지를 다 그리게 되었다!' 라고 생각하면 좋겠지만...

타일 처리(뭔지는 나중에 설명해 드리겠습니다.)와 같은 것을 하기에는 아직 모자랍니다.

그래서 좀 더 찾아봤더니 Quad라는 것이 있는 고로 다음부터는 그 이야기를 해보겠습니다.


이미지 그리는 방법 2편, 기다려 주세요.

다음에는 Quad에 대해 파 보고, Quad가 뭔지, 어떻게 쓰는지 알아보겠습니다.

그리고는 Lua 소코반을 그래픽으로 옮기겠습니다... 모든 계획이 순조롭게 진행된다면요.


요약:

- Love2D에서 이미지를 그리기 전에 먼저 불러와야 한다.

- 불러오는 방법은 [이미지] = love.graphics.newImage([파일경로])

- 이미지를 그리기 위해서는 love.graphics.draw(drawable, x, y, r, sx, sy, ox, oy, kx, ky) .

- 일반적인 경우에 drawable, x, y만 지정해주고 sx, sy는 1, 나머지 인수는 다 0으로 지정해준다.

- 적절한 경우에 적절한 인수들을 적절히 사용하면 적절한 효과를 낼 수 있으며 이것을 적절히 사용하면 적절히 도움이 된다.
조회 수 :
813
등록일 :
2013.09.17
08:35:57 (*.209.135.92)
엮인글 :
게시글 주소 :
https://hondoom.com/zbxe/index.php?mid=study&document_srl=703469
List of Articles
번호 제목 글쓴이 조회 수sort 추천 수 날짜 최근 수정일
185 express.js 세션 적용 후 리다이렉트 시 세션 적용이 제대로 안 되는 문제점 노루발 4   2024-02-07 2024-02-07 14:23
문제: logout.js router.get('/', (req, res) => { req.session.destroy(); res.redirect('/login'); }); login.js if (result[0] !== undefined) { // 로그인에 성공하였으므로 세션을 할당 req.session.uid = result[0].uid; req.session.us...  
184 Bootstrap4 container class가 적용된 div의 양 옆에 설정하지 않은 margin이 생김 노루발 5   2024-02-07 2024-02-07 14:25
문제: <div class="container"> TEST </div> 위와 같은 페이지를 브라우저에서 렌더링 시 div의 양 옆에 설정하지 않은 빈 margin이 생김. 해결: <div class="container-fluid"> TEST </div> margin을 0으로 주고 width를 100%로 주고 등등 별걸 다 해봤는데 ...  
183 리캡챠 적용 [1] 노루발 11   2021-01-08 2021-01-11 12:15
XE 회원가입 시 구글 리캡챠 인증 추가하기 : 네이버 블로그 (naver.com)  
182 love2d에서 안드로이드 터치 제스처 인식하기 노루발 20   2020-11-12 2020-11-12 00:38
-- 안드로이드/iOS 등등의 터치스크린 입력을 받는 기기에서는 총 3가지의 콜백 함수를 사용한다: -- love.touchpressed / love.touchmoved / love.touchreleased -- 다만 위 3가지 함수는 마우스 클릭으로는 발생하지 않으므로 추가적인 처리가 필요하다. -- ...  
181 certbot을 이용한 HTTPS 인증서 발급 및 적용 노루발 20   2021-01-12 2021-01-12 16:57
snap 설치 및 업데이트 sudo snap install core; sudo snap refresh core certbot 설치 sudo snap install --classic certbot 심볼릭 링크 생성 sudo ln -s /snap/bin/certbot /usr/bin/certbot nginx에 맞춰 자동 설정 sudo certbot --nginx 알아서 다 해주기...  
180 illegal character 방지 [3] 노루발 22   2023-07-17 2023-07-19 16:14
문제점: 클라이언트 <-> 서버 통신을 하면서 다음과 같이 메세지를 주고받기로 함 패킷종류|파라미터1|파라미터2 예) MOTDREQ -> 서버에 MOTD를 요청 (파라미터 없음) MOTD|공지사항입니다 -> MOTD는 "공지사항입니다" 임 (파라미터 1개) MSG|김덕배|안녕하세...  
179 Lua-love2d TCP 통신 [1] 노루발 25   2023-07-14 2023-07-22 16:19
서버: Lua 클라이언트: Love2d(Lua) 서버 구동에는 luasocket 라이브러리가 필요하며, luarocks로 설치할 수 있음. 별도 패키지 관리자가 있는 리눅스 시스템에서는 apt-get install lua-socket 등의 패키지 관리자 명령어로 설치 가능하며 Windows에서 구동시...  
178 Lua 클래스 만들고 활용하기 노루발 26   2020-11-06 2020-11-06 22:43
------------------------ stairs.lua ------------------------ Stairs = {} function Stairs:new(x, y, floor, direction, locked) local newStairs = {x = x, y = y, floor = floor, direction = direction, locked = locked} self.__index = self retur...  
177 Lua 테이블 안에 함수 저장하기 노루발 28   2020-11-06 2020-11-06 21:07
테이블 안에 함수를 저장할 수 있다. function move(object, direction) print(object .. " moved to ".. direction) end scheduler = {} scheduler.queue = {} function scheduler.newentry(action, args) scheduler.queue[#scheduler.queue + 1] = {} schedu...  
176 루아 스타일 가이드 노루발 35   2020-11-19 2020-11-19 00:58
http://lua-users.org/wiki/LuaStyleGuide https://github.com/Olivine-Labs/lua-style-guide  
175 이쁜 눈나가 유니티 개발 알려주는 재생목록 노루발 37   2020-11-12 2020-11-12 05:59
https://www.youtube.com/watch?v=Ur2jN6_si6c&list=PLi-ukGVOag_1lNphWV5S-xxWDe3XANpyE https://www.youtube.com/watch?v=sJClf9S7AMA&list=PLi-ukGVOag_0HR09oTs966Wt81IYYXlFH 유니티를 배우고 있는 건 아닌데 만들어진 라이브러리를 다루는게 아...  
174 Love2d 이미지 하얗게 그리기 노루발 42   2020-11-23 2020-11-23 04:11
아래와 같은 코드를 사용해 이미지에 색상을 적용할 수 있다. hamster = love.graphics.newImage("hamster.png") love.graphics.setColor(1, 0, 0) -- 빨간색으로 그리기 love.graphics.draw(hamster) love.graphics.setColor(1, 1, 1) 하지만 이미지를 하얗게...  
173 Love2d 게임 안드로이드로 패키징하기 노루발 49   2021-01-11 2021-02-21 01:45
http://hondoom.com/zbxe/index.php?mid=study&document_srl=797993 버전이 바뀌면서 빌드 방법이 바뀌었기에 다시 정리한다. 1. Android studio 설치 https://developer.android.com/studio/index.html SDK 플랫폼 - Android 11.0 [API 30] SDK 버전 - An...  
172 특정좌표를 기준으로 zoom in/zoom out하기 노루발 59   2020-11-11 2020-11-11 01:22
-- x,y - 줌인/줌아웃시 기준점 (좌표 이동이나 scale에 영향받지 않는 순수한 화면 좌표) -- scale - 현재 scale(1:그대로 0.5:1/2 사이즈 2:2배 사이즈) -- scaleinc - 얼마나 scale을 변화시킬것인가 (I usually use 0.1 or -0.1) -- camx - 카메라의 x좌표...  
171 Lua 인수로 nil값이 들어왔을 경우 처리하기 노루발 69   2020-11-06 2020-11-06 20:29
or 연산자를 사용한다. 예제 코드: function moveplayer(direction) direction = direction or "nowhere" print("player moved to ".. direction) end moveplayer() --> "player moved to nowhere" moveplayer("north") -- "player moved to north" 이런 코드...  
170 Windows To Go와 R-Studio를 이용한 손실된 데이터 복구하기 노루발 90   2020-01-30 2020-01-30 19:52
하기의 복구 방법으로 모든 자료를 100% 복구할 수는 없으므로 자료의 손실 이전에 신뢰성 있고 주기적인 백업이 선행되어야 한다. 준비물: - 부팅 USB 혹은 외장 HDD/SSD - 복구한 자료를 저장할 외부 저장장치 (옵션) - R-Studio https://www.r-studio.com/ ...  
169 Oracle cloud에 Nginx/MariaDB 설치하기 노루발 93   2020-12-06 2020-12-06 20:19
https://itreport.tistory.com/624  
168 Love2d DPI 이슈 해결 [3] 노루발 98   2019-06-29 2019-07-01 06:34
이런 love 프로젝트가 있다고 하자. (conf.lua) function love.conf(t) t.window.width = 640 t.window.height = 360 end 창 크기를 640*480으로 설정한 뒤 실행하면 어떻게 보일까? 당연히 창 크기가 640*480 크기로 보여야겠지만 내 컴퓨터에서는 이렇게 보...  
167 Love2d로 만든 로그라이크 예제 노루발 254   2020-11-30 2020-11-30 22:54
https://gitlab.com/Jalexander39/roguelikedev-does-the-complete-roguelike-tutorial 이걸 왜 여태 몰랐지...  
166 love.update(dt) 에서 버벅이는 현상. 노루발 256   2013-09-17 2013-09-17 08:15
윈도우를 잡고 흔들거나 윈도우 사이로 잠시 전환하거나.. 등으로 원치 않는 렉이 발생할 시 dt의 값이 평소보다 크게 들어갑니다. (예를 들면, 평소에 0.25가 들어간다면 이번에는 3.1이 들어갑니다.) 이건 평소보다 더 많이 크기 때문에, dt를 가지고 타이...