如何动画在图像视图中翻转图像

时间:2016-08-18 22:58:34

标签: android android-animation android-imageview

实际上问题是为什么在第一次翻转动画之后,图像总是以翻转显示(看起来图像总是从其原始位置开始)状态。

有两个imageView,只显示一个。单击它时,它将通过Y ax动画翻转,并隐藏imageView然后显示另一个imageView。再次单击时,它将重复该过程以翻转第一张图像。

问题是当点击图像时它会动画翻转并从一个图像切换到另一个图像,翻转和开关工作正常。但是下次再次点击它时,它会想要切换回另一个图像并将其翻转。但是动画后的图像保持翻转状态(反转图像)。

下面的代码段,

<RelativeLayout
    android:id="@+id/imager_contaner"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:layout_marginLeft="5dp">

<ImageView
    android:id="@+id/imgAvatar"
    android:layout_width="28dp"
    android:layout_height="28dp"
    android:layout_gravity="center"
    android:background="@drawable/oval"
    android:src="@mipmap/iamge_one”
    android:scaleType="fitCenter"
/>

<ImageView
    android:id="@+id/imgAvatar_checked"
    android:layout_width="28dp"
    android:layout_height="28dp"
    android:layout_gravity="center"
    android:scaleType="fitCenter"
    android:background="@drawable/oval"
    android:src="@mipmap/check_icon”
    android:visibility="gone"
    />
</RelativeLayout>


View imager_contaner = convertView.findViewById(R.id. imager_contaner);
final ImageView ivAvatar = (ImageView)convertView.findViewById(R.id.imgAvatar);
ImageView avatarChecked = (ImageView)convertView.findViewById(R.id.imgAvatar_checked);

vatarContainer.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {

            Object o = imager_contaner.getTag();

            final boolean isChecked = (o != null && (o instanceof String) && ((String)(o)).equals("checked"));
            if (isChecked) {
                imager_contaner.setTag("");
            } else {
                imager_contaner.setTag("checked");
            }

            final int rotate = 179; //!isChecked ? 179 : -179;

            final View animAvatarView = !isChecked ? showingAvater : avatarChecked;

            ObjectAnimator anim3 = ObjectAnimator.ofFloat(animAvatarView, "rotationY", 0, rotate);
            anim3.setDuration(500);
            anim3.addListener(new Animator.AnimatorListener() {
                @Override
                public void onAnimationStart(Animator animation) {

                }

                @Override
                public void onAnimationEnd(Animator animation) {

                    if (!isChecked) {
                        showingAvater.setVisibility(View.GONE);
                        avatarChecked.setVisibility(View.VISIBLE);                      
                    }       
                    else {
                        avatarChecked.setVisibility(View.GONE);
                        showingAvater.setVisibility(View.VISIBLE);
                    }

                }

                @Override
                public void onAnimationCancel(Animator animation) {

                }

                @Override
                public void onAnimationRepeat(Animator animation) {

                }
            });

            anim3.start();


        }
    });

1 个答案:

答案 0 :(得分:1)

以下是发生的事情:

  • 先旋转ImageView 179
  • 先隐藏ImageView并显示第二个ImageView
  • 将第二个ImageView轮换为179
  • 隐藏第二个ImageView,然后再次显示ImageView

第一个ImageView被旋转了179,然后可见性设置为GONE,但它仍然旋转了179.第一个ImageView的旋转永远不会重置为零,你是只是隐藏然后重新显示已经轮换的ImageView

在您的onAnimationEnd中,您可以添加代码来重置rotationY属性,例如

@Override
public void onAnimationEnd(Animator animation) {

    if (!isChecked) {
        showingAvater.setVisibility(View.GONE);
        showingAvater.setRotationY(0);
        avatarChecked.setVisibility(View.VISIBLE);                      
    }       
    else {
        avatarChecked.setVisibility(View.GONE);
        avatarChecked.setRotationY(0);
        showingAvater.setVisibility(View.VISIBLE);
    }

}