android - 使用AnimatorSet在两个View之间实现卡片翻转动画

Question

我正在制作一个汉字抽认卡应用程序。我想要一个 LinearLayout 代表卡片的正面，另一个代表卡片的背面，我已经在一个 XML 布局中声明了这两者。问题是，第二个 LinearLayout 总是不可见的，第一个动画正常。无论如何在动画进行时进行方法调用？我想将第一个布局的可见性设置为 GONE，将第二个布局设置为 VISIBLE？

或者还有其他更好的方法来实现翻转卡片吗？

下面是我的代码。提前致谢。

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/card_container_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="#ff825e4e" >

        <LinearLayout
            android:id="@+id/card_front_layout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="10dp"
            android:gravity="center"
            android:background="@drawable/card_shape_front">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="傘"
                android:textColor="#ff000000"
                android:textSize="200sp"/>
        </LinearLayout>

        <LinearLayout
            android:id="@+id/card_back_layout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center"
            android:layout_margin="10dp"
            android:background="@drawable/card_shape_front">

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="16dp"
                android:gravity="center"
                android:text="QWERTY"
                android:textColor="#ff000000"/>
        </LinearLayout>
</LinearLayout>

抽认卡 fragment .java

public class FlashcardsFragment extends Fragment
{
    private AnimatorSet showFrontAnim = new AnimatorSet();
    private AnimatorSet showBackAnim = new AnimatorSet();
    private boolean isShowingBack = false;

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)
    {
        View v =  inflater.inflate(R.layout.fragment_flashcard, container, false);

        LinearLayout cardFront = (LinearLayout) v.findViewById(R.id.card_front_layout);
        LinearLayout cardBack = (LinearLayout) v.findViewById(R.id.card_back_layout);

        // Load the animator sets from XML and group them together

        AnimatorSet leftIn   = (AnimatorSet) AnimatorInflater
                .loadAnimator(getActivity(), R.animator.card_flip_left_in);
        AnimatorSet rightOut = (AnimatorSet) AnimatorInflater
                .loadAnimator(getActivity(), R.animator.card_flip_right_out);
        AnimatorSet leftOut  = (AnimatorSet) AnimatorInflater
                .loadAnimator(getActivity(), R.animator.card_flip_left_out);
        AnimatorSet rightIn  = (AnimatorSet) AnimatorInflater
                .loadAnimator(getActivity(), R.animator.card_flip_right_in);

        leftIn.setTarget(cardFront);
        rightOut.setTarget(cardBack);
        showFrontAnim.playTogether(leftIn, rightOut);

        leftOut.setTarget(cardFront);
        rightIn.setTarget(cardBack);
        showBackAnim.playTogether(leftOut, rightIn);

        LinearLayout cardContainer = (LinearLayout) 
                v.findViewById(R.id.card_container_layout);
        // Set the flip animation to be triggered on container clicking
        cardContainer.setOnClickListener(new View.OnClickListener()
        {
            @Override
            public void onClick(View v)
            {
                if (isShowingBack) {
                    showFrontAnim.start();
                    isShowingBack = false;
                }
                else {
                    showBackAnim.start();
                    isShowingBack = true;
                }
            }
        });

        return v;
    }
}

Answer 1

编辑:我的问题已经解决，我将容器布局更改为FrameLayout，这样两个 View 就可以相互重叠。谢谢大家:))