Simple way to Animating Layout Changes in Android.

By | November 6, 2014

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.

    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);
}

Here is the complete sample layout file.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:id="@+id/container"
    android:orientation="vertical"
    android:layout_height="match_parent"
    tools:context=".MainActivity" 
    android:animateLayoutChanges="true">

    <Button
        android:id="@+id/buttonAdd"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Add Views" />

     <Button
        android:id="@+id/buttonRemove"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Remove Views" />
     
</LinearLayout>

The MainActivity file.

package com.coderzheaven.demo1;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.LinearLayout;

public class MainActivity extends Activity {

	LinearLayout mContainerView;
	int id = 0;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);

		mContainerView = (LinearLayout) findViewById(R.id.container);
		Button click = (Button) findViewById(R.id.buttonAdd);
		click.setOnClickListener(new OnClickListener() {

			@Override
			public void onClick(View arg0) {
				addView();
			}
		});
		Button remove = (Button) findViewById(R.id.buttonRemove);
		remove.setOnClickListener(new OnClickListener() {

			@Override
			public void onClick(View arg0) {
				removeView();
			}
		});
	}

	void addView() {
		Button b = new Button(this);
		b.setId(id++);
		b.setText("Button " + id);
		mContainerView.addView(b, 0);
	}

	void removeView() {

		View v = (View) findViewById(id - 1);
		if (v != null) {
			id--;
			v.setVisibility(View.GONE);
		}
	}
}

Just try with a sample layout and see the magic.

Leave a Reply

Your email address will not be published. Required fields are marked *