Question

I have a card game where the cards are represented as a layout object containing a large toggle button with the background image of the card, and textviews representing the rank and suit of the card.

<RelativeLayout
            android:id="@+id/card1">
        <ToggleButton
                android:id="@+id/cardback1" android:background="@drawable/blank_card"  android:checked="false" android:textOff='' android:textOn="HELD" android:textColor="@android:color/holo_red_dark" android:clickable="true" android:enabled="false"/>
        <TextView
                android:id="@+id/rank1"
                android:textColor="@android:color/holo_red_light"
                android:textIsSelectable="false" 
                android:textSize="16dp"
                android:layout_alignParentTop="true" android:layout_marginTop="5dp"
                android:layout_marginLeft="7dp" android:textAlignment="center"/>
        <TextView
                android:id="@+id/suit1" android:text="@string/suit_diamond"
                android:textColor="@android:color/holo_red_light"
                android:textIsSelectable="false" android:typeface="normal"
                android:textSize="24dp"
                android:layout_centerInParent="true"/>
</RelativeLayout>

When redealing cards I wanted to apply a custom animation to show the card as “flipping” which I am doing in a series of Object Animators, rotating on the Y axis
The animators I use are defined like:

 <objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
       android:valueFrom="0" android:valueTo="360" android:propertyName="rotationY" > </objectAnimator>

And then I’m animating the RelativeLayout referenced in the layout xml.

  RelativeLayout cardLayout = (RelativeLayout)findViewById(R.id.card1);
 Animator initialAnimator = (ObjectAnimator) AnimatorInflater.loadAnimator(cardLayout.getContext(), R.anim.flip360);
    initialAnimator.setTarget(cardLayout);
    initialAnimator.setDuration(1000);
    initialAnimator.start();

However, during the animation, none of the text on the layout is displaying at all. The button image rotates as expected, but the text doesn’t display until the animation has completed.

I was previously using a much simpler animation on the cardLayout, simply scaling on the Y axis to emulate rotation, but it didn’t look very good. However, when using that method, the text still displayed on the card during the animation. Is there something I need to be configuring so the text can be shown on the card and animated along with the image, or do I need to add custom animations to all elements of the card separately?

Answer 1

I think stumbled across the answer myself when going through the Android API documentation so I thought I’d just post it here in case someone comes along with the same issue.

By enabling the drawingCache before calling the animation:

cardLayout.setDrawingCacheEnabled(true);

I am getting the layout to render as a bitmap before it begins animating, which includes the text contained within the layout.