Tween Animation 2008011181 천승현.

Presentation on theme: "Tween Animation 2008011181 천승현."— Presentation transcript:

1 Tween Animation 천승현

2 목 차 트윈애니메이션이란? 애니메이션 액션 Interpolator AnimationListener Example & Graphanimation 자유 주제

3 01. 트윈 애니메이션이란? 프레임 애니메이션 =>출력 내용을 주기적으로 변경 (Image 변경) 트윈 애니메이션
=> 수학적 계산을 통해 주기적으로 출력 내용 변경 위치 및 저장파일 : [/res/anim]경로에 저장 ( *.xml ) API를 이용하여 애니메이션 로딩 =>AnimationUtils.loadAnimation(Context context, int id)

4 01. 트윈 애니메이션이란? 트윈 애니메이션 대상과 효과 구분 이름 설명 대상 뷰 위젯이나 레이아웃 그리기 객체
Drawable 객체 효과(action) 위치 이동 translate로 정의하여 위치 이동 확대/축소 Scale로 정의하여 확대/축소 회전 Rotate로 정의하여 회전 투명도 Alpha로 정의하여 투명도 조절

5 02. 애니메이션 액션 Scale 효과 : 확대 / 축소 액션을 하는 애니메이션 Scale 속성
- PivotX, PivotY : 중심 X축, Y축 값 결정 - fromXscale, fromYscale : 시작할 때의 확대/축소 비율 - toXscale, toYscale : 끝날 때 확대/축소 비율 - duration : 지속시간 *좌표 값을 백분율(%)로 가능 (Java => ScaleAnimation 객체를 생성하여 사용)

6 02. 애니메이션 액션 Scale 실행 화면 및 XML 파일 Scale : 확대 Scale2 : 확대 및 축소 Scale
< 실행화면 > Scale Scale2 < XML 소스 > Scale Scale : 확대 Scale2 : 확대 및 축소 < Pivot 위치 >

7 02. 애니메이션 액션 translate 효과 : 위치 이동 액션을 하는 애니메이션 translate 속성
- fromXDelta, fromYDelta : X축,Y축의 시작위치 - toXDelta, toYDelta : X축,Y축의 도착위치 (Java => TranslateAnimation 객체를 생성하여 사용)

8 02. 애니메이션 액션 rotate 효과 : 회전 액션을 하는 애니메이션 rotate 속성
- fromDegrees : 시작각도 - toDegrees : 회전 할 방향 및 각도(음수: 반시계방향, 양수: 시계방향) (Java => RotateAnimation 객체를 생성하여 사용)

9 02. 애니메이션 액션 실행 화면 및 XML 파일 translate : 위치이동 rotate : 회전
< 실행화면 > < XML 소스 > translate : 위치이동 rotate : 회전

10 02. 애니메이션 액션 alpha 효과 : 투명도를 조절하는 애니메이션 alpha 속성
- fromAlpha : 시작할 때 투명도 - toAlpha : 종료될 때 투명도 (Java => AlphaAnimation 객체를 생성하여 사용)

11 02. 애니메이션 액션 실행 화면 및 XML 파일 Alpha : 투명해진 버튼이 나타남 Alpha2 : 버튼이 투명해짐
< 실행화면 > < XML 소스 > Alpha : 투명해진 버튼이 나타남 Alpha2 : 버튼이 투명해짐

12 < Interpolator 속성 >
: 애니메이션의 진행과정과 속도를 제어하는 속성 interpolator 설명 accelerate_interpolator 점점 빠르게 나타나도록 만듬 decelerate_interpolator 점점 느리게 나타나도록 만듬 accelerate_decelerate_interpolator 점점 빠르다가 느리게 만듬 anticipate_interpolator 시작 위치에서 조금 뒤로 당겼다가 시작하도록 만듬 overshoot_interpolator 종료 위치에서 조금 지나쳤다가 종료되도록 만듬 anticipate_overshoot_interpolator 시작 위치에서 조금 뒤로 당겼다가 시작한 후 종료 위치에서 조금 지나쳤다가 종료되도록 만듬 bounce_interpolator 종료 위치에서 튀도록 만듬 < Interpolator 속성 >

13 03. Interpolator 실행화면 Accelerate : 점점 빨라짐 Decelerate : 점점 느려짐
Acc_Dec : 빨라졌다가 느려짐 Aniticipate : 뒤로 튕긴 후 앞으로 이동

14 03. Interpolator 실행화면 Overshoot : 종료위치에서 좀 더 지나침
Anti_over : Anticipate + Overshoot bounce : 종료 위치에서 튐

15 03. Interpolator 구현 방법 < XML로 정의 > < Java로 정의 >

16 04. AnimationListener AnimationListener
: 애니메이션의 시작, 반복, 종료 상태를 알 수 있도록 함 onAnimationStart() : 애니메이션이 시작할 때 호출 onAnimationRepeat() : 애니메이션이 반복 될 때 호출 onAnimationEnd() : 애니메이션이 종료 될 때 호출 < Java 코드로 정의 >

17 05 Example & Graphanimation
AnimationListener 사용 Translate(물방울) Rotate(그네) Translate(배경이미지)

18 06. 자유 주제 움직이는 졸라맨 : 그래프에 애니메이션을 추가하여 움직이는 그래프를 만든 것 프레임 애니메이션
: 그래프에 애니메이션을 추가하여 움직이는 그래프를 만든 것 프레임 애니메이션 Translate 액션 Alpha 액션 AnimationListener(start,end)

19 Do you have Question?