AnimationDrawable使用实现跳跃动画

在网上看到有个实现跳跃动画的，感觉很不错

之前写了一个 小人在跑。

Drawable animation可以加载Drawable资源实现帧动画。AnimationDrawable是实现Drawable animations的基本类。推荐用XML文件的方法实现Drawable动画，不推荐在代码中实现。这种XML文件存放在工程中res/drawable/目录下。XML文件的指令(即属性)为动画播放的顺序和时间间隔。

首先是一个布局文件

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#FFF">

    <ImageView
        android:id="@+id/image"
        android:layout_width="150dp"
        android:layout_height="150dp" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:orientation="horizontal">

        <Button
            android:id="@+id/btn_left"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="10dp"
            android:text="向左" />

        <Button
            android:id="@+id/btn_right"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="10dp"
            android:text="向右" />

        <Button
            android:id="@+id/btn_jump"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="10dp"
            android:text="跳跃" />
    </LinearLayout>
</RelativeLayout>

可以看到3个button。一会会实现点击 做动作

然后是mainactivity类

Button btn_left;
    Button btn_right;
    Button btn_jump;
    ImageView imageView;
    //Drawable animation可以加载Drawable资源实现帧动画。AnimationDrawable是实现Drawable animations的基本类。
    // 推荐用XML文件的方法实现Drawable动画，不推荐在代码中实现。这种XML文件存放在工程中res/drawable/目录下。XML文件的指令(即属性)为动画播放的顺序和时间间隔。
    AnimationDrawable drawable;
    Handler handler = new Handler();

    //是否正在往左运动，是否正在往右运动，是否正在跳跃
    private boolean isRidingLeft = false, isRidingRight = false, isJumping = false;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
        getWindow().getDecorView().post(new Runnable() {
            @Override
            public void run() {
                //先加载一下帧动画资源，避免第一次加载的时候的卡顿
                handler.post(new Runnable() {
                    @Override
                    public void run() {
                        imageView.setBackgroundResource(R.drawable.riding);
                        drawable = (AnimationDrawable) imageView.getBackground();
                        imageView.setBackgroundResource(R.drawable.jump);
                        drawable = (AnimationDrawable) imageView.getBackground();
                        //然后加载
                        imageView.setBackgroundResource(R.mipmap.riding_0);
                        imageView.animate().translationXBy(10000).setInterpolator(new LinearInterpolator()).setDuration(200000).rotationY(30).start();
//                        imageView.post(new Runnable() {
//                            //这个实现了view一直做动画
//                            @Override
//                            public void run() {
//                                drawable.start();
//                            }
//                        });
                    }
                });
            }
        });
        setListener();
        btn_right.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                switch (event.getAction()) {
                    case MotionEvent.ACTION_DOWN:
                        if (!isJumping) {
                            ride();
                        }
                        isRidingRight = true;
                        isRidingLeft = false;
                        ride2Right();
                        break;
                    case MotionEvent.ACTION_UP:
                        if (!isRidingLeft) {
                            imageView.animate().cancel();
                        }
                        if (!isJumping && !isRidingLeft) {
                            drawable.stop();
                        }
                        isRidingRight = false;
                        break;
                }
                return false;
            }
        });
        btn_left.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                switch (event.getAction()) {
                    case MotionEvent.ACTION_DOWN:
                        if (!isJumping) {
                            ride();
                        }
                        isRidingLeft = true;
                        isRidingRight = false;
                        ride2Left();
                        break;
                    case MotionEvent.ACTION_UP:
                        if (!isRidingRight) {
                            imageView.animate().cancel();
                        }
                        if (!isJumping && !isRidingRight) {
                            drawable.stop();
                        }
                        isRidingLeft = false;
                        break;
                }
                return false;
            }
        });

    }

    private void setListener() {
        btn_jump.setOnClickListener(this);
    }

    private void initView() {
        btn_left = (Button) findViewById(R.id.btn_left);
        btn_right = (Button) findViewById(R.id.btn_right);
        btn_jump = (Button) findViewById(R.id.btn_jump);
        imageView = (ImageView) findViewById(R.id.image);
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.btn_jump:
                jump();
                break;
        }
    }

    /**
     * 向左骑行
     */
    private void ride2Left() {
        imageView.animate().cancel();
        //属性动画的简写
        imageView.animate().translationXBy(-10000).setInterpolator(new LinearInterpolator()).setDuration(20000).start();
        imageView.animate().setUpdateListener(MainActivity.this);
    }

    /**
     * 向右滑动
     */
    private void ride2Right() {
        //先取消之前的动画
        imageView.animate().cancel();
        imageView.animate().translationXBy(10000).setInterpolator(new LinearInterpolator()).setDuration(20000).start();
        imageView.animate().setUpdateListener(MainActivity.this);
    }

    /**
     * 跳跃动画
     */
    private void jump() {
        imageView.setBackgroundResource(R.drawable.jump);
        drawable = (AnimationDrawable) imageView.getBackground();
        if (drawable != null && !drawable.isRunning()) {
            drawable.stop();
            drawable.start();
            isJumping = true;
            //发送延迟消息 停止动画
            handler.postDelayed(new Runnable() {
                @Override
                public void run() {
                    isJumping = false;
                    drawable.stop();
                    if (isRiding()) {
                        ride();
                    }
                }
            }, 20 * 50);
        }
    }

    /**
     * 判断车子是否在运动
     *
     * @return
     */
    private boolean isRiding() {
        return isRidingLeft || isRidingRight;
    }

    /**
     * 骑行过程中的帧动画
     */
    private void ride() {
        imageView.setBackgroundResource(R.drawable.riding);
        drawable = (AnimationDrawable) imageView.getBackground();
        if (drawable != null && !drawable.isRunning()) {
            drawable.start();
        }
    }

    /**
     * 当自行车出了屏幕边界后，重新从另一面驶入
     *
     * @param animation
     */
    @Override
    public void onAnimationUpdate(ValueAnimator animation) {
        if (imageView.getTranslationX() > getWindow().getDecorView().getWidth() - 34) {
            //如果向右移动的X坐标大于 windoew的width ,让imageview从右进入移动
            imageView.setTranslationX(-imageView.getWidth() + 70);
            ride2Right();
        } else if (imageView.getTranslationX() < -imageView.getWidth() + 70) {
            //如果向左移动的X坐标小于 windoew的witdh ，就让从右进入
            imageView.setTranslationX(getWindow().getDecorView().getWidth() - 34);
            ride2Left();
        }
    }