[💬] Love2D로 게임 만들기 1편 (대충 씀)

[토끼주문(icyselec)]

총 5편으로 계획했지만 상황을 보고 좀 더 빨리 끝나거나 심화 과정을 나중에 추가할수도 있음. 소스코드는 마땅히 넣을 방법이 없어서 사진으로 올림. 점점 문체가 이상해지는게 보이는데 사실 귀찮아서 그랬음

1. main.lua 파일의 기초적인 콜백 함수들을 정의해준다.
love.load = 지금은 그저 Love2D에서 제일 처음으로 실행되는 콜백이라고 이해하자. (사실은 love.run이 먼저기는 한데 이건 직접 작성하지 않는 이상 만날일은 없을 거다.)
love.update = 초기화가 끝나면, 매 프레임마다 이 콜백 함수가 호출된다. 주 목적은 게임의 상태 갱신이다.
love.draw = 화면을 그리는데 사용되는 콜백이다.

이러한 콜백 함수들은 사실 생으로 한 파일에 함수 정의를 몰아넣고 사용할 수도 있지만 게임을 견고하게 만들기 위해서는 더 작은 단위로 나누어서 처리가 가능하게끔 로직을 작성해주어야 한다. 이는 Lua가 어떤 스타일대로 작성해도 잘 작동하는 언어이기 때문이다. 이 강의에서는 어려운 테크닉을 필요로 하는 것이 아니고 설명 또한 달려있기 때문에 편하게 읽어도 된다.

2. 어떤 게임을 만들 것인지 구상해보자.
미리 준비한 게임 형식이 있으므로 사실 깊게 생각할 필요는 없다.
"게임이 시작하면 크기가 무작위인 폭탄이 여러개 생성되고 이 폭탄은 일정한 속도로 움직이며 벽에 반사된다."
"5초의 카운트다운이 지나면 마우스로 폭탄을 피해야하고, 시간이 지날수록 원들의 속도가 점점 빨라진다."
"오래 살아남을수록 점수가 높고, 폭탄과 부딪히거나 게임 화면 밖으로 나가면 패배하며 점수를 표시한다."
"시간 경과에 따라 코인을 무작위 위치에 생성하며, 닿을 경우 원의 크기에 비례하여 점수가 추가된다."
"시간 경과에 따라 얼음을 무작위 위치에 생성하며, 닿을 경우 원의 크기에 비례하여 폭탄의 속도가 느려진다."

오늘 강의는 일단 위의 내용 중, 첫번째 줄을 먼저 구현해볼 것이다.

3. 일단 무작정 원부터 그려보자.
프로그래밍을 처음 입문하면 "Hello, world!"를 출력하는 것부터 해보듯이 우리는 원을 그리는 것부터 시작해본다.

function love.draw ()
    love.graphics.circle("line", 0, 0, 25)
end
위 코드는 실선으로 (0, 0)에 반지름이 25인 원을 그리는 코드이다.

실행해보면, 원이 화면을 벗어나서 일부만 표시될 것이다. 원하는 위치에 원을 그려줄려면 반지름을 더해주어야 한다.

love.graphics.circle("line", 25, 25, 25)

이제 짤림 없이 잘 표시된다.

이 코드를 설명하는 이유는 원은 중심을 기준으로 그려진다는 것과 원의 크기는 반지름으로 나타낸다는 것을 알려주기 위해서이다. 물론 사실 나도 몰랐다. 참고로 사각형은 왼쪽 위가 중심점이다.

여기까지 하면 소스코드는 아래와 같이 됨.

4. GameObject를 정의해보자.
GameObject는 게임에서 움직이는 모든 오브젝트의 베이스 클래스이다. 그냥 폭탄, 코인, 얼음 각각의 클래스를 따로 만들면 되는거 아니냐고 물을 수도 있지만 이들은 몇가지 공통점이 있다.
첫째로, 위치, 속도, 크기 등의 요소를 갖고 있다.
둘째로, 공통된 동작을 가진다.
셋째로, 기본 동작을 가져야 한다.

이를 상속이 해결해줄 수 있고 Lua는 직접적으로 상속을 지원하진 않지만 몇가지 코드로 이를 가능하게 할 수 있다.

먼저 GameObject라는 클래스를 정의하자.
GameObject = {}
function GameObject:new (o)
    o = o or {}
    setmetatable(o, self)
    self.__index = self
    return o
end

아마 디시에 글 올라갔을때는 소스코드의 공백이 다 사라져서 개판이 났을 가능성이 높지만 신기하게도 Lua는 그런 상황에 최적화되어 있어서 아무 문제없이 작동함! 그냥 아무 상관 없으니까 복붙하셈. 안되면 댓글로 말하고

5. GameObject의 기본 동작을 만들자.
우리가 필요한 것은 update, draw, isCollide 3개다. 이들은 모두 기본과 공통 동작에 연관되어 있다. 나중에는 흑마법을 부려서 충돌 감지 함수를 다른 용도로 써먹는 것도 보여줄 것임.

소스코드 개판날 가능성을 대비해서 그냥 사진으로 올림. 소스코드 어케 올리지...

update 함수는 매 갱신주기마다 실행될 함수인데 지정된 방향으로 계속 움직이게 하는 단순한 코드임.

draw 함수는 기본 동작인 화면 표시 역할을 하고

isCollide 함수는 충돌 감지 함수인데 간단하게 그냥 두 점 사이의 직선 거리를 구하고 원의 두 반지름을 더한 것보다 작으면 충돌로 판정되는 간단한 식임. 그래서 원끼리의 충돌 감지에만 써먹을 수 있는데 나중에 이거 흑마법 부려서 마우스에도 충돌 감지 적용시킬거임.

6. 폭탄 객체를 정의해보자.
사실 Lua에서의 상속은 의외로 아주 쉽고 간단하다. 아래 한 줄의 코드로 끝난다.
Bomb = GameObject:new()

이제 Bomb의 생성자를 호출하면 인스턴스가 생성되는 거다. 원리는 심화 때 자세히 설명하겠지만 setmetatable이나 __index를 설정한게 상속을 위한 빌드업이다. 이게 무슨 말이냐 하면 이 일련의 코드는 파생 클래스에서 없는 인덱스를 발견하면 베이스 클래스에서 찾으려고 시도하게 만드는 코드이다. 즉, 원래는 Bomb에는 new, update, draw, isCollide 같은 함수가 정의되어 있지 않다. 그러나 호출 시점에서 없는 인덱스는 베이스 클래스에서 찾는다고 했으니 Bomb의 베이스 클래스는 GameObject이고 거기에 있는 함수를 대신 호출하는 거다.

근데 폭탄 객체는 사실 뭐 딱히 정의해줄게 없다. 왜냐하면 기본 동작을 이미 베이스 클래스에서 다 정의를 했기 때문이다. 따라서 Bomb는 사실 GameObject와 다를게 없다. 대신 Bomb 만의 기본 동작을 정의해보자. 폭탄은 눈에 잘 띄어야 하니 빨간색이였으면 좋겠다. 그러면 기본값을 빨간색으로 설정하면 된다. 아래 코드를 Bomb = GameObject:new() 아래에 넣자.
Bomb.color = { red = 1, green = 0, blue = 0, }

7. 폭탄을 배치해보자.

사정상 코드는 아래에 있는 사진으로 대체

Lua는 함수를 호출할 때, 3가지 방법을 쓸 수 있다.
(1). 일반적인 함수 호출은 여러가지 인자를 전달할 때 유용하다.
print("Hello")
(2). 함수의 첫번째 매개변수가 문자열을 받을 수 있을 경우, 함수 호출 괄호없이 문자열만으로 호출할 수 있다.
print "Hello"
(3). 함수의 매개변수의 개수와 상관없이, 테이블 하나를 생성 및 전달하면서 호출할 수 있다.
print {}

Lua는 이름 붙힌 인자를 지원하지 않지만 3번의 방법을 쓰면 비슷한 효과를 낼 수 있고, 또한 넘겨진 인자가 곧 객체의 멤버가 되므로 쉽고 간단하며 가독성도 좋다.

for 문에 대한 깊은 설명은 심화에서...

8. 폭탄을 표시해보자.
love.draw 함수를 다음과 같이 정의해보자.
function love.draw ()
    for _, v in ipairs(bombs) do
        v:draw()
    end
end

ipairs는 테이블의 모든 요소를 열거하는 반복자이다.
pairs와 ipairs의 차이:
pairs는 키로 접근하고, ipairs는 인덱스로 접근한다. pairs는 순서가 보장되지 않는다. ipairs는 숫자 인덱스라는 가정 하에 순서가 보장된다.

이제 폭탄이 게임에 보일 거다. 그러나 폭탄이 움직이진 않는다. 어떻게 해야 움직이게 할 수 있을까?

9. 게임을 갱신해보자.
love.update 함수를 다음과 같이 정의해보자.
function love.update (dt)
    for _, v in ipairs(bombs) do
        v:update(dt)
    end
end

이제 폭탄이 움직이기 시작할거다.

dt는 델타 타임이라는데 사실 나도 잘 모름. 대충 프레임 속도가 게임 갱신에 영향을 끼치지 않도록 하는 보정값이라고만 알고 있으셈. 뭐 예를 들면, 프레임 속도가 너무 높으면 게임 캐릭터가 너무 빨라진다거나...

10. 벽 반사를 구현해보자.
사실 isCollide 함수를 벽 반사에 쓸 수는 없다. 왜냐하면 벽은 원형이 아니기 때문이다. 그래서 별도의 감지 로직을 만들어야 하는데 그냥 화면을 벗어나는 것을 조건으로 해서 방향을 튕겨지게 만들자.

아래에 있는 두개의 함수중에 아무거나 골라다 쓴다. 결과의 차이는 없다. 대충 위에는 뻘짓하면서 의도한 값을 만들어내는 거고 아래는 그냥 심플하게 and or로 처리한거.

https://drive.google.com/file/d/1pXieLeqaQeVIqPbles9YqniYawrAFiz7/view?usp=sharing

전체 소스코드는 여기에 있음. 일단 강의용으로 한 파일에 몰아쓴다고 소스코드를 새로짜다시피 했는데 원래는 어느정도 완성은 되어있음.

개추는 딱히 바라지도 않는데 피드백 있으면 적극적으로 해줬으면 좋겠다 그럼 2편에서 보자~

[개발용더미(sy1mn1t4y83k)]

느낌이 딱 파이게임 정도 인터페이스인듯 하네..

[익명(180.71)]

드디어 love연재 시작했구나

[익명(58.29)]

본인도 써보는 중인데 뭔가 바퀴재발명의 연속같은 느낌 하지만 흥미롭기 때문에 봐줄만함 그보다 글이 너무 모여있어서 읽기 좀 힘드네

[토끼주문(icyselec)]

다음 편부터는 모바일 가독성을 생각해서 문단을 작성하게씀

[ㅇㅇ 1(175.192)]

Love2D는 에디터 없이 스크립트로만 만들어야 함?

[토끼주문(icyselec)]

ㅇㅇ 맞음 대신 타일맵 기반으로 게임을 만든다면 그에 대한 인터페이스만 만들어두고 외부 에디터로 작업할 수는 있음.