web-dev-qa-db-ja.com

Androidのアニメーション方法でImageViewを別の位置に移動します

ImageViewに複数のRelativeLayoutがあります。今、ユーザーがImageViewのいずれかをタップすると、微妙なアニメーションで指定された場所に移動したいです。

例えば; LayoutParamsに関連付けられたImageViewのマージンを最初にlayoutparams1.setMargins(90,70,0,0);として設定し、レイアウトに追加しました。

そして、imageviewがタップされたとき、新しい場所を200,200、アニメーション付き。

それで、それは可能ですか？はいの場合、どのように？

RelativeLayoutとそのすべての子ImageViewsの両方をプログラムで作成していることに注意してください。

そして、私はAndroid開発に慣れていないので、詳細な答えが期待されています。

androidanimationandroid-animation
23
Kushal
_TranslateAnimation animation = new TranslateAnimation(0, 50, 0, 100);
animation.setDuration(1000);
animation.setFillAfter(false);
animation.setAnimationListener(new MyAnimationListener());

imageView.startAnimation(animation);
_

PDATE：問題は、Viewが実際にはまだ古い位置にあることです。そのため、アニメーションが終了したら移動する必要があります。アニメーションの終了を検出するには、独自のanimationListener（activityクラス内）を作成する必要があります。

_private class MyAnimationListener implements AnimationListener{

    @Override
    public void onAnimationEnd(Animation animation) {
        imageView.clearAnimation();
        LayoutParams lp = new LayoutParams(imageView.getWidth(), imageView.getHeight());
        lp.setMargins(50, 100, 0, 0);
        imageView.setLayoutParams(lp);
    }

    @Override
    public void onAnimationRepeat(Animation animation) {
    }

    @Override
    public void onAnimationStart(Animation animation) {
    }

}
_

そのため、onClickEventは新しい場所で再び発生します。アニメーションはこれをさらに下に移動するので、xとyを変数に保存して、onAnimationEnd()で移動しないようにすることができます。修正場所。

54
D-32

ObjectAnimatorを使用することも良いです。ビューを新しい位置に移動します。例えば ​​：

ImageView splash ;
@Override
public boolean onTouchEvent(MotionEvent event) {
    float tx = event.getX();
    float ty = event.getY();

    int action = event.getAction();
    switch(action) {
        case MotionEvent.ACTION_DOWN:
            tx = event.getX();
            ty = event.getY();

            //       findViewById(R.id.character).setX(tx-45);
            //      findViewById(R.id.character).setY(ty-134);

            ObjectAnimator animX = ObjectAnimator.ofFloat(splash, "x", tx-45);
            ObjectAnimator animY = ObjectAnimator.ofFloat(splash, "y", ty-134);
            AnimatorSet animSetXY = new AnimatorSet();
            animSetXY.playTogether(animX, animY);
            animSetXY.start();

            break;
        default:
    }
    return true;
}
9
ArMo 372

以下のコードでは、フレームレイアウトの中央に画像ビューを動的に追加しています。追加後、スケーリングを増やし、アルファを設定してズーム効果を与えます。アニメーションが完了したら、画像ビューをある位置から別の位置に変換します。

Framelayoutに画像ビューを追加

    imgHeart = new ImageView(getBaseContext());
    imgHeart.setId(R.id.heartImage);
    imgHeart.setImageResource(R.drawable.material_heart_fill_icon);
    imgHeart.setLayoutParams(new FrameLayout.LayoutParams(50, 50, Gravity.CENTER));
    mainFrameLaout.addView(imgHeart);

画像ビューにアニメーションを追加する

       imgHeart.animate()
            .scaleXBy(6)
            .scaleYBy(6)
            .setDuration(700)
            .alpha(2)
            .setListener(new Animator.AnimatorListener() {
                @Override
                public void onAnimationStart(Animator animation) {

                }

                @Override
                public void onAnimationEnd(Animator animation) {
                    imgHeart.animate()
                            .scaleXBy(-6f).scaleYBy(-6f)
                            .alpha(.1f)
                            .translationX((heigthAndWidth[0] / 2) - minusWidth)
                            .translationY(-((heigthAndWidth[1] / 2) - minusHeight))
                            .setDuration(1000)
                            .setListener(new Animator.AnimatorListener() {
                                @Override
                                public void onAnimationStart(Animator animation) {
                                }

                                @Override
                                public void onAnimationEnd(Animator animation) {
                                // remove image view from framlayout
                                }
                                @Override
                                public void onAnimationCancel(Animator animation) {
                                }

                                @Override
                                public void onAnimationRepeat(Animator animation) {
                                }
                            }).start();
                }

                @Override
                public void onAnimationCancel(Animator animation) {

                }

                @Override
                public void onAnimationRepeat(Animator animation) {

                }
            }).start();
2
duggu