如何在图像视图中为图像翻转制作动画

Question

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

具有两个imageView，仅显示一个。 单击它时，它会以Y轴动画翻转，并隐藏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();


        }
    });

Answer 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);
    }

}