プロパティアニメーションの基本的な注意事項

カスタム属性を変更する

  • 次のようにカスタムビューを作成します。
public class CicleView extends View {
   private Paint paint;
   private float radius;

   public CicleView(Context context) {
       super(context);
       init(context, null);
   }

   public CicleView(Context context, @Nullable AttributeSet attrs) {
       super(context, attrs);
       init(context, attrs);
   }

   public CicleView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
       super(context, attrs, defStyleAttr);
       init(context, attrs);
   }

   public void setRadius(float radius) {
       this.radius = radius;
       invalidate();
   }

   private void init(Context context, AttributeSet attrs) {
       paint = new Paint();
       paint.setColor(Color.BLUE);
       paint.setAntiAlias(true);
       paint.setMaskFilter(new BlurMaskFilter(2f, BlurMaskFilter.Blur.NORMAL));
   }


   @Override
   protected void onDraw(Canvas canvas) {
       super.onDraw(canvas);
       int cx = getWidth() / 2;
       int cy = getHeight() / 2;
       canvas.drawCircle(cx, cy, radius, paint);
   }
}
  • アニメーターを使用して属性を変更する
 //使用ObjectAnimator
       ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(iv, "radius", 0, 120, 240, 360);
       objectAnimator.setDuration(2000);
       objectAnimator.setRepeatCount(100);
       objectAnimator.setRepeatMode(ValueAnimator.REVERSE);
       objectAnimator.start();
       //使用ValueAnimator
       ValueAnimator valueAnimator = ValueAnimator.ofFloat(0, 120, 240, 360);
       valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
           @Override
           public void onAnimationUpdate(ValueAnimator animation) {
               float value = (float) animation.getAnimatedValue();
               iv.setRadius(value);
           }
       });
       valueAnimator.start();

補間器-TimeInterpolator

  • アニメーションの再生中に、Androidはアニメーションの再生速度を変更する補間器を提供し、さまざまな補間器を使用してさまざまな再生効果を実現します。すべての補間器はTimeInterpolatorインターフェイスを実装する必要があります。

Androidにデフォルトで実装されている10種類の補間器

  • AccelerateDecelerateInterpolator
    • 効果:変化の速度はどんどん遅くなっています、
    • getInterpolation(float input)メソッドの戻り値は(Math.cos((input + 1)* Math.PI)/ 2.0f)+ 0.5f; cos曲線です。
  • AccelerateInterpolator
    • 効果:変化の速度はどんどん速くなっています
    • getInterpolation(float input)戻り値は次のとおりです。2Nパワーへの入力
  • AnticipateInterpolator
    • 効果:変化の速度は速く始まり、その後遅くなります
    • getInterpolation(float t)戻り値は次のとおりです。(k + 1)* t 3-k * t 2
  • AnticipateOvershootInterpolator
    • 効果:変化の速度は速く始まり、次に遅くなり、最後にリバウンド効果があり、1回リバウンドします。
    • getInterpolation(float t)戻り回值:
      a(t、s)= t * t *((s + 1)* t --s );
      o(t、s)= t * t *((s + 1)* t + s);
      f(t)= 0.5 * a(t * 2、張力* extraTension)、t <0.5の場合;
      f(t)= 0.5 *(o(t * 2-2、tension * extraTension)+ 2)、t <= 1.0の場合;
  • BounceInterpolator
    • 効果:変化の速度はどんどん速くなり、最後にリバウンド振動効果があります。
    • getInterpolation(float t)戻り回值:_b(t)= t * t * 8;
      bs(t)= _b(t)for t <0.3535;
      bs(t)= _b(t --0.54719)+ 0.7 for t <0.7408;
      bs(t)= _b(t-0.8526)+ 0.9 for t <0.9644;
      bs(t)= _b(t-1.0435)+ 0.95 for t <= 1.0;
      b(t)= bs(t * 1.1226);
  • CycleInterpolator(フロートサイクル)
    • 効果:指定されたサイクル数(サイクル)、変化率は正弦関数です
    • getInterpolation(float input)戻り値:(Ma​​th.sin(2 * mCycles * Math.PI * input));
  • DecelerateInterpolator
    • 効果:変化がますます遅くなる
    • getInterpolation(float input)戻り値は1-(1-input)^ 2n of input
  • LinearInterpolator
    • 効果:均一な変化
    • getInterpolation(float input)戻り値:input
      -LinearOutSlowInInterpolator
    • 効果:最初は均一な速度で、次に遅くなります
  • OvershootInterpolator
    • 効果:最初は速度が一定で、その後1回リバウンドします。
    • getInterpolation(float input)戻り値:
      _o(t)= t * t *((tension + 1)* t + ension);
      o(t)= _o(t-1)+ 1;

カスタムTimeInterpolator

  • BaseInterpolatorクラスを継承します
  • float getInterpolation(float input)メソッドをオーバーライドします。特定の条件に応じて異なる値を返します。
public class CustomInterpolator extends BaseInterpolator {
   @Override
   public float getInterpolation(float input) {
       return 0;
   }
}

Evaluator-TypeEvaluator

  • これは、アニメーションプロセスのすべての瞬間におけるアニメーションの特定の値を決定するために使用されます。つまり、ValueAnimator.getAnimatedValue()によって返される特定のオブジェクトタイプを決定するために使用されます。

Androidにデフォルトで実装されているEstimator

  • ArgbEvaluator
  • FloatArrayEvaluator
  • FloatEvaluator
  • IntArrayEvaluator
  • IntEvaluator
  • PointFEvaluator
  • RectEvaluator

カスタム評価者

  • TypeEvaluatorインターフェースを実装する
  • T評価(浮動小数点数、T startValue、T endValue)メソッドをオーバーライドします。特定の条件に応じて異なる値を返します。
 class CustomEvaluator implements TypeEvaluator<Number> {

        @Override
        public Number evaluate(float fraction, Number startValue, Number endValue) {
            return null;
        }
    }

上記の例を再実装します

  • ドットエンティティクラスを作成する
/**
 * 圆形的实体类
 */
public class Cicle {
    //圆点x坐标
    private float xCenter;
    //圆点y坐标
    private float yCenter;
    //半径
    private float radius;

    public Cicle() {
    }

    public Cicle(float xCenter, float yCenter, float radius) {
        this.xCenter = xCenter;
        this.yCenter = yCenter;
        this.radius = radius;
    }

    public float getxCenter() {
        return xCenter;
    }

    public void setxCenter(float xCenter) {
        this.xCenter = xCenter;
    }

    public float getyCenter() {
        return yCenter;
    }

    public void setyCenter(float yCenter) {
        this.yCenter = yCenter;
    }

    public float getRadius() {
        return radius;
    }

    public void setRadius(float radius) {
        this.radius = radius;
    }
}
  • 円を描くためのカスタムビュー
public class CicleView extends View {
    private Paint paint;
    private Cicle cicle;

    public CicleView(Context context) {
        super(context);
        init();
    }

    public CicleView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public CicleView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    public void setCicle(Cicle cicle) {
        this.cicle = cicle;
        invalidate();
    }

    private void init() {
        paint = new Paint();
        paint.setColor(Color.BLUE);
        paint.setAntiAlias(true);
        paint.setMaskFilter(new BlurMaskFilter(2f, BlurMaskFilter.Blur.NORMAL));
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        int width = MeasureSpec.getSize(widthMeasureSpec);
        int height = MeasureSpec.getSize(heightMeasureSpec);
        cicle.setxCenter(width / 2);
        cicle.setyCenter(height / 2);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.drawCircle(cicle.getxCenter(), cicle.getyCenter(), cicle.getRadius(), paint);
    }
}
  • カスタム推定量
 class CustomEvaluator implements TypeEvaluator<Cicle> {

        @Override
        public Cicle evaluate(float fraction, Cicle startValue, Cicle endValue) {
            Log.d(TAG, "evaluate: f:" + fraction + ";;startR:" + startValue.getRadius() + ";;" +
                    endValue.getRadius());
            Cicle cicle = new Cicle();
            cicle.setxCenter((width) / 2);
            cicle.setyCenter((height) / 2);
            cicle.setRadius((endValue.getRadius() - startValue.getRadius()) * fraction);
            return cicle;
        }
    }
  • アニメーションを実現する
        width = getWindowManager().getDefaultDisplay().getWidth();
        height = getWindowManager().getDefaultDisplay().getHeight();
        Cicle cicle1 = new Cicle();
        cicle1.setRadius(0);
        Cicle cicle2 = new Cicle();
        cicle2.setRadius(500);
        ValueAnimator valueAnimator = ValueAnimator.ofObject(new CustomEvaluator(), cicle1, cicle2);
        valueAnimator.setInterpolator(new LinearInterpolator());
        valueAnimator.setDuration(5000);
        valueAnimator.setEvaluator(new CustomEvaluator());
        valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator animation) {
                Cicle cicle = (Cicle) animation.getAnimatedValue();
                iv.setCicle(cicle);
            }
        });
        valueAnimator.start();

おすすめ

転載: blog.csdn.net/genmenu/article/details/88659777