Animating Layout Changes

This lesson teaches you to:

  1. Create the Layout
  2. Add, Update, or Remove Items from the Layout

Try it out

Download the sample app

Animations.zip

A layout animation is a pre-loaded animation that the system runs each time you make a change to the layout configuration. All you need to do is set an attribute in the layout to tell the Android system to animate these layout changes, and system-default animations are carried out for you.

Tip: If you want to supply custom layout animations, create a LayoutTransition object and supply it to the layout with the setLayoutTransition() method.

Here's what a default layout animation looks like when adding items to a list:

Layout animation
 

If you want to jump ahead and see a full working example, download and run the sample app and select the Crossfade example. See the following files for the code implementation:

  1. src/LayoutChangesActivity.java
  2. layout/activity_layout_changes.xml
  3. menu/activity_layout_changes.xml

Create the Layout

In your activity's layout XML file, set the android:animateLayoutChanges attribute to true for the layout that you want to enable animations for. For instance:

<LinearLayout android:id="@+id/container"
    android:animateLayoutChanges="true"
    ...
/>

Add, Update, or Remove Items from the Layout

Now, all you need to do is add, remove, or update items in the layout and the items are animated automatically:

private ViewGroup mContainerView;
...
private void addItem() {
    View newView;
    ...
    mContainerView.addView(newView, 0);
}