[Day 18] AnimationStop 이벤트

AnimationStop

애니메이션이 시작할때와 끝날때를 알아보았는데 AnimationStop 뭘까요? 이 이벤트는 애니메이션이 y:1000 위치에 가기전에 애니메이션이 중단될때 발생하는 이벤트입니다. 먼저 테스트를 위해 버튼으로 사용할 레이어를 한개 추가하겠습니다. 이 버튼을 누르면 애니메이션이 도중에 중단하는 기능을 수행합니다.

(1) ‘Insert’ - ‘Layer’ 메뉴를 클릭합니다. 그러면 ‘layerA’ 레이어가 생성이 됩니다. 이 레이어의 이름을 ‘btnBallStop’ 이라고 변경합니다.

(2) ‘Insert’ - ‘Event’ - ‘btnBallStop’ - ‘Click’ - ‘Click’ 메뉴를 클릭해서 ‘btnBallStop’ 레이어에 버튼기능을 추가합니다. 그리고 이 버튼의 기능을 위해서 ball.animateStop() 라는 코드를 입력해줍니다.

(3) 그리고 ‘ball’ 의 애니메이션이 중단될때를 감지하기 위한 ‘AnimationStop’ 이벤트를 ‘Insert’ - ‘Event’ - ‘ball’ - ‘Animation’ - ‘AnimationStop’ 메뉴를 눌러 추가해주고 이벤트가 호출될 때 수행하는 코드로 print(‘Animation stop!’) 을 입력해줍니다.

(4) 애니메이션이 짧아서 테스트가 어려우므로 ball.animate 구문아래에 time:3 속성을 추가합니다.

(5) 테스트를 위해 ‘ball’ 레이어를 클릭하고 애니메이션이 끝나기전에 ‘btnBallStop’ 레이어를 클릭합니다. 그러면 애니메이션이 중단되고 AnimationStop 이벤트가 실행되어 ‘Animation stop!’ 이라는 테스트 구문이 출력됩니다.

(6) 한가지 주의할 점은 애니메이션이 끝날 때도 AnimationStop 이벤트가 호출된다는 점입니다. 왜냐하면 AnimationStop 이벤트는 애니메이션이 중간에 그만두는지 실제 끝났기 때문에 그만두는지 감지하지 못하기 때문입니다. 그래서 AnimationStop 이벤트와 AnimationEnd 이벤트를 동시에 사용할때는 주의하시기 바랍니다.