Collapsing CardView внутри RecyclerView при анимации

Что я пытаюсь сделать

У меня есть CardView с поддерживающим текстом внизу, который по умолчанию является GONE. Я хочу сделать этот раздел карты видимым только тогда, когда пользователь нажимает "стрелку действия", как показано на рисунке ниже:

Развернуть стрелку

Я знаю, что могу добиться этого, просто установив видимость View на VISIBLE, но также хочу оживить события разворота и коллапса.

Проблема и то, что я пробовал до сих пор

Для этого я использовал свойство android:animateLayoutChanges="true" в моем CardView xml, и он отлично работает при его расширении. Но как только я снова нажимаю на стрелку, чтобы свернуть поддерживающий текст, карта ниже накладывается на карту, которую я нажал во время анимации. Как я могу избежать этого перекрытия?

РЕДАКТИРОВАТЬ: Я знаю, что может быть возможно сделать что-то вроде решения по этому вопросу, но это кажется слишком сложным, поскольку android:animateLayoutChanges существует. Я задаюсь вопросом, возможно ли решить мою проблему с использованием этого свойства XML, чтобы оно было простым.

Мой код анимации выглядит следующим образом:

Java-код

protected void expandCard() {
    if (isExpanded) {
        ibt_show_more.animate().rotation(0).start();
        isExpanded = false;
        tv_support.setVisibility(View.GONE);
    }
    else {
        ibt_show_more.animate().rotation(180).start();
        isExpanded = true;
        tv_support.setVisibility(View.VISIBLE);
    }
}

XML-код

<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="@dimen/spacing_small"
    card_view:cardCornerRadius="2dp"
    android:id="@+id/os_list_item_cv">

    <RelativeLayout
        android:id="@+id/os_list_item_rl_root"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:animateLayoutChanges="true">

        <!-- Here goes the header, the image, the action buttons and so on -->
        <!-- Omitted on purpose -->
        <!-- ... -->

        <!-- This is the support TextView -->
        <TextView
            android:id="@+id/tv_support"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@+id/os_list_item_rl_actions"
            android:text="@string/bacon_ipsum"
            android:paddingBottom="24dp"
            android:paddingEnd="16dp"
            android:paddingRight="16dp"
            android:paddingLeft="16dp"
            android:paddingStart="16dp"
            android:visibility="gone"/>

    </RelativeLayout>

</android.support.v7.widget.CardView>

GIF для полноты (с неправильным поведением коллапса)

введите описание изображения здесь

Ответы

Ответ 1

Перед изменением видимости добавьте эту строку кода:

TransitionManager.beginDelayedTransition(the rootView containing the cardView, new AutoTransition());

Вы должны получить гладкую анимацию. Также удалите "animateLayoutChanges = true" из вашего xml до этого.

Что касается этого, вызов TransitionManager.beginDelayedTransition() заставляет TransitionManger фиксировать текущие значения в родительской ViewGroup и отображать анимации в следующем кадре анимации. Переход, переданный в этом случае, является AutoTransition, который заботится обо всех изменениях затухания, перемещения и изменения размера в родительской ViewGroup.

См. Переходы и TransitionManager

Также позаботьтесь о том, чтобы использовать переходы из библиотеки поддержки, где это необходимо, или выполнить необходимые проверки уровня API.