화면 전환 효과 - 트랜지션 (2) 활용

트랜지션 클래스를 활용하면 기존 트랜지션 효과 외에 복합적인 트랜지션도 만들 수 있습니다.

간단한 트랜지션 클래스

미리 마련된 트랜지션 효과를 이용하는 대신 자잘한 부분을 수정하고 싶다면 아래 목록에 있는 트랜지션을 활용하면 됩니다.
트랜지션 클래스 활용은 대략 이렇게 하면 됩니다.

# 자주 쓰지 않는다면 아래처럼만 적어도 됩니다. show eileen with Dissolve(1.0) #클래스 명과 적당한 값을 입력한다. # 자주 쓰려는 트랜지션이라면 아래처럼 변수를 만들고 그곳에 배정한 뒤에 써야 합니다. init python: dissolve1 = Dissolve(1.) #그 뒤 with 문과 함께 사용하면 됩니다. show eileen with dissolve1

되도록이면 여기 적힌 스크립트 복붙해서 한번 눈으로 확인해보시는 쪽을 추천합니다.

Dissolve

Dissolve(time, alpha = False , time_warp)
디졸브 효과를 만드는 클래스입니다. time 에 0.5를 입력하면 기존 dissolve 트랜지션과 같은 트랜지션을 만듭니다.

time - 트랜지션 효과가 적용되는 시간. 1.0이라 쓰면 디졸브 트랜지션이 1초 동안 나타납니다.

alpha - True면 이 트랜지션을 적용한 이미지의 알파값이 바뀌는 식으로 트랜지션이 작동합니다. 예를 들면 포토샵 등에서 윗 레이어의 투명도를 바꾸는 식으로 화면 전환 효과가 일어난다는 뜻입니다. False면 이 트랜지션이 적용되었을 때의 화면으로 트랜지션 효과를 만듭니다. 미리 예측된 결과물로 전환 효과를 만들기 때문에 False로 설정하는 쪽이 효과적으로 작동한다고 하는군요... 테스트해봤지만 차이를 잘 모르겠습니다;.. 어쨌든 되도록 False로 설정해주는 쪽이 좋겠네요.

time_warp - 0.0에서 1.0 사이의 값을 받아 같은 범위의 값을 반환하는 함수 이름을 적어야 합니다. 음. 예를 들면 ease 효과를 쓸 때처럼 나타나거나 사라질 때 처음 몇 초간은 확 사라지다가 나중에는 천천히 사라져가는 그런 효과를 낼 수 있겠죠.

여기 입력하는 함수에 따라서 천차만별의 디졸브효과를 만들 수 있겠습니다..만 일회성으로 쓸 트랜지션 효과라면 여기에 쓸 함수를 짜느니 그냥 ATL효과를 이용하는 게 나을 것 같습니다.. 게다가 저처럼 삼각함수는 다 잊어버려서(.. 코사인이고 뭐고 죄다 모른다면 식을 어떻게 만들어야 할지도 감 안 잡힐테고요...

init python: def ease_in_time_warp(x): import math return math.cos((1.0 - x) * math.pi / 2.0) dissolve = Dissolve(.5) #기본 디졸브 dissolve1 = Dissolve(1) # 1초간 디졸브 dissolve2 = Dissolve(1, alpha = False, time_warp=ease_in_time_warp) # ease_in_time_warp 함수를 이용하여 처음에는 천천히 나타났/사라졌다가 시간이 지날수록 빨리 나타나/사라지는 디졸브 효과 label start: scene room night show eileen happy at left with dissolve2 '' hide eileen with dissolve2 ''

Fade

Fade(out_time, hold_time, in_time, color='#000000')
페이드 효과를 만드는 클래스입니다. 이 클래스로 만들어진 트랜지션이 바로 fade입니다. fade = Fade(.5, 0, .5) 라고 입력하면 기본 페이드 트랜지션, 검은색으로 바뀌었다가 원래화면으로 돌아오는 트랜지션이 만들어집니다.

color - 이 트랜지션을 사용했을 때 바뀔 화면 색을 지정하는 부분입니다. 색상값을 문자열로 입력받습니다. 만약에 '#ffffff'라고 입력하면 페이드 아웃이 아니라 플래시 느낌의 트랜지션이 만들어집니다.
out_time - 화면이 color에 지정한 색으로 바뀌는 데 걸리는 시간을 지정합니다.
hold_time - color에서 지정한 색으로 화면을 몇 초 동안 유지할지 지정합니다.
in_time - color에서 지정한 색이 띄워졌던 화면에서 트랜지션 효과를 지정하고 나서 바뀔 화면으로 전환하는 데 걸리는 시간을 지정합니다.

# 검은 화면으로 페이드아웃했다가 새 화면으로 전환합니다. # 기본 페이드 트랜지션이죠. define fade = Fade(0.5, 0.0, 0.5) # 검은색 화면에서 1초 멈춥니다. define fadehold = Fade(0.5, 1.0, 0.5) # 카메라 플래시 - 순식간에 하얀 화면을 표시했다가 원래 장면으로 돌아간다. # 0.1초만에 흰색(#fff)으로 화면이 바뀌었다가 0.0초 멈추고, 0.5만에 게임 화면으로 돌아갑니다. define flash = Fade(0.1, 0.0, 0.5, color="#fff")

Pause

Pause(delay)
화면을 delay동안 멈춥니다. 물론 멈춘 동안이라도 사용자가 클릭하면 다음 진행상황으로 넘어갑니다.

delay - 화면 멈출 시간. 단위는 초입니다.

init python: pause = Pause(.5) # 0.5 초동안 화면을 멈춥니다. 자주 쓴다면 이렇게 퍼즈 트랜지션을 따로 지정해둡시다. # 자주 쓰는데 지정을 안 해놓으면 멈춤 효과를 쓰고 싶을 때마다 일일히 클래스 이름과 시간을 적어야 합니다.. label start: scene bg room night show eileen with pause # 하면 되는 걸 지정을 안 하면 # with Pause(.5) 라고 일일히 지정해야 합니다..

Pixellate

Pixellate(time, step)
이전 화면을 픽셀화한 다음에 새 화면으로 전환합니다. 이 클래스로 만들어진 트랜지션이 pixellate 입니다.

time - 화면 전환하는 데 걸리는 시간입니다.
step - 픽셀화를 몇 단계에 걸쳐 진행할지 결정하는 값입니다. 픽셀 크기는 전단계의 2배로 커집니다. 예를 들면 이 값을 5로 입력했을 때 화면 전환할 때 이전 화면을 5번 걸쳐 픽셀화 하며, 화면에 5번째로 표시되는 픽셀의 크기는 32입니다. (2 x 2 x 2 x 2 x 2 = 32)

init python: pixellate = Pixellate(1.0, 5) # 기본 pixellate 트랜지션. 1초동안 5단계의 픽셀화를 걸쳐 화면을 전환한다. pix2 = Pixellate(.5, 10) # .5초동안 픽셀 크기를 2의 10만큼 키워서 화면 전환하는 트랜지션. # 직접 써보시면 꽤나 다이나믹한 화면 전환 효과를 볼 수 있습니다;

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)
사각형을 움직이는 식으로 트랜지션 효과를 만드는 클래스입니다. slide 계열, irisin/out , wipe 계열의 트랜지션은 모두 이 클래스로 만든 트랜지션입니다.

time - 트랜지션하는 데 걸리는 시간입니다.
mode - 여기에 slide 계열/ irisin/out, wipe 계열 트랜지션의 이름을 적고, time값을 바꾸면 해당 트랜지션이 적용되는 시간을 정할 수 있습니다.
예를 들어 CropMove(2.0, "irisin") 이라고 적으면 2초 동안 irisin 트랜지션을 적용하는 새로운 트랜지션을 만들게 됩니다.

mode 뒤에 나와있는 startcrop등의 값은 mode 값을 "custom" 이라고 입력해야 바꿀 수 있습니다. 설명하려면 조금 길어서 자세한 건 다음 글에서 다루겠습니다.

# CropMove 를 이용한 기본 트랜지션은 전부 이런 식으로 정의되어있습니다. # 렌파이 설치 폴더/common/00definitions.rpy 에 적힌 스크립트입니다. wiperight = CropMove(1.0, "wiperight") wipeleft = CropMove(1.0, "wipeleft") wipeup = CropMove(1.0, "wipeup") wipedown = CropMove(1.0, "wipedown") slideright = CropMove(1.0, "slideright") slideleft = CropMove(1.0, "slideleft") slideup = CropMove(1.0, "slideup") slidedown = CropMove(1.0, "slidedown") slideawayright = CropMove(1.0, "slideawayright") slideawayleft = CropMove(1.0, "slideawayleft") slideawayup = CropMove(1.0, "slideawayup") slideawaydown = CropMove(1.0, "slideawaydown") irisout = CropMove(1.0, "irisout") irisin = CropMove(1.0, "irisin")

합성 트랜지션 클래스

트랜지션을 다수 이용하여 또다른 트랜지션을 만드는 클래스 목록입니다.

MultipleTransition

MultipleTransition(args)
트랜지션을 여러 개 입력하면 입력한 트랜지션을 순서대로 보여주는 트랜지션을 만듭니다.

args - 값을 여러개 받습니다.

홀수번째, 그러니까 첫 번째, 세 번째, 다섯 번째.. 등에 적은 값은 True 나 False 나  디스플레이어블이어야 합니다. True는 이전 장면, False는 새로 표시할 장면을 뜻합니다.

짝수번째, 두 번째, 네 번째, 여섯 번째에 적는 값은 트랜지션 이름이어야 합니다. 물론 기존 트랜지션 이름을 적을 수도 있고 트랜지션 클래스로 만든 커스텀 트랜지션도 입력할 수 있습니다.

값의 갯수는 홀수이어야 합니다.

그림으로 예를 들자면 MultipleTransition에는 이런 느낌으로 값을 입력해야 합니다.

define logodissolve = MultipleTransition( False, Dissolve(0.5) # 이전 화면에서 logo.jpg 를 표시할 때 디졸브 효과를 적용한 다음, "logo.jpg", NoTransition(1.0), # logo를 1.0 초 동안 내비두다가, "logo.jpg", dissolve, # logo.jpg 에서 새 화면을 표시할 때 디졸브 효과를 적용하여 새 화면을 표시합니다. True)

ComposeTransition

ComposeTransition(trans, before, after)
세 개의 트랜지션을 같은 타이밍에 적용하는 트랜지션입니다.

before - 사라지는 화면에 적용할 트랜지션 이름입니다.
after - 새로 나타날 화면에 적용할 트랜지션 이름입니다.
trans - before/after 를 적용할 때 동시에 적용할 트랜지션 이름입니다.... 이건 눈으로 확인하시는 쪽이 이해하기 빠르실 것 같습니다;

moveinoutdissolve = ComposeTransition(dissolve, before=moveoutleft, after=moveinright) label start: scene room maid show sylvie normal '' hide sylvie show eileen happy at left with moveinoutdissolve '' # dissolve 트랜지션이 적용되면서 # 실비가 왼쪽으로 이동하면서 화면 밖으로 나가버리고 moveoutleft # 아이린이 오른쪽에서 들어옵니다. moveinright # 이 모든 일이 동시에 일어납니다;