android expandable listview is not scrolling

Question

I am trying to implement expandable list view. When the list is expanded, it is not scrollable anymore. The header got misplaced.

Here is the layout for the lisltview in my main activity:

 <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:layout_below="@+id/dashboard_scrollview">
        <ExpandableListView
            android:id="@+id/leaderboard_list_view"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:transcriptMode="alwaysScroll" />
    </RelativeLayout>

and after the list view is tapped, it expanded but is unable to scroll:

I'm wondering why the header and the first element are not showing up in the list view.

MainActivity:

public void setupLeaderboardListView(){

        leaderboardDetail = ExpandableLeaderboardData.getData();
        leaderboardListView.setStackFromBottom(true);
        leaderboardtitle = new ArrayList<String>(leaderboardDetail.keySet());
        leaderboardAdapter = new LeaderboardAdapter(this, leaderboardtitle, leaderboardDetail);
        leaderboardListView.setAdapter(leaderboardAdapter);
        leaderboardListView.setOnGroupExpandListener(new ExpandableListView.OnGroupExpandListener() {

            @Override
            public void onGroupExpand(int groupPosition) {
                Toast.makeText(getApplicationContext(),
                        leaderboardtitle.get(groupPosition) + " List Expanded.",
                        Toast.LENGTH_SHORT).show();
            }
        });

        leaderboardListView.setOnGroupCollapseListener(new ExpandableListView.OnGroupCollapseListener() {

            @Override
            public void onGroupCollapse(int groupPosition) {
                Toast.makeText(getApplicationContext(),
                        leaderboardtitle.get(groupPosition) + " List Collapsed.",
                        Toast.LENGTH_SHORT).show();

            }
        });

        leaderboardListView.setOnChildClickListener(new ExpandableListView.OnChildClickListener() {
            @Override
            public boolean onChildClick(ExpandableListView parent, View v,
                                        int groupPosition, int childPosition, long id) {
                Toast.makeText(
                        getApplicationContext(),
                        leaderboardtitle.get(groupPosition)
                                + " -> "
                                + leaderboardDetail.get(
                                leaderboardtitle.get(groupPosition)).get(
                                childPosition), Toast.LENGTH_SHORT
                ).show();
                return false;
            }
        });
    }

List datasource:

 List<String> cricket = new ArrayList<String>();
        cricket.add("India");
        cricket.add("Pakistan");
        cricket.add("Australia");
        cricket.add("England");
        cricket.add("South Africa");
        cricket.add("India");
        cricket.add("Pakistan");
        cricket.add("Australia");
        cricket.add("England");
        cricket.add("South Africa");

I tried setting layout_height=match_parent for the expandable list, but it did not work

Answer 1

In Expandable List view xml used android:nestedScrollingEnabled="true"

Answer 2

Use this code, it's working fine. This is main activity layout:

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


  <ExpandableListView
    android:id="@+id/expandable_listview"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >
</ExpandableListView>

</LinearLayout>

Your Parent Item Layout:

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


<TextView 
   android:layout_height="wrap_content"
   android:layout_width="match_parent"
   android:id="@+id/tv_parent_item"
   android:layout_marginLeft="10dp"
   android:layout_gravity="center_vertical"
   android:textSize="20sp"
    />

</LinearLayout>

Your child item layout:

<?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:orientation="horizontal"
  >


  <ImageView 
   android:layout_height="wrap_content"
   android:layout_width="wrap_content"
   android:id="@+id/iv_child_item"
   android:background="@drawable/ic_launcher"
    />

<LinearLayout 
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:orientation="vertical"
       android:layout_marginLeft="100dp"
       android:layout_marginTop="5dp" >


<TextView 
   android:layout_height="wrap_content"
   android:layout_width="match_parent"
   android:id="@+id/tv_child_item1"
   android:layout_marginLeft="10dp"
   android:textSize="15sp"
   android:text="Test"
    />

<TextView 
   android:layout_height="wrap_content"
   android:layout_width="match_parent"
   android:id="@+id/tv_child_item2"
   android:layout_marginLeft="10dp"
   android:layout_marginTop="10dp"
   android:textSize="15sp"
   android:text="Test"
    />


 </LinearLayout>

Custom Adapter class:

import java.util.HashMap;
import java.util.List;

import com.example.expandablelistview.R;
import com.nostra13.universalimageloader.core.DisplayImageOptions;
import com.nostra13.universalimageloader.core.ImageLoader;
import com.nostra13.universalimageloader.core.ImageLoaderConfiguration;
import com.nostra13.universalimageloader.core.listener.SimpleImageLoadingListener;






import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Typeface;



import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseExpandableListAdapter;
import android.widget.ExpandableListAdapter;
import android.widget.ExpandableListView;
import android.widget.ImageView;
import android.widget.TextView;



public class ExpandableAdapter extends BaseExpandableListAdapter{

private Context context;
private List<String> parentList;
private HashMap<String , List<Songs>> childList;
ImageLoader imageLoader = ImageLoader.getInstance();

DisplayImageOptions options;

public ExpandableAdapter(){

}


public ExpandableAdapter(Context context,List<String> parentList,
        HashMap<String,List<Songs>> childList)
{
    this.context=context;
    this.parentList=parentList;
    this.childList=childList;

    options = new DisplayImageOptions.Builder()
    .showImageOnLoading(R.drawable.ic_launcher)
    .showImageForEmptyUri(R.drawable.ic_launcher)
    .showImageOnFail(R.drawable.ic_launcher)
    .cacheInMemory(true)
    .cacheOnDisk(true)
    .considerExifParams(true)
    .bitmapConfig(Bitmap.Config.RGB_565)
    .build();
     ImageLoaderConfiguration config = new ImageLoaderConfiguration.Builder(context)
     .defaultDisplayImageOptions(options)
     .build();
     imageLoader.getInstance().init(config);



}

@Override
public int getGroupCount() {
    // TODO Auto-generated method stub
    return this.parentList.size();
}

@Override
public int getChildrenCount(int groupPosition) {
    // TODO Auto-generated method stub
    return this.childList.get(this.parentList.get(groupPosition)).size();

}

@Override
public Object getGroup(int groupPosition) {
    // TODO Auto-generated method stub
    return this.parentList.get(groupPosition);
}

@Override
public Object getChild(int groupPosition, int childPosition) {
    // TODO Auto-generated method stub
    return this.childList.get(this.parentList.get(groupPosition)).get(childPosition);
}

@Override
public long getGroupId(int groupPosition) {
    // TODO Auto-generated method stub
    return groupPosition;
}

@Override
public long getChildId(int groupPosition, int childPosition) {
    // TODO Auto-generated method stub
    return childPosition;
}

@Override
public boolean hasStableIds() {
    // TODO Auto-generated method stub
    return false;
}

@Override
public View getGroupView(int groupPosition, boolean isExpanded,
        View convertView, ViewGroup parent) {
    // TODO Auto-generated method stub

    String headerTitle = (String) getGroup(groupPosition);

     if (convertView == null) {
            LayoutInflater infalInflater = (LayoutInflater) this.context
                    .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            convertView = infalInflater.inflate(R.layout.parent_item, null);



        }
     TextView lblListHeader = (TextView) convertView
                .findViewById(R.id.tv_parent_item);
        lblListHeader.setTypeface(null, Typeface.BOLD);
        lblListHeader.setText(headerTitle);




        ExpandableListView eLV = (ExpandableListView) parent;
        eLV.expandGroup(groupPosition);



        return convertView;





}

@Override
public View getChildView(int groupPosition, int childPosition,
        boolean isLastChild, View convertView, ViewGroup parent) {
    // TODO Auto-generated method stub

    Songs childText = (Songs) getChild(groupPosition, childPosition);


    if(convertView==null)
    {
         LayoutInflater infalInflater = (LayoutInflater) this.context
                    .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
         convertView = infalInflater.inflate(R.layout.child_item , null);


    }

    TextView artist = (TextView) convertView.findViewById(R.id.tv_child_item1);
    TextView song = (TextView) convertView.findViewById(R.id.tv_child_item2);
    ImageView image = (ImageView) convertView.findViewById(R.id.iv_child_item);


    artist.setText(childText.getArtist());
    song.setText(childText.getSong());
    String imgUrl=childText.getArtwork();

    imageLoader.displayImage(imgUrl, image);




    return convertView;


}

@Override
public boolean isChildSelectable(int groupPosition, int childPosition) {
    // TODO Auto-generated method stub
    return true;
}



}

For Main Activity OnCreate() method:

@Override
protected void onCreate(Bundle savedInstanceState) {
    // TODO Auto-generated method stub
    super.onCreate(savedInstanceState);

    setContentView(R.layout.activity_main);

    expListView = (ExpandableListView) findViewById(R.id.expandable_listview);

    listParent = new ArrayList<String>();
    listChild = new HashMap<String, List<Songs>>();

    new GetData().execute();

        listAdapter = new ExpandableAdapter(this, listParent, listChild);
        expListView.setAdapter(listAdapter);


        expListView.setOnGroupClickListener(new OnGroupClickListener() {

            @Override
            public boolean onGroupClick(ExpandableListView parent, View v,
                    int groupPosition, long id) {

                Toast.makeText(getApplicationContext(),
                "Group Clicked " + listParent.get(groupPosition),
                Toast.LENGTH_SHORT).show();

                return false;


            }




        });


        expListView.setOnGroupExpandListener(new OnGroupExpandListener() {

            @Override
            public void onGroupExpand(int groupPosition) {


            }
        });


        expListView.setOnGroupCollapseListener(new OnGroupCollapseListener() {

            @Override
            public void onGroupCollapse(int groupPosition) {



            }
        });


        expListView.setOnChildClickListener(new OnChildClickListener() {

            @Override
            public boolean onChildClick(ExpandableListView parent, View v,
                    int groupPosition, int childPosition, long id) {
                // TODO Auto-generated method stub
                Toast.makeText(
                        getApplicationContext(),
                        listParent.get(groupPosition)
                                + " : "
                                + listChild.get(
                                        listParent.get(groupPosition)).get(
                                        childPosition), Toast.LENGTH_SHORT)
                        .show();
                return false;
            }
        });


}

Answer 3

First of all: ListView is depricated, It should have been dead long ago and yet, i keep seeing post on it!!!

Second: Move to recyclerView, here are some resources that will help ya: 1. Nice introduction to it: https://developer.android.com/training/material/lists-cards.html 2. My dialog cheetSheet app (something like demo app), one of the dialogs uses expandable recyclverview library, give it a try https://github.com/WithoutCaps/DialogsCheatSheet

Answer 4

This can happen when your ExpandableListView has wrap_content for a width and height. To fix, make it the same as the parent RelativeLayout

<ExpandableListView
        android:id="@+id/leaderboard_list_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:transcriptMode="alwaysScroll" />