How to create Accordion in android

Accordion simple Example

MainActivity.java

public class MainActivity extends ListActivity implements OnClickListener
{
public OnLongClickListener longClickListner;
LinearLayout panel1,panel2,panel3,panel4,panel5;
TextView text1,text2,text3,text4,text5;
View openLayout;
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
panel1 = (LinearLayout) findViewById(R.id.panel1);
panel2 = (LinearLayout) findViewById(R.id.panel2);
panel3 = (LinearLayout) findViewById(R.id.panel3);
panel4 = (LinearLayout) findViewById(R.id.panel4);
panel5 = (LinearLayout) findViewById(R.id.panel5);
//panel1.setVisibility(View.VISIBLE);
//panel1.setVisibility(View.VISIBLE);
//Log.v(“CZ”,”height at first …” + panel1.getMeasuredHeight());
text1 = (TextView) findViewById(R.id.text1);
text2 = (TextView) findViewById(R.id.text2);
text3 = (TextView) findViewById(R.id.text3);
text4 = (TextView) findViewById(R.id.text4);
text5 = (TextView) findViewById(R.id.text5);
text1.setOnClickListener(this);
text2.setOnClickListener(this);
text3.setOnClickListener(this);
text4.setOnClickListener(this);
text5.setOnClickListener(this);
}
@Override
public void onClick(View v)
{
hideOthers(v);
}
private void hideThemAll()
{
if(openLayout == null) return;
if(openLayout == panel1)
panel1.startAnimation(new ScaleAnimToHide(1.0f, 1.0f, 1.0f, 0.0f, 500, panel1, true));
if(openLayout == panel2)
panel2.startAnimation(new ScaleAnimToHide(1.0f, 1.0f, 1.0f, 0.0f, 500, panel2, true));
if(openLayout == panel3)
panel3.startAnimation(new ScaleAnimToHide(1.0f, 1.0f, 1.0f, 0.0f, 500, panel3, true));
if(openLayout == panel4)
panel4.startAnimation(new ScaleAnimToHide(1.0f, 1.0f, 1.0f, 0.0f, 500, panel4, true));
if(openLayout == panel5)
panel5.startAnimation(new ScaleAnimToHide(1.0f, 1.0f, 1.0f, 0.0f, 500, panel5, true));
}
private void hideOthers(View layoutView)
{
{
int v;
if(layoutView.getId() == R.id.text1)
{
v = panel1.getVisibility();
if(v != View.VISIBLE)
{
panel1.setVisibility(View.VISIBLE);
Log.v(“CZ”,”height…” + panel1.getHeight());
}
//panel1.setVisibility(View.GONE);
//Log.v(“CZ”,”again height…” + panel1.getHeight());
hideThemAll();
if(v != View.VISIBLE)
{
panel1.startAnimation(new ScaleAnimToShow(1.0f, 1.0f, 1.0f, 0.0f, 500, panel1, true));
}
}
else if(layoutView.getId() == R.id.text2)
{
v = panel2.getVisibility();
hideThemAll();
if(v != View.VISIBLE)
{
panel2.startAnimation(new ScaleAnimToShow(1.0f, 1.0f, 1.0f, 0.0f, 500, panel2, true));
}
}
else if(layoutView.getId() == R.id.text3)
{
v = panel3.getVisibility();
hideThemAll();
if(v != View.VISIBLE)
{
panel3.startAnimation(new ScaleAnimToShow(1.0f, 1.0f, 1.0f, 0.0f, 500, panel3, true));
}
}
else if(layoutView.getId() == R.id.text4)
{
v = panel4.getVisibility();
hideThemAll();
if(v != View.VISIBLE)
{
panel4.startAnimation(new ScaleAnimToShow(1.0f, 1.0f, 1.0f, 0.0f, 500, panel4, true));
}
}
else if(layoutView.getId() == R.id.text5)
{
v = panel5.getVisibility();
hideThemAll();
if(v != View.VISIBLE)
{
panel5.startAnimation(new ScaleAnimToShow(1.0f, 1.0f, 1.0f, 0.0f, 500, panel5, true));
}
}
}
}
public class ScaleAnimToHide extends ScaleAnimation
{
       private View mView;
       private LayoutParams mLayoutParams;
       private int mMarginBottomFromY, mMarginBottomToY;
       private boolean mVanishAfter = false;
       public ScaleAnimToHide(float fromX, float toX, float fromY, float toY, int duration, View view,boolean vanishAfter)
       {
           super(fromX, toX, fromY, toY);
           setDuration(duration);
           openLayout = null;
           mView = view;
           mVanishAfter = vanishAfter;
           mLayoutParams = (LayoutParams) view.getLayoutParams();
           int height = mView.getHeight();
           mMarginBottomFromY = (int) (height * fromY) + mLayoutParams.bottomMargin – height;
           mMarginBottomToY = (int) (0 – ((height * toY) + mLayoutParams.bottomMargin)) – height;
       
           Log.v(“CZ”,”height…” + height + ” , mMarginBottomFromY….” + mMarginBottomFromY  + ” , mMarginBottomToY..” +mMarginBottomToY);
       }
       @Override
       protected void applyTransformation(float interpolatedTime, Transformation t)
       {
           super.applyTransformation(interpolatedTime, t);
           if (interpolatedTime < 1.0f)
           {
               int newMarginBottom = mMarginBottomFromY + (int) ((mMarginBottomToY – mMarginBottomFromY) * interpolatedTime);
               mLayoutParams.setMargins(mLayoutParams.leftMargin, mLayoutParams.topMargin,mLayoutParams.rightMargin, newMarginBottom);
               mView.getParent().requestLayout();
               //Log.v(“CZ”,”newMarginBottom…” + newMarginBottom + ” , mLayoutParams.topMargin…” + mLayoutParams.topMargin);
           }
           else if (mVanishAfter)
           {
               mView.setVisibility(View.GONE);
           }
       }
}
public class ScaleAnimToShow extends ScaleAnimation
{
       private View mView;
       private LayoutParams mLayoutParams;
       private int mMarginBottomFromY, mMarginBottomToY;
       private boolean mVanishAfter = false;
       public ScaleAnimToShow(float toX, float fromX, float toY, float fromY, int duration, View view,boolean vanishAfter)
       {
           super(fromX, toX, fromY, toY);
           openLayout = view;
           setDuration(duration);
           mView = view;
           mVanishAfter = vanishAfter;
           mLayoutParams = (LayoutParams) view.getLayoutParams();
           mView.setVisibility(View.VISIBLE);
           int height = mView.getHeight();
           //mMarginBottomFromY = (int) (height * fromY) + mLayoutParams.bottomMargin + height;
           //mMarginBottomToY = (int) (0 – ((height * toY) + mLayoutParams.bottomMargin)) + height;
       
           mMarginBottomFromY = 0;
           mMarginBottomToY = height;
       
           Log.v(“CZ”,”……………..height…” + height + ” , mMarginBottomFromY….” + mMarginBottomFromY  + ” , mMarginBottomToY..” +mMarginBottomToY);
       }
       @Override
       protected void applyTransformation(float interpolatedTime, Transformation t)
       {
           super.applyTransformation(interpolatedTime, t);
           if (interpolatedTime < 1.0f)
           {
               int newMarginBottom = (int) ((mMarginBottomToY – mMarginBottomFromY) * interpolatedTime) – mMarginBottomToY;
               mLayoutParams.setMargins(mLayoutParams.leftMargin, mLayoutParams.topMargin,mLayoutParams.rightMargin, newMarginBottom);
               mView.getParent().requestLayout();
               //Log.v(“CZ”,”newMarginBottom…” + newMarginBottom + ” , mLayoutParams.topMargin…” + mLayoutParams.topMargin);
           }
       }
}
}

main.xml

<?xml version=”1.0″ encoding=”utf-8″?>
<LinearLayout xmlns:android=”http://schemas.android.com/apk/res/android&#8221;
android:orientation=”vertical” android:layout_width=”fill_parent” android:background=”#ffffff”
android:layout_height=”fill_parent”>
<LinearLayout android:layout_width=”fill_parent” android:layout_height=”wrap_content” android:orientation=”vertical” android:layout_gravity=”center”>
<TextView android:text=”Location” android:id=”@+id/text1″ android:padding=”5dip” android:background=”#005555″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
<LinearLayout android:id=”@+id/panel1″ android:visibility=”gone”  android:orientation=”vertical” android:layout_width=”fill_parent” android:layout_height=”wrap_content”>
<TextView android:layout_margin=”2dip” android:text=”Item1″ android:padding=”5dip” android:background=”#777777″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
<TextView android:layout_margin=”2dip” android:text=”Item2″ android:padding=”5dip” android:background=”#777777″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
<TextView android:layout_margin=”2dip” android:text=”Item3″ android:padding=”5dip” android:background=”#777777″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
</LinearLayout>
    </LinearLayout>
    <LinearLayout android:layout_marginTop=”2dip” android:layout_width=”fill_parent” android:layout_height=”wrap_content” android:orientation=”vertical” android:layout_gravity=”center”>
<TextView android:text=”Symptons” android:id=”@+id/text2″ android:padding=”5dip” android:background=”#005555″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
<LinearLayout android:id=”@+id/panel2″ android:visibility=”gone” android:orientation=”vertical” android:layout_width=”fill_parent” android:layout_height=”wrap_content”>
<TextView android:layout_margin=”2dip” android:text=”Item1″ android:padding=”5dip” android:background=”#777777″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
<TextView android:layout_margin=”2dip” android:text=”Item2″ android:padding=”5dip” android:background=”#777777″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
<TextView android:layout_margin=”2dip” android:text=”Item3″ android:padding=”5dip” android:background=”#777777″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
</LinearLayout>
    </LinearLayout>
    <LinearLayout android:layout_marginTop=”2dip” android:layout_width=”fill_parent” android:layout_height=”wrap_content” android:orientation=”vertical” android:layout_gravity=”center”>
<TextView android:text=”Location” android:id=”@+id/text3″ android:padding=”5dip” android:background=”#005555″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
<LinearLayout android:id=”@+id/panel3″ android:visibility=”gone” android:orientation=”vertical” android:layout_width=”fill_parent” android:layout_height=”wrap_content”>
<TextView android:layout_margin=”2dip” android:text=”Item1″ android:padding=”5dip” android:background=”#777777″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
<TextView android:layout_margin=”2dip” android:text=”Item2″ android:padding=”5dip” android:background=”#777777″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
<TextView android:layout_margin=”2dip” android:text=”Item3″ android:padding=”5dip” android:background=”#777777″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
</LinearLayout>
    </LinearLayout>
    <LinearLayout android:layout_marginTop=”2dip” android:layout_width=”fill_parent” android:layout_height=”wrap_content” android:orientation=”vertical” android:layout_gravity=”center”>
<TextView android:text=”Character” android:id=”@+id/text4″ android:padding=”5dip” android:background=”#005555″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
<LinearLayout android:id=”@+id/panel4″ android:visibility=”gone” android:orientation=”vertical” android:layout_width=”fill_parent” android:layout_height=”wrap_content”>
<TextView android:layout_margin=”2dip” android:text=”Item1″ android:padding=”5dip” android:background=”#777777″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
<TextView android:layout_margin=”2dip” android:text=”Item2″ android:padding=”5dip” android:background=”#777777″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
<TextView android:layout_margin=”2dip” android:text=”Item3″ android:padding=”5dip” android:background=”#777777″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
</LinearLayout>
    </LinearLayout>
    <LinearLayout android:layout_marginTop=”2dip” android:layout_width=”fill_parent” android:layout_height=”wrap_content” android:orientation=”vertical” android:layout_gravity=”center”>
<TextView android:text=”Factors” android:id=”@+id/text5″ android:padding=”5dip” android:background=”#005555″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
<LinearLayout android:id=”@+id/panel5″ android:visibility=”gone” android:orientation=”vertical” android:layout_width=”fill_parent” android:layout_height=”wrap_content”>
<TextView android:layout_margin=”2dip” android:text=”Item1″ android:padding=”5dip” android:background=”#777777″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
<TextView android:layout_margin=”2dip” android:text=”Item2″ android:padding=”5dip” android:background=”#777777″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
<TextView android:layout_margin=”2dip” android:text=”Item3″ android:padding=”5dip” android:background=”#777777″  android:layout_width=”fill_parent” android:layout_height=”wrap_content” />
</LinearLayout>
    </LinearLayout>
<ListView android:id=”@android:id/list” android:layout_width=”fill_parent” android:visibility=”gone”
android:layout_height=”340dip”  android:drawSelectorOnTop=”false”  android:dividerHeight=”0px”/>
</LinearLayout>

Output: