如何在 android 中将 imageView 应用于触摸缩放动画?
How to apply imageView on touch scale animation in android?
我想在用户触摸按钮时应用一些动画,比如-
- on touch/hover = scale down,
- move finger out of the view bound = scale up to previous position,
- 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;
}
});
我想在用户触摸按钮时应用一些动画,比如-
- on touch/hover = scale down,
- move finger out of the view bound = scale up to previous position,
- 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;
}
});