CODEWITHSUNDEEP
androidandroid-listview
Itapu Vinay
Itapu Vinay

Reputation: 717

How to expand and collapse an item in listview

I am pretty new to android. I want to implement a list view. It contains some list items and when they are clicked, they should expand showing more information. But I unable to find a way to do that

Here is my activity_main.xml

<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" >

    <ListView
        android:id="@+id/listview1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:clickable="True"
        android:layout_alignParentTop="true"
        android:divider="#000"
        android:dividerHeight="0.5dp"
        android:padding="7dp" >
    </ListView>

</RelativeLayout>

listview.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" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="23dp"
        android:layout_marginTop="20dp"
        android:drawableLeft="@drawable/expand_icon"
        android:drawablePadding="10dp"
        android:textAppearance="?android:attr/textAppearanceLarge" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textView1"
        android:layout_below="@+id/textView1"
        android:visibility="gone" />
</RelativeLayout>

I want to populate the textview2 to show more info. Below is my main_activity.java

public class MainActivity extends Activity {

    ListView list;
    String[] titles;
    String[] desc;

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

        Resources res = getResources();
        list = (ListView) findViewById(R.id.listview1);
        titles = res.getStringArray(R.array.text_info);
        desc = res.getStringArray(R.array.text_desc);

        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
                R.layout.listview, R.id.textView1, titles);
        list.setAdapter(adapter);
    }

Strings.xml

<string name="app_name">ListView</string>
<string name="hello_world">Hello world!</string>
<string-array name="text_info">
    <item>Tutorial 1</item>
    <item>Tutorial 2</item>
    <item>Tutorial 3</item>
    <item>Tutorial 4</item>
    <item>Tutorial 5</item>
    <item>Tutorial 6</item>
    <item>Tutorial 7</item>
</string-array>

<string-array name="text_desc">
    <item>Tutorial 1</item>
    <item>Tutorial 2</item>
    <item>Tutorial 3</item>
    <item>Tutorial 4</item>
    <item>Tutorial 5</item>
    <item>Tutorial 6</item>
    <item>Tutorial 7</item>
</string-array>

<string name="action_settings">Settings</string>

Any suggestions on how to do this?

enter image description here

Upvotes: 4

Views: 20767

Answers (3)

theerasan tonthongkam
theerasan tonthongkam

Reputation: 281

There is ExpandableListView to call try this https://www.journaldev.com/9942/android-expandablelistview-example-tutorial

Upvotes: 1

greenapps
greenapps

Reputation: 11224

You only have to set the visibility of the second textview to View.GONE and View.VISIBLE when the user clicks the item. Implement an OnItemClickListener first. Using an ExpandableListView for this simple task is overkill.

In your OnItemClick handler:

            TextView textView = (TextView)arg1.findViewById(R.id.textView2);

            if ( textView.getVisibility() == View.GONE)             
                {
                //expandedChildList.set(arg2, true);
                textView.setVisibility(View.VISIBLE);
                }
            else
                {
                //expandedChildList.set(arg2, false);
                textView.setVisibility(View.GONE);
                }

Upvotes: 5

Harsha
Harsha

Reputation: 669

You should use ExpandableListview instead of simple ListView.

Updated

Follow this tutorial and it will help you https://www.youtube.com/channel/UCbP2HeYGC3kfHjHLMPplZuQ he'll teach you how to use ListView using BaseAdapter and this will grow your confidence to implement ExpandableListView on your own..

Upvotes: 3

Related Questions