How to Implement Coordinator Behavior  in Android Studio.

Creating New Project.
Open android studio and create a new project.

File => New => New Project => Configure your new project => Select the form factor yours app will run on => Add an Activity to Mobile => Customize the Activity => Finish.
First we need to add Library to our project.
compile 'com.android.support:design:23.2.1'
compile 'com.android.support:cardview-v7:23.2.1'
compile 'de.hdodenhof:circleimageview:1.3.0'

Create Xml file in project.
Open => app => res => layout - activity_main.xml.

<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:ignore="RtlHardcoded"
    >

    <android.support.design.widget.AppBarLayout
        android:id="@+id/main.appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        >

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/main.collapsing"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_scrollFlags="scroll|exitUntilCollapsed|snap"
            >

            <ImageView
                android:id="@+id/main.imageview.placeholder"
                android:layout_width="match_parent"
                android:layout_height="300dp"
                android:scaleType="centerCrop"
                android:src="@drawable/icon_background"
                android:tint="#11000000"
                app:layout_collapseMode="parallax"
                app:layout_collapseParallaxMultiplier="0.9"
                />

            <FrameLayout
                android:id="@+id/main.framelayout.title"
                android:layout_width="match_parent"
                android:layout_height="100dp"
                android:layout_gravity="bottom|center_horizontal"
                android:background="#FF387E8B"
                android:orientation="vertical"
                app:layout_collapseMode="parallax"
                app:layout_collapseParallaxMultiplier="0.3"
                >

                <LinearLayout
                    android:id="@+id/main.linearlayout.title"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginTop="6dp"
                    android:orientation="vertical"
                    >

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center_horizontal"
                        android:gravity="bottom|center"
                        android:text="Arun Kumar Choudhary"
                        android:textColor="@android:color/white"
                        android:textSize="16sp"
                        />

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center_horizontal"
                        android:text="Software Developer"
                        android:textSize="14dp"
                        android:textColor="@android:color/white"
                        />
                </LinearLayout>
            </FrameLayout>
        </android.support.design.widget.CollapsingToolbarLayout>
    </android.support.design.widget.AppBarLayout>


    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scrollbars="none"
        app:behavior_overlapTop="30dp"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <android.support.v7.widget.CardView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="12dp"
            app:cardElevation="8dp"
            app:contentPadding="16dp"
            >
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:lineSpacingExtra="8dp"
                android:text="@string/decription"
                android:textSize="18sp"
                />
        </android.support.v7.widget.CardView>

    </android.support.v4.widget.NestedScrollView>

    <android.support.v7.widget.Toolbar
        android:id="@+id/main.toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="#FF387E8B"
        app:layout_anchor="@id/main.framelayout.title"
        app:theme="@style/ThemeOverlay.AppCompat.Dark"
        app:title="">

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:orientation="horizontal"  >

            <Space
                android:layout_width="@dimen/image_final_width"
                android:layout_height="@dimen/image_final_width"
                />

            <TextView
                android:id="@+id/main.textview.title"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_marginLeft="8dp"
                android:gravity="center_vertical"
                android:text="Android Developer"
                android:textColor="@android:color/white"
                android:textSize="20sp"
                />

        </LinearLayout>
    </android.support.v7.widget.Toolbar>

    <de.hdodenhof.circleimageview.CircleImageView
        android:layout_width="@dimen/image_width"
        android:layout_height="@dimen/image_width"
        android:layout_gravity="center_horizontal"
        android:src="@drawable/icon_background"
        app:border_color="@android:color/white"
        app:border_width="2dp"
        app:finalHeight="@dimen/image_final_width"
        app:finalYPosition="2dp"
        app:layout_behavior="saulmm.myapplication.ImageBehavior"
        app:startHeight="2dp"
        app:startToolbarPosition="2dp"
        android:layout_marginBottom="12dp"
        app:startXPosition="2dp"
        />
</android.support.design.widget.CoordinatorLayout>


Create the Java file in project.
Open app => main => src = MainActivity.java

import android.os.Bundle;
import android.support.design.widget.AppBarLayout;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.View;
import android.view.animation.AlphaAnimation;
import android.widget.LinearLayout;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity implements AppBarLayout.OnOffsetChangedListener {

    private static final float PERCENTAGE_TO_SHOW_TITLE_AT_TOOLBAR  = 0.9f;
    private static final float PERCENTAGE_TO_HIDE_TITLE_DETAILS     = 0.3f;
    private static final int ALPHA_ANIMATIONS_DURATION              = 200;
    private boolean mIsTheTitleVisible          = false;
    private boolean mIsTheTitleContainerVisible = true;
    private LinearLayout mTitleContainer;
    private TextView mTitle;
    private AppBarLayout mAppBarLayout;
    private Toolbar mToolbar;


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

        bindActivity();

        mAppBarLayout.addOnOffsetChangedListener(this);

        mToolbar.inflateMenu(R.menu.menu_main);
        startAlphaAnimation(mTitle, 0, View.INVISIBLE);
    }

    private void bindActivity() {
        mToolbar        = (Toolbar) findViewById(R.id.main_toolbar);
        mTitle          = (TextView) findViewById(R.id.main_textview_title);
        mTitleContainer = (LinearLayout) findViewById(R.id.main_linearlayout_title);
        mAppBarLayout   = (AppBarLayout) findViewById(R.id.main_appbar);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public void onOffsetChanged(AppBarLayout appBarLayout, int offset) {
        int maxScroll = appBarLayout.getTotalScrollRange();
        float percentage = (float) Math.abs(offset) / (float) maxScroll;

        handleAlphaOnTitle(percentage);
        handleToolbarTitleVisibility(percentage);
    }

    private void handleToolbarTitleVisibility(float percentage) {
            if (percentage >= PERCENTAGE_TO_SHOW_TITLE_AT_TOOLBAR) {

                if(!mIsTheTitleVisible) {
                    startAlphaAnimation(mTitle, ALPHA_ANIMATIONS_DURATION, View.VISIBLE);
                    mIsTheTitleVisible = true;
                }

            } else {

                if (mIsTheTitleVisible) {
                    startAlphaAnimation(mTitle, ALPHA_ANIMATIONS_DURATION, View.INVISIBLE);
                    mIsTheTitleVisible = false;
                }
            }
    }

    private void handleAlphaOnTitle(float percentage) {
        if (percentage >= PERCENTAGE_TO_HIDE_TITLE_DETAILS) {
            if(mIsTheTitleContainerVisible) {
                startAlphaAnimation(mTitleContainer, ALPHA_ANIMATIONS_DURATION, View.INVISIBLE);
                mIsTheTitleContainerVisible = false;
            }

        } else {

            if (!mIsTheTitleContainerVisible) {
                startAlphaAnimation(mTitleContainer, ALPHA_ANIMATIONS_DURATION, View.VISIBLE);
                mIsTheTitleContainerVisible = true;
            }
        }
    }

    public static void startAlphaAnimation (View v, long duration, int visibility) {
        AlphaAnimation alphaAnimation = (visibility == View.VISIBLE)
            ? new AlphaAnimation(0f, 1f)
            : new AlphaAnimation(1f, 0f);

        alphaAnimation.setDuration(duration);
        alphaAnimation.setFillAfter(true);
        v.startAnimation(alphaAnimation);
    }
}

Create the Java file in project.
Open app => main => src = ImageBehavior.java

import android.content.Context;
import android.content.res.TypedArray;
import android.support.design.widget.CoordinatorLayout;
import android.support.v7.widget.Toolbar;
import android.util.AttributeSet;
import android.view.View;
import de.hdodenhof.circleimageview.CircleImageView;

@SuppressWarnings("unused")
public class ImageBehavior extends CoordinatorLayout.Behavior<CircleImageView> {

    private final static float MIN_AVATAR_PERCENTAGE_SIZE   = 0.3f;
    private final static int EXTRA_FINAL_AVATAR_PADDING     = 80;

    private final static String TAG = "behavior";
    private Context mContext;

    private float mCustomFinalYPosition;
    private float mCustomStartXPosition;
    private float mCustomStartToolbarPosition;
    private float mCustomStartHeight;
    private float mCustomFinalHeight;

    private float mAvatarMaxSize;
    private float mFinalLeftAvatarPadding;
    private float mStartPosition;
    private int mStartXPosition;
    private float mStartToolbarPosition;
    private int mStartYPosition;
    private int mFinalYPosition;
    private int mStartHeight;
    private int mFinalXPosition;
    private float mChangeBehaviorPoint;

    public ImageBehavior(Context context, AttributeSet attrs) {
        mContext = context;

        if (attrs != null) {
            TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.ImageBehavior);
            mCustomFinalYPosition = a.getDimension(R.styleable.ImageBehavior_finalYPosition, 0);
            mCustomStartXPosition = a.getDimension(R.styleable.ImageBehavior_startXPosition, 0);
            mCustomStartToolbarPosition = a.getDimension(R.styleable.ImageBehavior_startToolbarPosition, 0);
            mCustomStartHeight = a.getDimension(R.styleable.ImageBehavior_startHeight, 0);
            mCustomFinalHeight = a.getDimension(R.styleable.ImageBehavior_finalHeight, 0);

            a.recycle();
        }

        init();

        mFinalLeftAvatarPadding = context.getResources().getDimension(
            R.dimen.spacing_normal);
    }

    private void init() {
        bindDimensions();
    }

    private void bindDimensions() {
        mAvatarMaxSize = mContext.getResources().getDimension(R.dimen.image_width);
    }

    @Override
    public boolean layoutDependsOn(CoordinatorLayout parent, CircleImageView child, View dependency) {
        return dependency instanceof Toolbar;
    }

    @Override
    public boolean onDependentViewChanged(CoordinatorLayout parent, CircleImageView child, View dependency) {
        maybeInitProperties(child, dependency);

        final int maxScrollDistance = (int) (mStartToolbarPosition);
        float expandedPercentageFactor = dependency.getY() / maxScrollDistance;

        if (expandedPercentageFactor < mChangeBehaviorPoint) {
            float heightFactor = (mChangeBehaviorPoint - expandedPercentageFactor) / mChangeBehaviorPoint;

            float distanceXToSubtract = ((mStartXPosition - mFinalXPosition)
                    * heightFactor) + (child.getHeight()/2);
            float distanceYToSubtract = ((mStartYPosition - mFinalYPosition)
                    * (1f - expandedPercentageFactor)) + (child.getHeight()/2);

            child.setX(mStartXPosition - distanceXToSubtract);
            child.setY(mStartYPosition - distanceYToSubtract);

            float heightToSubtract = ((mStartHeight - mCustomFinalHeight) * heightFactor);

            CoordinatorLayout.LayoutParams lp = (CoordinatorLayout.LayoutParams) child.getLayoutParams();
            lp.width = (int) (mStartHeight - heightToSubtract);
            lp.height = (int) (mStartHeight - heightToSubtract);
            child.setLayoutParams(lp);
        } else {
            float distanceYToSubtract = ((mStartYPosition - mFinalYPosition)
                    * (1f - expandedPercentageFactor)) + (mStartHeight/2);

            child.setX(mStartXPosition - child.getWidth()/2);
            child.setY(mStartYPosition - distanceYToSubtract);

            CoordinatorLayout.LayoutParams lp = (CoordinatorLayout.LayoutParams) child.getLayoutParams();
            lp.width = (int) (mStartHeight);
            lp.height = (int) (mStartHeight);
            child.setLayoutParams(lp);
        }
        return true;
    }

    private void maybeInitProperties(CircleImageView child, View dependency) {
        if (mStartYPosition == 0)
            mStartYPosition = (int) (dependency.getY());

        if (mFinalYPosition == 0)
            mFinalYPosition = (dependency.getHeight() /2);

        if (mStartHeight == 0)
            mStartHeight = child.getHeight();

        if (mStartXPosition == 0)
            mStartXPosition = (int) (child.getX() + (child.getWidth() / 2));

        if (mFinalXPosition == 0)
            mFinalXPosition = mContext.getResources().getDimensionPixelOffset(R.dimen.abc_action_bar_content_inset_material) + ((int) mCustomFinalHeight / 2);

        if (mStartToolbarPosition == 0)
            mStartToolbarPosition = dependency.getY();

        if (mChangeBehaviorPoint == 0) {
            mChangeBehaviorPoint = (child.getHeight() - mCustomFinalHeight) / (2f * (mStartYPosition - mFinalYPosition));
        }
    }

    public int getStatusBarHeight() {
        int result = 0;
        int resourceId = mContext.getResources().getIdentifier("status_bar_height", "dimen", "android");

        if (resourceId > 0) {
            result = mContext.getResources().getDimensionPixelSize(resourceId);
        }
        return result;
    }
}

Add some xml file in values folder.
attrs.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="ImageBehavior">
        <attr name="finalYPosition" format="dimension"/>
        <attr name="startXPosition" format="dimension"/>
        <attr name="startToolbarPosition" format="dimension"/>
        <attr name="startHeight" format="dimension"/>
        <attr name="finalHeight" format="dimension"/>
    </declare-styleable>
</resources>

string.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- strings -->
    <string name="app_name">CoordinatorDemo</string>
    <string name="decription">enter the description here</string>
    <!-- colors -->
    <color name="primary">#785447</color>
    <color name="primaryDark">#5B3F36</color>

    <!-- dimensions -->
    <dimen name="image_width">120dp</dimen>
    <dimen name="image_final_width">32dp</dimen>
    <dimen name="spacing_normal">16dp</dimen>

    <!-- styles -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="colorPrimary">@color/primary</item>
        <item name="colorPrimaryDark">@color/primaryDark</item>
    </style>
</resources>
Add some xml file in menu folder.
menu_main.xml
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    tools:context=".MainActivity">
    <item android:id="@+id/menu_share"
        android:icon="@mipmap/ic_launcher"
        app:showAsAction="always"
        android:title="Favorite" />
</menu>

Screen:-

     

 

Add caption

Reveal Animation And Ripple Effect in Android Studio.

Creating New Project.
Open android studio and create a new project.

File => New => New Project => Configure your new project => Select the form factor yours app will run on => Add an Activity to Mobile => Customize the Activity => Finish.

First we need to add Library to our project.
compile 'com.android.support:design:25.3.1'

Create Xml file in project.
Open => app => res => layout - activity_main.xml.

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

       <include layout="@layout/app_bar" />

    <LinearLayout
        android:id="@+id/layView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="?attr/actionBarSize"
        android:background="#b3e5fc"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="5dp"
            android:gravity="center"
            android:orientation="horizontal">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="10dp"
                android:layout_weight="1"
                android:gravity="center"
                android:orientation="vertical">

                <ImageButton
                    android:id="@+id/one"
                    android:layout_width="50dp"
                    android:layout_height="50dp"
                    android:background="@mipmap/ic_launcher" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="5dp"
                    android:text="One" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="10dp"
                android:layout_weight="1"
                android:gravity="center"
                android:orientation="vertical">

                <ImageButton
                    android:id="@+id/two"
                    android:layout_width="50dp"
                    android:layout_height="50dp"
                    android:background="@mipmap/ic_launcher" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="5dp"
                    android:text="Two" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="10dp"
                android:layout_weight="1"
                android:gravity="center"
                android:orientation="vertical">

                <ImageButton
                    android:id="@+id/three"
                    android:layout_width="50dp"
                    android:layout_height="50dp"
                    android:background="@mipmap/ic_launcher" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="5dp"
                    android:text="Three" />
            </LinearLayout>

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="10dp"
            android:gravity="center"
            android:orientation="horizontal">

            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_margin="10dp"
                android:layout_weight="1"
                android:gravity="center"
                android:orientation="vertical">

                <ImageButton
                    android:id="@+id/four"
                    android:layout_width="50dp"
                    android:layout_height="50dp"
                    android:background="@mipmap/ic_launcher" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="5dp"
                    android:text="Four" />

            </LinearLayout>

            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_margin="10dp"
                android:layout_weight="1"
                android:gravity="center"
                android:orientation="vertical">

                <ImageButton
                    android:id="@+id/five"
                    android:layout_width="50dp"
                    android:layout_height="50dp"
                    android:background="@mipmap/ic_launcher" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="5dp"
                    android:text="Five" />

            </LinearLayout>

            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_margin="10dp"
                android:layout_weight="1"
                android:gravity="center"
                android:orientation="vertical">

                <ImageButton
                    android:id="@+id/six"
                    android:layout_width="50dp"
                    android:layout_height="50dp"
                    android:background="@mipmap/ic_launcher" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="5dp"
                    android:text="Six" />

            </LinearLayout>

        </LinearLayout>

        <View
            android:layout_width="match_parent"
            android:layout_height="2dp"
            android:background="@android:color/black" />
    </LinearLayout>

</FrameLayout>

Create Xml file in project.
Open => app => res => layout - app_bar.xml.

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:local="http://schemas.android.com/apk/res-auto"
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:minHeight="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    local:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    local:popupTheme="@style/ThemeOverlay.AppCompat.Light" />


Create the Java file in project.
Open app => main => src = MainActivity.java

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.animation.Animator;
import android.animation.AnimatorListenerAdapter;
import android.support.design.widget.Snackbar;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewAnimationUtils;
import android.view.animation.AccelerateDecelerateInterpolator;
import android.widget.ImageButton;
import android.widget.LinearLayout;

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    Toolbar toolbar;
    boolean hidden = true;
    LinearLayout viewLinearLayout;
    ImageButton oneImageButton, twoImageButton, threeImageButton, fourImageButton, fiveImageButton, sixImageButton;

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


        toolbar = (Toolbar) findViewById(R.id.toolbar);
        viewLinearLayout = (LinearLayout) findViewById(R.id.layView);
        oneImageButton = (ImageButton) findViewById(R.id.one);
        twoImageButton = (ImageButton) findViewById(R.id.two);
        threeImageButton = (ImageButton) findViewById(R.id.three);
        fourImageButton = (ImageButton) findViewById(R.id.four);
        fiveImageButton = (ImageButton) findViewById(R.id.five);
        sixImageButton = (ImageButton) findViewById(R.id.six);
        //Using the click event here...
        oneImageButton.setOnClickListener(this);
        twoImageButton.setOnClickListener(this);
        threeImageButton.setOnClickListener(this);
        fourImageButton.setOnClickListener(this);
        fiveImageButton.setOnClickListener(this);
        sixImageButton.setOnClickListener(this);

        setSupportActionBar(toolbar);

        viewLinearLayout.setVisibility(View.INVISIBLE);
    }

    // Using the click even here...
    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.one:
                Snackbar.make(v, "One Clicked", Snackbar.LENGTH_SHORT).show();
                viewLinearLayout.setVisibility(View.INVISIBLE);
                hidden = true;
                break;
            case R.id.two:

                viewLinearLayout.setVisibility(View.INVISIBLE);
                hidden = true;
                break;
            case R.id.three:

                viewLinearLayout.setVisibility(View.INVISIBLE);
                hidden = true;
                break;
            case R.id.four:

                viewLinearLayout.setVisibility(View.INVISIBLE);
                hidden = true;
                break;
            case R.id.five:
                viewLinearLayout.setVisibility(View.INVISIBLE);
                hidden = true;
                break;
            case R.id.six:
                viewLinearLayout.setVisibility(View.INVISIBLE);
                hidden = true;
                break;
        }
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        int id = item.getItemId();
        if (id == R.id.attachment) {// attachment icon click event

            // finding X and Y co-ordinates
            int cx = (viewLinearLayout.getLeft() + viewLinearLayout.getRight());
            int cy = (viewLinearLayout.getTop());

            // to find  radius when icon is tapped for showing layout
            int startradius = 0;
            int endradius = Math.max(viewLinearLayout.getWidth(), viewLinearLayout.getHeight());

            // performing circular reveal when icon will be tapped
            Animator animator = ViewAnimationUtils.createCircularReveal(viewLinearLayout, cx, cy, startradius, endradius);
            animator.setInterpolator(new AccelerateDecelerateInterpolator());
            animator.setDuration(400);

            //reverse animation
            // to find radius when icon is tapped again for hiding layout
            //  starting radius will be the radius or the extent to which circular reveal animation is to be shown

            int reverse_startradius = Math.max(viewLinearLayout.getWidth(), viewLinearLayout.getHeight());

            //endradius will be zero
            int reverse_endradius = 0;

            // performing circular reveal for reverse animation
            Animator animate = ViewAnimationUtils.createCircularReveal(viewLinearLayout, cx, cy, reverse_startradius, reverse_endradius);
            if (hidden) {

                // to show the layout when icon is tapped
                viewLinearLayout.setVisibility(View.VISIBLE);
                animator.start();
                hidden = false;
            } else {
                viewLinearLayout.setVisibility(View.VISIBLE);

                // to hide layout on animation end
                animate.addListener(new AnimatorListenerAdapter() {
                    @Override
                    public void onAnimationEnd(Animator animation) {
                        super.onAnimationEnd(animation);
                        viewLinearLayout.setVisibility(View.INVISIBLE);
                        hidden = true;
                    }
                });
                animate.start();
            }
            return true;
        }
        return super.onOptionsItemSelected(item);
    }
}

May this code help you. Thanks!!!!!!

Screen Shot:-

Implement the Custom Expandable ListView in Android.

Creating New Project.

Open android studio and create a new project.

File => New => New Project => Configure your new project => Select the form factor yours app will run on => Add an Activity to Mobile => Customize the Activity => Finish.

First we need to add Library to our project.

compile 'com.mcxiaoke.volley:library-aar:1.0.0'

Create Xml file in project.

Open => app => res => layout - activity_main.xml.

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:tools="http://schemas.android.com/tools"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    tools:context=".MainActivity" >

    <ExpandableListView

        android:id="@+id/exp_list"

        android:layout_width="match_parent"

        android:layout_height="fill_parent" >

    </ExpandableListView>

    

</RelativeLayout>

Open => app => res => layout - child_item.xml.

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:layout_marginLeft="50dp"

    android:paddingBottom="4dp"

    android:paddingTop="4dp" >

    <TextView

        android:id="@+id/country_name"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="TextView"

        android:textSize="20dp" />

    

</RelativeLayout>

Open => app => res => layout - group_item.xml.

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical"

    android:padding="10dp" >

    <TextView

        android:id="@+id/group_name"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:paddingLeft="25dp"

        android:textSize="25dp" />

</LinearLayout>

Create the Java file in project.

Open app => main => src = MainActivity.java

public class MainActivity extends Activity {

    String url = "http://www.androidbegin.com/tutorial/jsonparsetutorial.txt";

    ProgressDialog dialog;

    private ExpandListAdapter ExpAdapter;

    private ExpandableListView ExpandList;

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);

        ExpandList = (ExpandableListView) findViewById(R.id.exp_list);

        dialog = new ProgressDialog(this);

        dialog.setMessage("Loading.....");

        dialog.setCancelable(false);

        getSpinnerData();

    }

    //Get the country data here...

    private void getSpinnerData() {

        dialog.show();

        JsonObjectRequest jsonObjReq = new JsonObjectRequest(Method.GET, url,

                null, new Response.Listener<JSONObject>() {

            @Override

            public void onResponse(JSONObject response) {

                ArrayList<Group> list = new ArrayList<Group>();

                ArrayList<Child> ch_list;

                try {

                    Iterator<String> key = response.keys();

                    while (key.hasNext()) {

                        String k = key.next();

                        Group gru = new Group();

                        gru.setName(k);

                        ch_list = new ArrayList<Child>();

                        JSONArray ja = response.getJSONArray(k);

                        for (int i = 0; i < ja.length(); i++) {

                            JSONObject jo = ja.getJSONObject(i);

                            Child ch = new Child();

                            ch.setName(jo.getString("population"));

                            ch_list.add(ch);

                        } // for loop end

                        gru.setItems(ch_list);

                        list.add(gru);

                    } // while loop end

                    ExpAdapter = new ExpandListAdapter(MainActivity.this, list);

                    ExpandList.setAdapter(ExpAdapter);

                    dialog.dismiss();

                } catch (JSONException e) {

                    e.printStackTrace();

                }

            }

        },

                new Response.ErrorListener() {

                    @Override

                    public void onErrorResponse(VolleyError error) {

                        dialog.dismiss();

                    }

                });

        //Creating a request queue

        RequestQueue requestQueue = Volley.newRequestQueue(this);

        //Adding request to the queue

        requestQueue.add(jsonObjReq);

    }

    //**********END**

}

Create the Java file in project.

Open app => main => src = ExpandListAdapter.java

public class ExpandListAdapter extends BaseExpandableListAdapter {

    private Context context;

    private ArrayList<Group> groups;

    public ExpandListAdapter(Context context, ArrayList<Group> groups) {

        this.context = context;

        this.groups = groups;

    }

    @Override

    public Object getChild(int groupPosition, int childPosition) {

        ArrayList<Child> chList = groups.get(groupPosition).getItems();

        return chList.get(childPosition);

    }

    @Override

    public long getChildId(int groupPosition, int childPosition) {

        return childPosition;

    }

    @Override

    public View getChildView(int groupPosition, int childPosition,

                             boolean isLastChild, View convertView, ViewGroup parent) {

        Child child = (Child) getChild(groupPosition, childPosition);

        if (convertView == null) {

            LayoutInflater infalInflater = (LayoutInflater) context

                    .getSystemService(context.LAYOUT_INFLATER_SERVICE);

            convertView = infalInflater.inflate(R.layout.child_item, null);

        }

        TextView tv = (TextView) convertView.findViewById(R.id.country_name);

        tv.setText(child.getName().toString());

        return convertView;

    }

    @Override

    public int getChildrenCount(int groupPosition) {

        ArrayList<Child> chList = groups.get(groupPosition).getItems();

        return chList.size();

    }

    @Override

    public Object getGroup(int groupPosition) {

        return groups.get(groupPosition);

    }

    @Override

    public int getGroupCount() {

        return groups.size();

    }

    @Override

    public long getGroupId(int groupPosition) {

        return groupPosition;

    }

    @Override

    public View getGroupView(int groupPosition, boolean isExpanded,

                             View convertView, ViewGroup parent) {

        Group group = (Group) getGroup(groupPosition);

        if (convertView == null) {

            LayoutInflater inf = (LayoutInflater) context

                    .getSystemService(context.LAYOUT_INFLATER_SERVICE);

            convertView = inf.inflate(R.layout.group_item, null);

        }

        TextView tv = (TextView) convertView.findViewById(R.id.group_name);

        tv.setText(group.getName());

        return convertView;

    }

    @Override

    public boolean hasStableIds() {

        return true;

    }

    @Override

    public boolean isChildSelectable(int groupPosition, int childPosition) {

        return true;

    }

}

Create the Java file in project.

Open app => main => src = Group.java

public class Group {

    private String Name;

    private ArrayList<Child> Items;

    public String getName() {

        return Name;

    }

    public void setName(String name) {

        this.Name = name;

    }

    public ArrayList<Child> getItems() {

        return Items;

    }

    public void setItems(ArrayList<Child> Items) {

        this.Items = Items;

    }

}

Create the Java file in project.

Open app => main => src = Child.java

public class Child {

    private String Name;

    private String Image;

    public String getName() {

        return Name;

    }

    public void setName(String Name) {

        this.Name = Name;

    }

    public String getImage() {

        return Image;

    }

    public void setImage(String Image) {

        this.Image = Image;

    }

}

Add Internet permission in your manifest.

<uses-permission android:name="android.permission.INTERNET" />