실버라이트 애니메이션 모델에서 가장 아쉬운 점 세 가지를 들어보자면,
1. Path를 따라가는 애니메이션 작성 불가.
2. 임의의 스토리보드를 거꾸로 재생 불가.
3. 스토리보드의 특정 키프레임 혹은 특정 시점에서 발생되는 이벤트 부재.
정도에요.
이 중에서 스토리보드를 거꾸로 재생하는 것은 어느 정도 제한이 있긴 하지만 상당히 간단한 코드로 가능해요.
피터씨가 포스팅한
11. Expression Blend_Menu에서 스토리보드를 거꾸로 재생하는 프로토타입 코드가 있었죠.
우선 동작 완구부터...
별거 없어요. 그냥 Forward하면 정방향으로, Reverse하면 역방향으로 애니메이션이 진행되는 거죠.
위 정도의 애니메이션이라면 그냥 노가다로 거꾸로 진행되는 걸 하나 만들어도 그만이죠.
그러나 애니메이션에 들어가는 키프레임이 수백개가 넘는다면? 악몽이죠. 그걸 거꾸로 돌리고 싶다면...
역방향 재생을 어떻게 할 수 있을지 간단하게 정리해 보자면...
1. 실버라이트는 스토리보드를 거꾸로 재생하는 메서드는 제공하지 않지만 AutoReverse 속성을 true로 설정하면 한번은 정방향으로 재생하고 그 직후 다시 역방향으로 재생할 수 있어요.
2. 또한 실버라이트의 스토리보드는 Seek 메서드를 사용하여 특정 시간으로 점프할 수 있어요.
3. 그러므로 역방향으로 재생할 때에는 스토리보드의 AutoReverse 속성을 true로 설정한 후 스토리보드를 처음부터 시작하고 곧바로 Seek메서드를 호출하여 스토리보드의 총 길이 만큼 이동하면 그 직후 AutoReverse에 의해 스토리보드가 거꾸로 가게 되죠.
이 외에도 범용적으로 사용하기 위해 스토리보드의 실제 총 길이를 계산하는 메서드도 필요하고 정방향으로 재생할 때에는 AutoReverse에 의해 역방향으로 재생되지 않도록 적절한 시점에 Pause를 걸어주는 처리도 필요하죠.
이 모든 처리를 하나의 클래스(ReverseStoryboard)에서 사용할 수 있도록 만들어봤어요.
소스 코드를 다운로드해 보시면 쉽게 이해할 수 있을거에요.
ReverseStoryboardTest.zip사용법은 간단해요.
- // 타겟 스토리보드를 가지고 새 인스턴스 생성
- private ReverseStoryboard rs = new ReverseStoryboard(TargetStoryboard);
- rs.BeginForward(); // 정방향으로 재생
- // 또는...
- rs.BeginReverse(); // 역방향으로 재생
// 타겟 스토리보드를 가지고 새 인스턴스 생성 private ReverseStoryboard rs = new ReverseStoryboard(TargetStoryboard); rs.BeginForward(); // 정방향으로 재생 // 또는... rs.BeginReverse(); // 역방향으로 재생
게다가 빌트인 Storyboard처럼 Completed 이벤트도 지원하고 Completed 이벤트에서 정방향 재생이었는지 역방향 재생이었는지를 알 수 있어요.
