본문 바로가기

렌파이/연출하기

화면 전환 효과 - 트랜지션 (3) 심화

심화라고 적었지만 별 건 아닙니다. 다만 제가 써야할 설명이 많아서 따로 분류했을 뿐입니다; 물론 그만큼 조금 복잡하기도 합니다.

디졸브 계열

ImageDissolve

ImageDissolve(image, time, ramplen=8, reverse=False, alpha=True, time_warp=None)

설정한 이미지에 따라 다양한 모양의 디졸브를 만들 수 있는 트랜지션 클래스입니다. 기본 트랜지션인 squares 나 blinds 는 모두 ImageDissolve 클래스로 만들어진 트랜지션입니다.

image - 디졸브 트랜지션에 적용할 이미지. 밑바탕이라고 보시면 됩니다. 보통은 흑백 이미지를 사용합니다. 이 클래스로 만든 트랜지션을 사용하면 이 이미지의 하얀색 픽셀과 겹쳐있는 게임 화면의 픽셀이 먼저 사라지고, 검은색 픽셀과 겹쳐있는 픽셀은 나중에 사라집니다... 눈으로 확인하시는 게 빠릅니다. 아래 나와있는 스크립트와 파일을 복사해서 테스트해보세요.
time - 화면 전환 하는 데 걸리는 시간입니다.
ramplen - 2의 배수만 적을 수 있습니다.. 예를 들어 여기 8을 입력했다고 한다면, 트랜지션할 때 하얀색 픽셀보다 8 단계 더 어두운 회색 픽셀 부분이 하얀색 픽셀과 동시에 디졸브됩니다... 역시 말로는 한계가 있으니 직접 눈으로 확인해보시는 게 빠릅니다.
reverse - False 면 흰색 픽셀부터, True면 검은색 픽셀부터 디졸브효과가 먹히게 됩니다.
time_warp - 0.0에서 1.0까지의 값을 반환하는 함수 이름을 적거나 None을 적어야 합니다. Dissolve에서 설명한것과 같습니다.

800x600 idissolve.jpg





AlphaDissolve

AlphaDissolve(control, delay=0.0, alpha=False, reverse=False)

원리는 ImageDissolve 와 비슷합니다..만 이쪽은 좀 더 진보된(?) 클래스입니다. 흰색, 검은색 픽셀을 이용하여 디졸브를 만드는 ImageDissolve 클래스와 달리 AlphaDissolve는 이름그대로 알파값.. 즉 투명도를 기준으로 디졸브 효과를 만듭니다. 디졸브효과는 불투명한 픽셀을 기준으로 일어납니다.
거기에 더해서, 알파디졸브에는 트랜지션을 입력해야합니다. ATL로 움직임을 지정한 이미지로 디졸브 효과를 만들 수 있다는 뜻입니다.

control - 디졸브 효과에 사용할 트랜스폼 이름을 적습니다. ATL로 만든 트랜스폼 이름을 여기 적으면 됩니다.
delay - 트랜지션에 걸리는 시간
alpha - True면 새로 표시하려는 이미지와 합성되고 False 면 이미지가 불투명 ...하다는데 무슨 상관이 있는지는 잘 모르겠습니다; 기본값은 False입니다. control에서 지정한 트랜스폼에 불투명한 부분을 이용해 이전 화면과 새 화면에 알파값을 적용하여 트랜지션을 한다는 뭐 그런 것 같습니다; Dissolve의 alpha와 같은 기능을 하는 듯합니다. 저는 딱히 차이를 못 느끼겠네요.
reverse - True면 불투명이 아닌 투명한 픽셀을 활용해서 다음 화면으로 디졸브합니다. 기본값은 False입니다.

spotlight.png




무브 계열

MoveTransition

MoveTransition(delay, enter=None, leave=None, old=False, layers=['master'], time_warp=None, enter_time_warp=None, leave_time_warp=None)

말 그대로 이미지를 이동하는 트랜지션을 만드는 클래스입니다. 이 클래스로 ease 나 move 등의 트랜지션이 만들어졌습니다.
같은 이미지 태그를 지닌 두 이미지를 이용하여 이동하는 듯한 효과를 만듭니다.

delay - 트랜지션에 걸리는 시간
enter -  트랜스폼 이름을 적어야 합니다. 트랜스폼에는 이미지가 화면에 최종적으로 나타날 위치가 적혀있어야 합니다.
leave - 트랜스폼 이름을 적어야 합니다. 트랜스폼에는 이미지가 화면에 최종적으로 나타날 위치가 적혀있어야 합니다.
enter와 leave는 기본값 None으로 설정하면 이전 이미지의 위치값과 새 이미지의 위치값을 알아서 받는 모양입니다.

show eileen happy (at center)
show eileen concerned at right with move

라고 한다면 이 때 move에는 center 값과 right 값이 자동으로 각각 enter/leave에 입력되는 것입니다.

old - True로 하면 트랜지션을 적용한 이미지가 아니라 이전 이미지를 움직입니다.
layers - 눈에는 안 보이지만 렌파이에도 레이어가 있습니다. 이미지는 master  라는 레이어에 모두 표시되므로 특별한 경우가 아니라면 건드릴 필요는 없을 것 같습니다.
time_warp / enter_time_warp / leave_time_warp - 0.0 - 1.0 범위의 값을 반환하는 함수 이름을 적어야 합니다. 이미지가 게임 화면 내에서 이동하거나 게임 화면으로 진입하거나 화면 밖으로 사라질 때 적용할 함수이름을 적으면 됩니다.

move 와 ease 트랜지션이 차이나는 게 바로 이부분때문입니다. ease 에는 이 time_warp/enter/leave_time_warp 계열에 적절한 함수를 입력해서 트랜지션에 가속도를 붙이거나 한 것이죠.

모두 기본값으로 두면 기존 트랜지션인 move와 똑같이 기능합니다.

CropMove

CropMove(time, mode="slideright", startcrop=(0.0, 0.0, 0.0, 1.0), startpos=(0.0, 0.0), endcrop=(0.0, 0.0, 1.0, 1.0), endpos=(0.0, 0.0), topnew=True)

mode를 "custom"으로 입력하면 CropMove클래스를 이용한 새로운 트랜지션을 만들 수 있습니다.

time - 트랜지션에 걸리는 시간
mode - "custom"으로 입력하면 새로운 트랜지션을 만들 수 있도록 설정값을 변경할 수 있습니다.
startcrop - 트랜지션이 시작될 때의 최초 사각형을 지정할 수 있습니다. 값 네 개가 적힌 튜플을 적어야 합니다. 값은 각각 사각형의 x, y, 가로길이, 세로길이를 뜻합니다.

예를 들면 irisin의 경우 화면 전체가 점점 가운데로 네모나게 수렴하는 식으로 화면전환이 됩니다. 이럴 경우 이 트랜지션의 맨 처음 상태는 화면 전체 크기를 의미하는 값, 즉 (0.0, 0.0, 1.0, 1.0) 을 입력해야합니다. 여기서는 화면 전체의 크기가 게임 해상도에 따라 달라질 수 있으므로 부동소수점값을 입력하여 비율로 x, y좌표값과 길이들을 나타냈습니다.

startpos - startcrop에서 정한 사각형의 초기 위치를 뜻하는 튜플값을 적어야합니다. 튜플 안의 값은 각각 x와 y를 뜻합니다.

irisin의 예를 계속 들면, 아까 정한 사각형 크기가 화면 전체를 의미하니까 이 값을 따로 바꿀 필요 없이 좌측 상단 모서리를 의미하는 (0.0, 0.0)을 적어주면 되겠죠.

endcrop - 화면 전환을 마쳤을 때의 최종 사각형을 지정할 수 있습니다. irisin을 예로 들면, 이전 화면은 가운데로 수렴해서 완전히 다음 화면으로 넘어가게 되므로 x,y,가로길이, 세로길이를 (0.5, 0.5, 0.0, 0.0) 라고 입력해주면 됩니다.
endpos - 트랜지션 사각형의 종료 위치를 입력합니다. irisin의 경우 이 값이 (0.5, 0.5)로 입력되어있습니다.

CropMove로는 이전 화면과 새 화면을 사각형의 형태로 전환하는 매개물을 만드는 것이라고 생각하시면 이해하기 쉬우실 겁니다. start/endcrop으로는 이 사각형의 크기와 위치를, start/endpos 로는 이 사각형의 최초/최후 위치를 지정한다고 생각하시면 됩니다.

topnew - 이전 화면을 사라지게 할 때 사용할 트랜지션을 만든다면 True로, 새 화면을 나타낼 때 사용할 트랜지션을 만든다면 False로 설정하면 됩니다.



Move계열의 트랜지션을 만드는 함수

define.move_transitions

define.move_transitions(prefix, delay, time_warp=None, in_time_warp=None, out_time_warp=None, old=False, layers=['master'], **kwargs)

move나 ease 트랜지션의 경우 기본 move/ease 트랜지션 외에도 movein*, moveout* 등 여러가지 트랜지션이 있습니다. 이렇게 같은 계열의 트랜지션을 여럿 만들 때 사용하는 함수입니다. move/ease 계열 트랜지션은 전부 이 함수로 만들어진 트랜지션입니다.

prefix - 트랜지션 계열을 대표할 이름을 적으면 됩니다. 예를 들어 moveinleft 든 moveouttop 이든 전부 앞에 move가 붙어있는데, 이렇게 여러 트랜지션의 앞에 붙일 이름을 적으면 됩니다.
delay - 트랜지션에 걸리는 시간입니다.
time_warp / in_time_warp / out_time_warp - 시간에 따라 얼마만큼 이동할지를 결정합니다. 0.0에서 1.0까지 값을 반환하는 함수 이름을 적어야 합니다. 아까도 적었지만 ease와 move가 차이나는 이유가 바로 ease 트랜지션에는 이동을 감속시키거나 가속시킬 함수를 이 항목에 입력했기 때문입니다. 각각 그림이 화면 내에서 이동하거나, 화면 안으로 진입하거나, 화면 밖으로 사라질 때 적용됩니다.
old - True면 이전 디스플레이어블을 이동시킵니다.
layers - 트랜지션을 적용할 레이어입니다.