ApiDemos学习知识点之Animation-AnimationCloing

依照惯例,先上截图




文件存储路径\ApiDemo\src\com\example\android\apis\animation\AnimationCloning.java

布局文件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/container"
    >
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Run"
        android:id="@+id/startButton"
        />
</LinearLayout>



下面是代码

public class AnimationCloning extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.animation_cloning);
        
        //LinearLayout动态添加View
        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 {

        public final ArrayList<ShapeHolder> balls = new ArrayList<ShapeHolder>();
        AnimatorSet animation = null;
        private float mDensity;

        public MyAnimationView(Context context) {
            super(context);

            mDensity = getContext().getResources().getDisplayMetrics().density;

            ShapeHolder ball0 = addBall(50f, 25f);
            ShapeHolder ball1 = addBall(150f, 25f);
            ShapeHolder ball2 = addBall(250f, 25f);
            ShapeHolder ball3 = addBall(350f, 25f);
        }

       private void createAnimation()
        {
            if (animation == null)
            {
                //初始化属性动画
                ObjectAnimator anim1 = ObjectAnimator.ofFloat(balls.get(0),
                        "y", 0f, getHeight() - balls.get(0).getHeight())
                        .setDuration(500);
                ObjectAnimator anim2 = anim1.clone();
                anim2.setTarget(balls.get(1));
                //添加刷新监听器
                anim1.addUpdateListener(this);
                
                //第三个球体动画
                ShapeHolder ball2 = balls.get(2);
                ObjectAnimator animDown = ObjectAnimator.ofFloat(ball2, "y",
                        0f, getHeight() - ball2.getHeight()).setDuration(500);
                //AccelerateInterpolator:在动画开始的地方速率改变比较慢,然后开始加速
                animDown.setInterpolator(new AccelerateInterpolator());
                ObjectAnimator animUp = ObjectAnimator.ofFloat(ball2, "y",
                        getHeight() - ball2.getHeight(), 0f).setDuration(500);
                //DecelerateInterpolator在动画开始的地方速率改变比较慢,然后开始减速
                animUp.setInterpolator(new DecelerateInterpolator());
                AnimatorSet s1 = new AnimatorSet();
                //连续执行两种动画
                s1.playSequentially(animDown, animUp);
                animDown.addUpdateListener(this);
                animUp.addUpdateListener(this);
                
                AnimatorSet s2 = (AnimatorSet) s1.clone();
                s2.setTarget(balls.get(3));




                animation = new AnimatorSet();
                //同时播放前面3个球的动画
                animation.playTogether(anim1, anim2, s1);
                //顺序播放后面两个球动画
                animation.playSequentially(s1, s2);
            }
        }
        private ShapeHolder addBall(float x, float y)
        {
            //绘制一个椭圆
            OvalShape circle = new OvalShape();
            //设置椭圆高宽
            circle.resize(50f * mDensity, 50f * mDensity);
            //初始化圆形
            ShapeDrawable drawable = new ShapeDrawable(circle);
            ShapeHolder shapeHolder = new ShapeHolder(drawable);
            shapeHolder.setX(x - 25f);
            shapeHolder.setY(y - 25f);
            //产生随机颜色
            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(); // new
                                                // Paint(Paint.ANTI_ALIAS_FLAG);
            int darkColor = 0xff000000 | red / 4 << 16 | green / 4 << 8 | blue / 4;
            //镜像渐变  参数一为渐变起初点坐标x位置,参数二为y轴位置,
            //参数三半径范围,参数4、5是代表中心颜色和边缘颜色,最后参数为平铺方式
            //Shader.TileMode.CLAMP:使用Shader的边界颜色来填充剩余的空间
            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 (int i = 0; i < balls.size(); ++i) {
                ShapeHolder shapeHolder = balls.get(i);
                canvas.save();
                canvas.translate(shapeHolder.getX(), shapeHolder.getY());
                shapeHolder.getShape().draw(canvas);
                canvas.restore();
            }
        }

        public void startAnimation() {
            createAnimation();
            animation.start();
        }
//在动画执行过程中,我们可以重写ValueAnimator.AnimatorUpdateListener接口,来监听运行过程,例如这里我们重写了ValueAnimator.AnimatorUpdateListener来刷新自定义的View界面。
        public void onAnimationUpdate(ValueAnimator animation) {
            invalidate();
        }

    }
}

上面第一段就是动画设置的过程。注意,这里只是设置了动画的规则,跑完这些代码,并不会有任何动画,因为动画启动是另外的接口,这里只是设置了动画执行过程的属性。这里使用了属性动画,是Android3.0以后才新增加的动画方式。这里不详细说动画属性概念,只是为了会使用。

  这里主要是使用ObjectAnimator来设置动画过程,属性动画会修改对象的属性,而且这种动画也有限制。ofFloat是设置动画流程的接口,这里是设置了沿着Y坐标从0到View的高度移动。后面几个就是设置动画流程,可以参考上面代码注释。

  playTogether和playSequentially是两种设置连续动画的接口,只是一个是全部动画同时运行,另外一个是一个接着一个运行。

  最后强调一点,这里只是设置动画流程,下面的接口调用了,才会启动动画。


上面第二段是创建一个球形的过程,里面用到一个ApiDemo里面自己编写的管理图形的类ShapeHolder,这个以后再说。主要是看看上面如何创建一个球形,这里使用了OvalShape创建一个椭圆形,不过下面设置了相同的的长宽,最后出来的是一个圆形。上面随机生成一种RGB颜色,所以你每次启动这个程序,得到的球形颜色都不一样。

  另外,RadialGradient是一个比较有趣的类,它实现了图形填充的效果,而且可以自定义光影填充,它的参数如下含义

  • 参数一为渐变起初点坐标x位置
  • 参数二为y轴位置
  • 参数三半径范围
  • 参数4、5是代表中心颜色和边缘颜色
  • 最后参数为平铺方式Shader.TileMode.CLAMP:使用Shader的边界颜色来填充剩余的空间

 你可以对比上面的效果图,效果图的右上角是颜色比较浅,而且有一个向外扩散的光影效果。就是由这个类实现的效果。你可以修改代码,调试一下。熟悉这个类的用法。



/**
 * 一种可以用来定义形状和各种属性的数据结构形状绘制。
 */
public class ShapeHolder {
    private float x = 0, y = 0;
    private ShapeDrawable shape;
    private int color;
    private RadialGradient gradient;
    private float alpha = 1f;
    private Paint paint;

    public void setPaint(Paint value) {
        paint = value;
    }
    public Paint getPaint() {
        return paint;
    }

    public void setX(float value) {
        x = value;
    }
    public float getX() {
        return x;
    }
    public void setY(float value) {
        y = value;
    }
    public float getY() {
        return y;
    }
    public void setShape(ShapeDrawable value) {
        shape = value;
    }
    public ShapeDrawable getShape() {
        return shape;
    }
    public int getColor() {
        return color;
    }
    public void setColor(int value) {
        shape.getPaint().setColor(value);
        color = value;
    }
    public void setGradient(RadialGradient value) {
        gradient = value;
    }
    public RadialGradient getGradient() {
        return gradient;
    }

    public void setAlpha(float alpha) {
        this.alpha = alpha;
        shape.setAlpha((int)((alpha * 255f) + .5f));
    }

    public float getWidth() {
        return shape.getShape().getWidth();
    }
    public void setWidth(float width) {
        Shape s = shape.getShape();
        s.resize(width, s.getHeight());
    }

    public float getHeight() {
        return shape.getShape().getHeight();
    }
    public void setHeight(float height) {
        Shape s = shape.getShape();
        s.resize(s.getWidth(), height);
    }

    public ShapeHolder(ShapeDrawable s) {
        shape = s;
    }
}


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值