CD플레이어 애니메이션

안녕하세요! 반짝반짝 빛나는 성남미입니다 :-)

블렌드에서는 플래시처럼 애니메이션을 간단하게 설정하는 타임라인이 있습니다.

그러나 애니메이션을 실행시키는데 약간의 수고가 필요합니다.

간단한 애니메이션을 설정하고 로드되었을 때 실행되도록 설정하는 방법을 소개합니다.

 

지금은 많은 사람들이 잘 쓰지 않지만 CD플레이어를 만듭니다.

(무지플레이어 갖고 싶어서 T_T)

 

 

+ 버튼을 클릭하면 애니메이션을 만들 수 있는 스토리보드를 생성합니다.

 

 

+버튼 > 원하는 애니메이션 이름 > ok

 

 

ok버튼을 누르면 애니메이션을 조정할 수 있는 타임라인이 활성화 됩니다.

그리고 화면 상단에는 애니메이션을 기억하는 녹화 버튼이 활성화 됩니다.

 

 

Cd가 돌아가는 애니메이션을 위해 0.4초 뒤에

버튼을 눌러 키프레임을 추가합니다.

 

 

0.4초 뒤에 CD가 0도에서 360도 회전하도록 숫자를 설정합니다.

 

 

스토리보드 설정창에 이름을 클릭하면 오른쪽 Properties 창이 바뀝니다.

 

 

 

CD가 계속 플레이 되도록

RepeatBehaivor의 설정을 Forever로 설정해 무한 반복 되도록 설정합니다.

 

 

화살표 버튼을 눌러서 애니메이션을 제어하는 타임라인에서 빠져나옵니다.

 

 

Project > Run Project 또는 F5버튼을 눌러 실행시켜 봅니다.

 

 

빌드시켜서 봅니다. 내가 만든 애니메이션이 실행되지 않습니다.

애니메이션이 실행되도록 설정을 해줘야 합니다.

 

 

------------------------------------------------------------------------------------------

설정하는 방법을 2가지 소개하겠습니다.

1. 코드 한줄로 애니메이션 실행
2. 비헤이비어를 이용해 애니메이션 실행

------------------------------------------------------------------------------------------

 

 

 

< 코드 한줄로 애니메이션 실행 >

 

메인에서 제일 상단의 LayoutRoot를 클릭합니다.

 

 

그러면 오른쪽 Properties의 창에서 Name에 LayoutRoot가 들어가 있습니다.

코드를 넣을 때 타겟을 LayoutRoot가 되었습니다.

오른쪽

버튼을 누릅니다.

 

 

버튼을 누르면 창이 바뀝니다.

로드 되었을 때 애니메이션이 실행되도록 Loaded에 start라고 써줍니다.

 

 

MainPage.xaml의 왼쪽 화살표를 펼치면

MainPage.xaml.cs가 있습니다, 더블클릭 하면 코드를 설정할 수 있는 창이 뜹니다.

 

 

빨간색으로 친 부분에 스토리보드.Begin(); 이렇게 넣어줍니다.

 

빌드를 해서 보니 CD가 무한대로 계속 돌아가는 것을 확인할 수 있습니다.

 

 

 

< 비헤이비어를 이용해 애니메이션 실행 >

애니메이션을 만든 후 ControlStoryboardAction을 꺼냅니다.

 

 

LayoutRoot아래에 ControlStoryboardAction 비헤이비어를 넣습니다.

 

 

비헤이비어를 설정할 수 있도록 오른쪽에 창이 뜹니다.

Loded(로드) 되었을 때 player(애니메이션 스토리보드이름)가 Play(실행) 되어라.

이렇게 설정을 해주었습니다.

 

 

빌드를 해서 보니 CD가 무한대로 계속 돌아가는 것을 확인할 수 있습니다.