Animating view to visible causes undesired animations on other views

Question

I'm having some weird affects when trying to animate view from gone to visible. See attached gif.

I have a simple Switch, that toggles visibility of TextView. When TextView changes to visible, there is an undesired animation-like affect on the Button.

I've figured this is something to do with R.id.group layout height. See layout below.

When I remove ScrollView, and change R.id.group layout height to match_parent, it works correctly. But that is not the solution, since I ultimately need a ScrollView.

How to avoid button animation effect?

Source code:

@Override
public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
    super.onViewCreated(view, savedInstanceState);
    Switch sw = view.findViewById(R.id.toggle);
    TextView tv = view.findViewById(R.id.text);
    sw.setOnCheckedChangeListener((button, isChecked) -> {
        int visibility = isChecked ? View.VISIBLE : View.GONE;
        tv.setVisibility(visibility);
    });
}

<?xml version="1.0" encoding="utf-8"?>
<ScrollView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/white"
    android:padding="10dp"
    >

    <LinearLayout
        android:id="@+id/group"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:animateLayoutChanges="true"
            android:orientation="vertical"
            >

            <Switch
                android:id="@+id/toggle"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="toggle"
                />

            <TextView
                android:id="@+id/text"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="Blabla\nblabla\nblabla\nblabla"
                />

        </LinearLayout>

        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Self destruct"
            />

    </LinearLayout>
</ScrollView>

Peter · Answer 1 · 2020-07-01T21:06:09.933

Managed to find out workaround on the world wide web after all. Props to Sam Chen's anwser.

Basically, I needed to set LayoutTransition (aka animateLayoutChanges="true") for R.id.group layout, where Button resides, and enable CHANGING transition:

LayoutTransition transition = new LayoutTransition();
transition.enableTransitionType(LayoutTransition.CHANGING);
groupLayout.setLayoutTransition(transition);

Animating view to visible causes undesired animations on other views

1 Answers1