如何在 android 中将 imageView 应用于触摸缩放动画?

How to apply imageView on touch scale animation in android?

我想在用户触摸按钮时应用一些动画,比如-

  1. on touch/hover = scale down,
  2. move finger out of the view bound = scale up to previous position,
  3. on release/click = scale up to previous position

触摸动画效果很好,但我无法弄清楚在松开手指时将动画放大到之前的位置。此外,我对 Motion 触摸事件不太熟悉,所以请告诉我哪个 Motion Event 适合执行此操作。谁能帮帮我吗。这是我的代码:

imageView.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {

                switch (event.getAction()) {

                    case MotionEvent.ACTION_DOWN:
                        imageView.animate().scaleX(0.5f).scaleY(0.5f).start();
                        break;

                    case MotionEvent.ACTION_CANCEL:
                        imageView.animate().scaleX(2.0f).scaleY(2.0f).start();
                        break;

                    case MotionEvent.ACTION_UP:
                        imageView.animate().scaleX(2.0f).scaleY(2.0f).start();

                        startActivity(new Intent(ActivityOne.this, ActivityTwo.class));
                        break;
                }
                return true;
            }
        });

我也尝试过对象动画师,类似的东西:

private void scaleAnimation(View view) {
        ObjectAnimator scaleDownX = ObjectAnimator.ofFloat(view, "scaleX", 0.5f);
        ObjectAnimator scaleDownY = ObjectAnimator.ofFloat(view, "scaleY", 0.5f);
        scaleDownX.setDuration(150);
        scaleDownY.setDuration(150);
        //scaleDownX.setRepeatMode(ValueAnimator.REVERSE);
        //scaleDownY.setRepeatMode(ValueAnimator.REVERSE);
        //scaleDownX.setRepeatCount(1);
        //scaleDownY.setRepeatCount(1);

        animatorSet = new AnimatorSet();
        //animatorSet.play(scaleDownX).with(scaleDownY);
        animatorSet.playTogether(scaleDownX, scaleDownY);
        animatorSet.start();
}

好吧,经过长时间的实验,我自己找到了答案。这是:

After touch, if user move his finger then we need to cancel button click

boolean isMove;
// initialize
isMove = false;

Set scale down and scale up animation

private void startScaleAnimation(View view) {
        ObjectAnimator scaleDownX = ObjectAnimator.ofFloat(view, "scaleX", 0.8f);
        ObjectAnimator scaleDownY = ObjectAnimator.ofFloat(view, "scaleY", 0.8f);
        scaleDownX.setDuration(150);
        scaleDownY.setDuration(150);

        scaleDownX.start();
        scaleDownY.start();
    }

    private void cancelScaleAnimation(View view) {
        ObjectAnimator scaleDownX = ObjectAnimator.ofFloat(view, "scaleX", 1.0f);
        ObjectAnimator scaleDownY = ObjectAnimator.ofFloat(view, "scaleY", 1.0f);
        scaleDownX.setDuration(150);
        scaleDownY.setDuration(150);

        scaleDownX.start();
        scaleDownY.start();
    }

Now, apply this animation along with onTouch listener

imageView.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {

                switch (event.getAction()) {

                    case MotionEvent.ACTION_DOWN:
                        startScaleAnimation(imageView);
                        break;

                    case MotionEvent.ACTION_MOVE:
                        cancelScaleAnimation(imageView);
                        isMove =true;
                        break;

                    case MotionEvent.ACTION_UP:
                        cancelScaleAnimation(imageView);

                        if (!isMove){
                            isMove = false;
                            Handler handler = new Handler();
                            handler.postDelayed(new Runnable() {
                                @Override
                                public void run() {

                                    startActivity(new Intent(ActivityOne.this, ActivityTwo.class));

                                    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
                                        overridePendingTransition(R.anim.enter_slide_left, R.anim.exit_slide_left);
                                    }

                                }
                            },150);
                        }else {
                            isMove = false;
                        }

                        break;
                }
                return true;
            }
        });