Android Animation学习（四） ApiDemos解析：多属性动画

如果想同时改变多个属性，根据前面所学的，比较显而易见的一种思路是构造多个对象Animator ，

　　（ Animator可以是ValueAnimator、ObjectAnimator和AnimatorSet）

　　然后最后把它们放在一个AnimatorSet中。

　　另一种思路就是，把多个属性的改变放在同一个 ValueAnimator 中（ObjectAnimator也是 ValueAnimator）。

　　而这就要借助PropertyValuesHolder。本文主要讲这种方法。

　　

PropertyValuesHolder

　　PropertyValuesHolder是API Level 11加进来的。根据名字就可以判断出它是某种属性的持有者。

　　使用工厂方法构造PropertyValuesHolder对象，指定属性名和一系列属性值。

　　代码例子：MultiPropertyAnimation中：

                // ============================================================
                // 第二个小球：加速下落并且alpha变化
                ball = balls.get(1);

                // 利用ofFloat工厂方法构造PropertyValuesHolder类型对象，控制y属性
                PropertyValuesHolder pvhY = PropertyValuesHolder.ofFloat("y",
                        ball.getY(), getHeight() - BALL_SIZE);
                // 利用ofFloat工厂方法构造另一个PropertyValuesHolder类型对象，控制alpha属性
                PropertyValuesHolder pvhAlpha = PropertyValuesHolder.ofFloat(
                        "alpha", 1.0f, 0f);
                // 利用ofPropertyValuesHolder方法来构造ObjectAnimator对象
                // 把多个属性变化结合到一个动画中去
                ObjectAnimator yAlphaBouncer = ObjectAnimator
                        .ofPropertyValuesHolder(ball, pvhY, pvhAlpha)
                        .setDuration(DURATION / 2);
                yAlphaBouncer.setInterpolator(new AccelerateInterpolator());
                yAlphaBouncer.setRepeatCount(1);
                yAlphaBouncer.setRepeatMode(ValueAnimator.REVERSE);

 

关键帧Keyframe

　　PropertyValuesHolder的工厂方法里面，除了整形ofInt()、浮点型ofFloat()、Object类型ofObject()之外，还有一种：ofKeyframe()。

　　Keyframe类型对象由一个time/value对组成，定义了指定时间点的指定值。

　　

　　每一个keyframe还可以拥有自己的interpolator，控制了前一个关键帧到这一个关键帧之间的时间动画行为。

　　Keyframe 对象的构造也用是工厂方法：ofInt(), ofFloat(), or ofObject()。

　　Keyframe对象构造完之后就可以用 ofKeyframe()工厂方法来构造PropertyValuesHolder对象。

　　代码例子：MultiPropertyAnimation中：

                // ============================================================
                // 第四个小球：利用关键帧实现曲线运动
                ball = balls.get(3);
                // 属性1：Y坐标运动：下落
                pvhY = PropertyValuesHolder.ofFloat("y", ball.getY(),
                        getHeight() - BALL_SIZE);
                float ballX = ball.getX();
                // 三个关键帧
                Keyframe kf0 = Keyframe.ofFloat(0f, ballX);
                Keyframe kf1 = Keyframe.ofFloat(.5f, ballX + 100f);
                Keyframe kf2 = Keyframe.ofFloat(1f, ballX + 50f);
                // 属性2：X坐标运动：曲折
                // 用三个关键帧构造PropertyValuesHolder对象
                PropertyValuesHolder pvhX = PropertyValuesHolder.ofKeyframe(
                        "x", kf0, kf1, kf2);

                // 再用两个PropertyValuesHolder对象构造一个ObjectAnimator对象
                ObjectAnimator yxBouncer = ObjectAnimator
                        .ofPropertyValuesHolder(ball, pvhY, pvhX).setDuration(
                                DURATION / 2);
                yxBouncer.setRepeatCount(1);
                yxBouncer.setRepeatMode(ValueAnimator.REVERSE);

View的多属性动画：使用ViewPropertyAnimator

　　ViewPropertyAnimator是API Level 12引进的。

　　它是用来做针对View对象的多个属性动画功能。

　　（前面的PropertyValuesHolder对象是针对所有对象的，范围更广）。

　　如果要同时变换一个View的多个属性的话，ViewPropertyAnimator提供了一种更方便和更适合的方法。

　　而且由于多个属性的invalidate方法调用统一管理，而不是之前的分别调用，所以还会有一些性能优化。

　　注意 ViewPropertyAnimator 这个类的对象不是由调用者构造的，而是通过View类的animate()方法返回的。

　　比如下面的代码对比：给同一个View实现同一个动画效果：

　　用多个ObjectAnimator对象：

ObjectAnimator animX = ObjectAnimator.ofFloat(myView, "x", 50f);
ObjectAnimator animY = ObjectAnimator.ofFloat(myView, "y", 100f);
AnimatorSet animSetXY = new AnimatorSet();
animSetXY.playTogether(animX, animY);
animSetXY.start();

　　用一个ObjectAnimator对象加多个PropertyValuesHolder:

PropertyValuesHolder pvhX = PropertyValuesHolder.ofFloat("x", 50f);
PropertyValuesHolder pvhY = PropertyValuesHolder.ofFloat("y", 100f);
ObjectAnimator.ofPropertyValuesHolder(myView, pvhX, pvyY).start();

　　用ViewPropertyAnimator：

myView.animate().x(50f).y(100f);

API Demos完整代码：

public class MultiPropertyAnimation extends Activity {

    private static final int DURATION = 1500;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.animation_multi_property);
        LinearLayout container = (LinearLayout) findViewById(R.id.container);
        final MyAnimationView animView = new MyAnimationView(this);
        container.addView(animView);

        Button starter = (Button) findViewById(R.id.startButton);
        starter.setOnClickListener(new View.OnClickListener() {

            public void onClick(View v) {
                animView.startAnimation();

            }
        });

    }

    public class MyAnimationView extends View implements
            ValueAnimator.AnimatorUpdateListener {

        private static final float BALL_SIZE = 100f;

        public final ArrayList<ShapeHolder> balls = new ArrayList<ShapeHolder>();
        AnimatorSet animation = null;
        Animator bounceAnim = null;
        ShapeHolder ball = null;

        public MyAnimationView(Context context) {
            super(context);
            addBall(50, 0);
            addBall(150, 0);
            addBall(250, 0);
            addBall(350, 0);
        }

        private void createAnimation() {
            if (bounceAnim == null) {
                ShapeHolder ball;

                // ============================================================
                // 第一个小球：弹跳效果
                ball = balls.get(0);
                ObjectAnimator yBouncer = ObjectAnimator.ofFloat(ball, "y",
                        ball.getY(), getHeight() - BALL_SIZE).setDuration(
                        DURATION);
                yBouncer.setInterpolator(new BounceInterpolator());
                yBouncer.addUpdateListener(this);

                // ============================================================
                // 第二个小球：加速下落并且alpha变化
                ball = balls.get(1);

                // 利用ofFloat工厂方法构造PropertyValuesHolder类型对象，控制y属性
                PropertyValuesHolder pvhY = PropertyValuesHolder.ofFloat("y",
                        ball.getY(), getHeight() - BALL_SIZE);
                // 利用ofFloat工厂方法构造另一个PropertyValuesHolder类型对象，控制alpha属性
                PropertyValuesHolder pvhAlpha = PropertyValuesHolder.ofFloat(
                        "alpha", 1.0f, 0f);
                // 利用ofPropertyValuesHolder方法来构造ObjectAnimator对象
                // 把多个属性变化结合到一个动画中去
                ObjectAnimator yAlphaBouncer = ObjectAnimator
                        .ofPropertyValuesHolder(ball, pvhY, pvhAlpha)
                        .setDuration(DURATION / 2);
                yAlphaBouncer.setInterpolator(new AccelerateInterpolator());
                yAlphaBouncer.setRepeatCount(1);
                yAlphaBouncer.setRepeatMode(ValueAnimator.REVERSE);

                // ============================================================
                // 第三个小球：宽度，高度，x，y同时变化
                ball = balls.get(2);
                PropertyValuesHolder pvhW = PropertyValuesHolder.ofFloat(
                        "width", ball.getWidth(), ball.getWidth() * 2);
                PropertyValuesHolder pvhH = PropertyValuesHolder.ofFloat(
                        "height", ball.getHeight(), ball.getHeight() * 2);
                PropertyValuesHolder pvTX = PropertyValuesHolder.ofFloat("x",
                        ball.getX(), ball.getX() - BALL_SIZE / 2f);
                PropertyValuesHolder pvTY = PropertyValuesHolder.ofFloat("y",
                        ball.getY(), ball.getY() - BALL_SIZE / 2f);
                // 利用ofPropertyValuesHolder方法来构造ObjectAnimator对象
                // 因为是可变参数，所以PropertyValuesHolder对象的个数不限
                ObjectAnimator whxyBouncer = ObjectAnimator
                        .ofPropertyValuesHolder(ball, pvhW, pvhH, pvTX, pvTY)
                        .setDuration(DURATION / 2);
                whxyBouncer.setRepeatCount(1);
                whxyBouncer.setRepeatMode(ValueAnimator.REVERSE);

                // ============================================================
                // 第四个小球：利用关键帧实现曲线运动
                ball = balls.get(3);
                // 属性1：Y坐标运动：下落
                pvhY = PropertyValuesHolder.ofFloat("y", ball.getY(),
                        getHeight() - BALL_SIZE);
                float ballX = ball.getX();
                // 三个关键帧
                Keyframe kf0 = Keyframe.ofFloat(0f, ballX);
                Keyframe kf1 = Keyframe.ofFloat(.5f, ballX + 100f);
                Keyframe kf2 = Keyframe.ofFloat(1f, ballX + 50f);
                // 属性2：X坐标运动：曲折
                // 用三个关键帧构造PropertyValuesHolder对象
                PropertyValuesHolder pvhX = PropertyValuesHolder.ofKeyframe(
                        "x", kf0, kf1, kf2);

                // 再用两个PropertyValuesHolder对象构造一个ObjectAnimator对象
                ObjectAnimator yxBouncer = ObjectAnimator
                        .ofPropertyValuesHolder(ball, pvhY, pvhX).setDuration(
                                DURATION / 2);
                yxBouncer.setRepeatCount(1);
                yxBouncer.setRepeatMode(ValueAnimator.REVERSE);

                // ===========================================================
                // 所有小球动画的集合
                bounceAnim = new AnimatorSet();
                ((AnimatorSet) bounceAnim).playTogether(yBouncer,
                        yAlphaBouncer, whxyBouncer, yxBouncer);
            }
        }

        public void startAnimation() {
            createAnimation();
            bounceAnim.start();
        }

        private ShapeHolder addBall(float x, float y) {
            OvalShape circle = new OvalShape();
            circle.resize(BALL_SIZE, BALL_SIZE);
            ShapeDrawable drawable = new ShapeDrawable(circle);
            ShapeHolder shapeHolder = new ShapeHolder(drawable);
            shapeHolder.setX(x);
            shapeHolder.setY(y);
            int red = (int) (100 + Math.random() * 155);
            int green = (int) (100 + Math.random() * 155);
            int blue = (int) (100 + Math.random() * 155);
            int color = 0xff000000 | red << 16 | green << 8 | blue;
            Paint paint = drawable.getPaint();
            int darkColor = 0xff000000 | red / 4 << 16 | green / 4 << 8 | blue
                    / 4;
            RadialGradient gradient = new RadialGradient(37.5f, 12.5f, 50f,
                    color, darkColor, Shader.TileMode.CLAMP);
            paint.setShader(gradient);
            shapeHolder.setPaint(paint);
            balls.add(shapeHolder);
            return shapeHolder;
        }

        @Override
        protected void onDraw(Canvas canvas) {
            for (ShapeHolder ball : balls) {
                canvas.translate(ball.getX(), ball.getY());
                ball.getShape().draw(canvas);
                canvas.translate(-ball.getX(), -ball.getY());
            }
        }

        public void onAnimationUpdate(ValueAnimator animation) {
            invalidate();
        }

    }
}

　　

参考资料：

　　API Guides：Property Animation

　　http://developer.android.com/guide/topics/graphics/prop-animation.html

　　项目地址：https://github.com/mengdd/AnimationApiDemos.git

时间： 2024-11-08 06:13:56

Android Animation学习（四） ApiDemos解析：多属性动画的相关文章

Android Animation学习（二） ApiDemos解析：基本Animatiors使用

Animator类提供了创建动画的基本结构,但是一般使用的是它的子类: ValueAnimator.ObjectAnimator.AnimatorSet ApiDemos中Animation部分是单独的一个包. 下面代码来自ApiDemos中的AnimationCloning类,加了一个使用ValueAnimator的动画,还有一些注释. 完整的项目见:URL:https://github.com/mengdd/AnimationApiDemos.git package com.example.

Android开发学习---使用XmlPullParser解析xml文件

Android中解析XML的方式主要有三种:sax,dom和pull关于其内容可参考:http://blog.csdn.net/liuhe688/article/details/6415593 本文将主要介绍pull解析器解析xml文件,环境为ubuntu 12.04+ intelij 13.1 + android sdk 2.1 一.创建一个XML项目,步骤如下: 二.解析一个xml文件: assets/person.xml <?xml version="1.0" encodi

Android Animation学习（五） ApiDemos解析：容器布局动画 LayoutTransition

Property animation系统还提供了对ViewGroup中的View改变加入动画的功能. 你可以使用 LayoutTransition 对ViewGroup中的View改变进行动画显示. 注意,本文所说的动画效果都是设置给容器(ViewGroup),然而效果是通过容器存放的View来体现的. 四种容器转换动画类型 当你添加或者移除ViewGroup中的View时,或者你调用View的setVisibility()方法来控制其显示或消失时,就处于一个转换状态.这种事件就有可能会激发动画

Android Animation学习笔记

关于动画的实现,Android提供了Animation,在Android SDK介绍了2种Animation模式: 1. Tween Animation:通过对场景里的对象不断做图像变换(平移.缩放.旋转)产生动画效果,即是一种渐变动画: 2. Frame Animation:顺序播放事先做好的图像,是一种画面转换动画. 动画类型 下面先来看看Android提供的动画类型.Android的animation由四种类型组成 在XML文件中: alpha        渐变透明度动画效果 scale

Android Animation学习

关于动画的实现,android提供了Animation,有两种Animation(动画)模式 1. Tween Animation:通过对场景里的对象不断做图像变换(平移.缩放.旋转)产生动画效果,即是一种渐变动画: 2. Frame Animation:顺序播放事先做好的图像,是一种画面转换动画. 动画类型: Android的animation由四种类型组成 在XML文件中: |--alpha    渐变透明度变化效果 |--scale    渐变尺寸伸缩动画效果 |--translate  

Android Animation学习（一） Property Animation介绍

Android Animation Android framework提供了两种动画系统: property animation (introduced in Android 3.0)和view animation. 除了这两种系统外,也可以利用Drawable animation,也就是播放序列帧图像. 所以,Android中的Animation分三种: 1. Property Animation 2. View Animation 3. Drawable Animation 下面主要说Pro

Android Animation学习（六） View Animation介绍

View Animation View animation系统可以用来执行View上的Tween animation和Frame animation. Tween animation可以在View对象上执行一系列的简单变换,比如位置.尺寸.旋转.透明度等. animation package 包中包含了tween animation所有的类. 一系列的动画命令定义了一个完整的tween animation,可以用代码定义也可以用XML资源文件定义. XML资源文件 XML资源文件的使用可以见:A

Android Animation学习（三） ApiDemos解析：XML动画文件的使用

可以用XML文件来定义Animation. 文件必须有一个唯一的根节点: <set>, <objectAnimator>, or <valueAnimator>三者之一. 对应的Java类是: ValueAnimator - <animator> ObjectAnimator - <objectAnimator> AnimatorSet - <set> <set>标签是可以嵌套的. <set>标签的androi

Android 布局学习之——LinearLayout的layout_weight属性

一直对layout_weight属性感到比较困惑,今天学习一下,来深入了解layout_weight属性和它的用法.     定义     首先,看看Android官方文档是怎么说的,毕竟人家才是权威嘛. 官方文档的意思是: layout_weight属性用于分配LinearLayout中的的额外空间(extra space).                  如果View不想拉伸的话,layout_weight值设置为0.否则的话这些像素会按比例分配到 这些weight值大于0的所有View