Android 속성 애니메이션 사용 설명서

11434 단어
속성 애니메이션의 분류
ValueAnimator
ValueAnimator는 전체 속성 애니메이션 메커니즘에서 가장 핵심적인 클래스로 우리가 지정한 초기 값, 끝 값과 애니메이션 시간, 내부를 통해 애니메이션 과정을 계산하여 부드러운 이동 효과를 완성한다.또한 애니메이션의 재생 횟수, 패턴, 감청 설정 등의 기능을 관리한다.이것은 가장 기초적인 핵심 클래스로View를 직접 조작할 수 없다. 그가 조작한 것은 값이고 조작한 대상도 통상적으로 값을 포장하는 대상이다.그러나 이 값의 변화에 따라 View의 애니메이션 효과를 실현할 수 있습니다.
일반적인 방법:
ValueAnimator.Float/ofint는 초기값과 끝값을 설정하고 여러 개의 파라미터를 전송할 수 있으며 실행할 때 마지막 값으로 순서대로 변경합니다 setDuration () 애니메이션 시간 설정 addUpdate Listener는 애니메이션 설정을 감청합니다. 애니메이션의 현재 상태를 수시로 가져올 수 있습니다 setStartDelay () 애니메이션 지연 시간 설정 setRepeatCount ()/Mode () 설정 중복 횟수, 중복 모드 (RESTART, REVERESE)
ValueAnimator가 애니메이션 효과를 실현하는 데는 위의 방법 외에 ValueAnimator가 보기의 애니메이션 효과를 실현하는 데 사용할 수 있는 약간 복잡한 ofObject() 방법이 있다.초기 값과 끝 값 외에 TypeEvaluator가 필요한 세 개의 매개 변수를 수신합니다.
Type Evaluator는 미끄럼 과정을 계산하는 인터페이스입니다. ofFloat/ofint를 보세요. 그들 내부에서도 이 인터페이스를 실현했습니다. 우리가 대상을 조작할 때 계산 방법을 스스로 정의해야 합니다. 그는 세 개의 파라미터가 있는데 첫 번째는 완성도를 표시하고 두 번째는 시작과 끝 값을 표시합니다.
다음은 Value Animator가 View를 어떻게 조작하는지 예를 들어 보여 줍니다.Value (x, y 방법의 좌표 값) 를 저장하기 위해 먼저class를 정의합니다. View의 이동은 좌표를 바꾸는 것으로 이루어집니다.
public class Cordinate {
    private float x;
    private float y;
    public Cordinate(float x, float y) {        
        this.x = x;
        this.y = y;
    }
    public float getX() {
        return x;
    }
    public float getY() {
        return y;
    }
}

그런 다음 원형 이동을 위한 View를 사용자 정의합니다.
public class ValueAnimatorDemoView extends View{
    private Paint mPaint;
    private Cordinate curCordinate;
    public ValueAnimatorDemoView(Context context) {
        this(context,null);
        // TODO Auto-generated constructor stub
    }
    public ValueAnimatorDemoView(Context context, AttributeSet attrs) {
        super(context, attrs);
        // TODO Auto-generated constructor stub
        mPaint = new Paint();
        mPaint.setColor(Color.RED);
    }
      @Override  
        protected void onDraw(Canvas canvas) {  
            if (curCordinate == null) {  
                curCordinate = new Cordinate(50 , 50);  
                drawCircle(canvas);  
                startAnimation();  
            } else {  
                drawCircle(canvas);  
            }  
        }  
        private void drawCircle(Canvas canvas) {  
            float x = curCordinate.getX();  
            float y = curCordinate.getY();  
            canvas.drawCircle(x, y, 50, mPaint);  
        }  
        private void startAnimation() {  
            Cordinate startPoint = new Cordinate(50, 50);  
            Cordinate endPoint = new Cordinate(getWidth() - 50, getHeight() - 50);  
            ValueAnimator anim = ValueAnimator.ofObject(new MyEvalutor(), startPoint, endPoint);  
            anim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {  
                @Override  
                public void onAnimationUpdate(ValueAnimator animation) {  
                    curCordinate = (Cordinate) animation.getAnimatedValue();  
                    invalidate();  
                }  
            });  
            anim.setDuration(5000);  
            anim.start();  
        }  
        private class MyEvalutor implements TypeEvaluator{
            @Override
            public Cordinate evaluate(float fraction, Cordinate startValue,
                    Cordinate endValue) {
                // TODO Auto-generated method stub
                Cordinate startPoint = (Cordinate) startValue;
                Cordinate endPoint = (Cordinate) endValue;
                float x = startPoint.getX() + fraction*(endPoint.getX() -startPoint.getX() );
                float y = startPoint.getY() + fraction*(endPoint.getY() -startPoint.getY() );
                Cordinate curpoint = new Cordinate(x,y);
                return curpoint;
            }
        }
}

onDraw 방법에서curCordinate 대상이null이면 첫 번째 운행을 의미한다. 새 좌표인 Cordinate 대상은 초기값이 50,50이고 화면의 X/Y 좌표가 50,50인 곳(왼쪽 상단)에 원형을 그리고 반경이 50이다.
그림이 완성되면 애니메이션을 시작합니다. 첫 번째 단계는 왼쪽 위와 오른쪽 아래를 정의하고 애니메이션을 시작합니다.주의해야 할 것은 여기에 Update Listener를 추가하여 현재 좌표의 값을 실시간으로 감청한 다음에 invalidate는 현재 좌표에 따라 원형을 그리고 현재 좌표는 My Evalutor 방법을 통해 계산된 일련의 점차적으로 변화하는 값으로 이러한 값을 통해View를 그리면 전체 애니메이션 효과를 완성할 수 있다.
ObjectAnimator
ObjectAnimator는 ValueAnimator에서 상속되며, View의 모든 속성을 조작할 수 있습니다.예를 들어, 하나의 View를 일반에서 전체 투명으로 변환한 다음 전체 투명에서 일반으로 변환하면 다음과 같이 쓸 수 있습니다.
ObjectAnimator animator = ObjectAnimator.ofFloat(textview, "alpha", 1f, 0f, 1f);  
animator.setDuration(5000);  
animator.start();  

배경색 변경 예:
ValueAnimator colorAnim = ObjectAnimator.ofInt(mButton,"backgroundColor", 0xFFFF8080, 0xFF8080FF);
            colorAnim.setDuration(5000);
            colorAnim.setEvaluator(new ArgbEvaluator());
            colorAnim.start();

여기에 시스템의 Argb Evaluator를 이용하여 색의 변화를 계산하는데, 물론 우리도 스스로 변화 방법을 정의할 수 있다.또한 주의해야 할 것은 두 번째 속성이다. 그 원리는 조작된 대상에 대응하는 setXXX와 getXX 방법을 찾는 것이다. XXX는 우리가 입력한 매개 변수이다.일반적으로 사용되는 매개변수는 다음과 같습니다.
rotation,rotationX/Y,translationX/Y,scalex/Y,alpha,color,backgroundColor 등등
이외에도 우리는 스스로 파라미터를 정의할 수 있지만 사용자 정의 파라미터는 반드시 setXXX와 getXX 방법이 있어야 하며 이 두 가지 방법에서 애니메이션이 조작하는 대상에 대한 속성 설정을 실현해야 한다는 것을 주의해야 한다.
AnimatorSet
AnimatorSet은 일련의 애니메이션 모음이며 조합 애니메이션이라고도 할 수 있습니다.
예를 들면 다음과 같습니다.
AnimatorSet animSet = new AnimatorSet();  
            animSet.playTogether(
            ObjectAnimator.ofFloat(mButton, "translationX", -500f, 0f),
            ObjectAnimator.ofFloat(mButton, "rotation", 0f, 360f),
            ObjectAnimator.ofFloat(mButton, "alpha", 1f, 0f, 1f));


Animator Set은 Animator Set을 되돌려 주는 Play 방법을 제공합니다.다음 작업을 수행할 수 있는 Builder 객체
after(Animator anim)가 들어오는 애니메이션에 기존 애니메이션을 삽입한 후 after(long delay)를 실행하여 기존 애니메이션의 지연 시간을 밀리초 단위로 지정한 후 before(Animator anim)를 실행하여 들어오는 애니메이션에 기존 애니메이션을 삽입하기 전에 with(Animator anim)를 실행하여 기존 애니메이션과 들어오는 애니메이션을 동시에 실행합니다.
ObjectAnimator moveIn = ObjectAnimator.ofFloat(textview, "translationX", -500f, 0f);  
ObjectAnimator rotate = ObjectAnimator.ofFloat(textview, "rotation", 0f, 360f);  
ObjectAnimator fadeInOut = ObjectAnimator.ofFloat(textview, "alpha", 1f, 0f, 1f);  
AnimatorSet animSet = new AnimatorSet();  
animSet.play(rotate).with(fadeInOut).after(moveIn);  
animSet.setDuration(5000);  
animSet.start();  

위 코드는 회전 및 페이드 아웃 애니메이션이 동시에 진행되고 변환 애니메이션 뒤에 삽입됨을 나타냅니다.
XML 애니메이션
XML 애니메이션은 속성 애니메이션의 각 속성을 XML에서 설정하는 것으로 코드에서 설정한 것과 기능이 같으며 중복 참조가 가능하다는 것이 가장 큰 장점이다.XML 애니메이션을 사용할 때, 우선res 아래에 애니메이션 폴더를 새로 만듭니다. 모든 속성 애니메이션 XML은 이 폴더 아래에 있습니다.속성 설정 애니메이션에는 다음과 같은 탭이 있습니다.
: ValueAnimator : ObjectAnimator : AnimatorSet
예는 다음과 같습니다.
   
      
      
  
      
          
          
          
              
              
              
              
          
          


속성 소개:android:ordering 애니메이션의 실행 순서, 기본값은 together로 각 애니메이션이 동시에 실행되는 것을 나타낸다.sequentially는 순서대로 실행되는 것을 표시합니다.android:propertyName 애니메이션의 동작 유형,alpha,color,translateX 등android:valueType 속성 유형,intType와floatType 두 가지 옵션이 있습니다.android:valueFrom/To 초기값과 끝값android:startOffset 애니메이션이 시작된 후 XML 실행을 얼마나 지연시키는지 방법은 다음과 같습니다.
Animator animator = AnimatorInflater.loadAnimator(context, R.animator.anim_file);  
//AnimatorSet set = (AnimatorSet ) AnimatorInflater.loadAnimator(context, R.animator.anim_xml);  
animator.setTarget(view);  
animator.start();

Animator 스니퍼
Animator 클래스에서 Animator Listener () 를 매개 변수로 받아서 애니메이션의 시작, 끝, 중복, 취소에 대한 감청을 실현할 수 있습니다.
anim.addListener(new AnimatorListener() {
            @Override
            public void onAnimationStart(Animator animation) {
                // TODO Auto-generated method stub
            }
            @Override
            public void onAnimationRepeat(Animator animation) {
                // TODO Auto-generated method stub
            }
            @Override
            public void onAnimationEnd(Animator animation) {
                // TODO Auto-generated method stub
            }
            @Override
            public void onAnimationCancel(Animator animation) {
                // TODO Auto-generated method stub
            }
        });

만약에 어떤 사건에 대한 감청만 가능하다면 Animator Listener Adapter () 를 사용할 수 있습니다. 이것은 내부에서 Listener의 방법을 실현했고, 우리는 필요에 따라 자신이 필요로 하는 방법을 복기하면 됩니다.
anim.addListener(new AnimatorListenerAdapter() {  
    @Override  
    public void onAnimationEnd(Animator animation) {  
    }  
});  

Interpolator 및 Evaluator
이 두 물건을 번역하면 차치기와 평가기라고 할 수 있다.모션 트윈부터 Interpolator 인터페이스가 지원되고 속성 애니메이션에 TimeInterpolator 인터페이스가 추가되었으며 다음과 같은 몇 가지 일반적인 구현이 있습니다.
Accelerate Interpolator: 가속 차치기, 운행 속도가 점점 빨라지는Decelerate Interpolator, 감속 차치기, 운행 속도가 점점 느려지는Accelerate Decelerate Interpolator: 가감속 차치기, 그림 운행 시 중간 속도가 빠르고 양쪽 속도가 느린Bounce Interpolator: 탄성 차치기,점프 동작을 모의하다.
속성 애니메이션은 기본적으로 Accelerate Decelerate Interpolator를 사용합니다. 차치기 설정을 변경해야 할 때 Animator 대상의 setInterpolator 방법을 호출하면 됩니다. 매개 변수 2f는 우리가 설정한 가속도입니다.
anim.setInterpolator(new AccelerateInterpolator(2f)); 
anim.setInterpolator(new BounceInterpolator());

Interpolator의 역할은 어떻게 됩니까?TimeInterpolator 인터페이스의 코드를 살펴보십시오.
public interface TimeInterpolator {   
    float getInterpolation(float input);  
} 

간단합니다. 단지 input의 값에 따라float 수를 되돌려줍니다.여기서 input은 0에서 1까지의 변화값으로 애니메이션이 실행되는 과정에서 input는 시간의 흐름에 따라 0에서 1로 변한다.Interpolator가 해야 할 일은 input에 따라 계산을 통해 우리가 필요로 하는 수치를 되돌려 주는 것이다.예를 들어LinearInterpolator, 선형차치기, 그것도 고른 속도이기 때문에 아무것도 하지 않고 getInterpolation 방법에서 input로 되돌아왔다.
Interpolation을 이해한 후에 Evaluator의 개념을 소개해야 한다. 위의 예에서 우리는 사용자 정의의TypeEvaluator,MyEvaluator를 사용했는데 그 역할은fraction에 따라 현재 좌표를 계산하고Cordinate 대상에 봉하여 되돌아온 다음에 View뿌리는 이 좌표에 따라 원형을 그린다.여기를 보면 TypeEvaluator의 역할이 분명하다. 평가기는 애니메이션이 어느 순간에 구체적인 상태를 결정한다.fraction, 이 매개 변수는 Interpolator의 getInterpolation을 통해 얻을 수 있습니다.즉, Interpolator는 애니메이션의 전체적인 변화 규칙을 결정하고 Evaluator는 이 규칙에 따라 특정한 순간의 상태를 실현한다.
위의 예에서, 우리는fraction에 따라 원형의 좌표 위치를 계산하는데, 만약 색깔이라면,fraction에 따라 색깔의 변화를 계산하고 봉인된 색깔의 값을 되돌려야 한다.Interpolator는 Evaluator와 함께 애니메이션의 최종 표현 형식을 결정합니다.
ViewPropertyAnimator
ViewPropertyAnimator는 View를 위한 보조 클래스로 사용하기에 매우 간단하고 View 대상을 직접 호출합니다.애니메이션 () 방법은 ViewPropertyAnimator 대상을 얻으면 애니메이션을 할 수 있습니다
textview.animate().x(500).y(500).setDuration(5000) .setInterpolator(new BounceInterpolator());  

5s 내에 textView를 500500으로 이동하고 애니메이션 효과는 점프임을 나타냅니다.

좋은 웹페이지 즐겨찾기