Skip to content

3. 모션

JaeWoong Oh edited this page Jun 19, 2017 · 15 revisions

Motion

Propose에선 Touch 관련 입력을 Motion이라 합니다.
Motion은 방향에 따라 상,하,좌,우 4가지로 구분되며 내부적으로 click,touchUp,drag,fling이 구현되어 있습니다.
Animation은 duration(시간)에 따라 play 되지만 Motion은 MotionDistance(거리)를 기준으로 play합니다.

Motion의 방향

Propose class에는 4가지 Motion class 객체를 가지고 있는데 motionLeft, motionRight, motionUp, motionDown처럼 각각 방향을 의미합니다.
그리고 Motion class는 기본적으로 ObjectAnimator와 ValueAnimator를 매개변수로 받아야만 play할수 있습니다.

propose.motionLeft.play(yourAnimator);  //left
propose.motionRight.play(yourAnimator); //right
propose.motionUp.play(yourAnimator);    //up
propose.motionDown.play(yourAnimator);  //down

  • 아래는 View가 점점 투명해지는 ObjectAnimator를 구현하였습니다.
// create Left alpha ObjectAnimator
ObjectAnimator anim1 = ObjectAnimator.ofFloat(left_txt, View.ALPHA, 1f,0f);
Propose propose1 = new Propose(this);
propose1.motionLeft.play(anim1); //Motion Left
propose1.motionLeft.setMotionDistance(150*Propose.getDensity(this));
propose1.motionLeft.enableTabUp(false).enableFling(false);
left_txt.setOnTouchListener(propose1);

// create Right alpha ObjectAnimator
ObjectAnimator anim2 = ObjectAnimator.ofFloat(right_txt, View.ALPHA, 1f,0f);
Propose propose2 = new Propose(this); 
propose2.motionRight.play(anim2); //Motion Right
propose2.motionRight.setMotionDistance(150*Propose.getDensity(this)); 
propose2.motionRight.enableTabUp(false).enableFling(false);
right_txt.setOnTouchListener(propose2);

왼쪽으로 Drag 했을때 점점 투명해지길 원하면 motionLeft, 오른쪽으로 Drag 했을때 점점 투명해지길 원한다면 motionRight를 선택하면 됩니다.

alpha view
alpha view


Motion Distance

Motion class는 ObjectAnimator와 ValueAnimator를 이용한 click,touchUp,drag,fling이 구현되어 있습니다.
이들중 drag와 fling은 Motion의 Distance를 기준으로 Animation을 play 합니다. 예를들어 Distance를 100dp로 설정하고 50dp를 drag 했다면 animation은 50%가 play됩니다. 70dp를 drag했다면 animation은 70% play가 됩니다.

propose.motionRight.setMotionDistance(100*density); //distance 100dp

이처럼 Distance를 기준으로 Animation 비율에 맞게 play하고 Fling의 경우 가속도에 따라서 남은 Animation을 play해줍니다.

distance test
distance_test
Motion Distance를 설정하지 않았다면 Default로 Window size가 적용 됩니다.


click과 touchUp의 경우 기존 Animation의 Duration을 그대로 play합니다. 예를 들어 click의 경우 ObjectAnimator의 start()를 호출한것과 같습니다. touchUp은 남은 Distance의 비율로 Duration을 환산하여 play됩니다.

duration test
duration_test
Animation의 Duration을 설정하지 않았다면 Default로 Motion Distance가 적용 됩니다.

drag,fling은 MotionDistance에 적용 받고 click과 touchUp은 기존 Animator의 Duration에 적용 받습니다.

Reverse Animation

Motion의 방향으로 Animation이 끝나면 반대방향으로 Reverse Animation이 자동 적용됩니다.

  • SlidingMenu의 open sliding과 close sliding처럼 reverse animation이 필요한 경우가 많습니다. 이런 경우 시작하는 sliding과 되돌아 오는 sliding 두가지를 구현해야 합니다.
    하지만 Propose는 Reverse Animation을 자동으로 지원해줌으로써 하나의 Animation만으로 처리가 가능합니다.

Note : Reverse Animation은 enableReverse(boolean) 메소드로 사용여부를 설정할수 있습니다.