How to get sticky / pinned headers in an ExpandableListView?

Question

Has anyone retired to adapt PinnedHeaderListView so that it can be used with ExpandableListView instead of a simple ListView with indexed sections? I basically want an ExpandableListView , where each view of the group element remains attached to the top until it is pushed by the next view of the group.

I studied the code to try to figure out how the PinnedHeaderListView works, and it seems to be hard to adapt to the ExpandableListView . The main problem seems to be using a different type of adapter and drawing technique. A PinnedHeaderListView uses a SectionIndexer to track the position of a section. When he draws each element using getView() , it checks to see if the element is the beginning of a new section. If the item is the start of a new section, it makes the section title visible inside the list_item object. ExpandableListAdapter has getChildView() and a getGroupView() for drawing elements and sections separately as different list items.

I'm sure some way to use the methodology in the PinnedHeaderListView should be similar to the behavior of the ExpandableListView , but I'm not sure where to start.

Answer 1

I managed to get pinned headers working on the ExpandableList1 APIdemo .

The most difficult problem I have encountered is figuring out how to get SectionIndexer to play well with expandable lists. As shown in my question, I thought that all this is wrong. In my initial attempt to solve this problem, I created a SectionIndexer object in MyExpandableAdapter and matched it with my data, similar to how it is done in the Contacts application and Peter’s example. This works in the Contacts application because the positions of the flat list statically correspond to the data set. When expanded, the list items with flat lists change as groups expand and exit.

So, the solution is not to display the section indexer in the data, but in the instance of your ExpandableListView. With this solution, you don’t even need the SectionIndexer object used in the examples. You just need to wrap SectionIndexer implementation methods around ExpandableListView methods as follows:

  @Override public int getPositionForSection(int section) { return mView.getFlatListPosition(ExpandableListView .getPackedPositionForGroup(section)); } @Override public int getSectionForPosition(int position) { return ExpandableListView.getPackedPositionGroup(mView .getExpandableListPosition(position)); } 

There are, of course, other changes you need to make for this to work, but these methods are key. I will send the full code to google or github code and the link soon. Extensible lists with attached headers look great!

Answer 2

Good thing I completed only 3 :

1. Add compile 'com.diegocarloslima:fgelv:0.1.+@aar' to build.gradle

2. Add an ExpandableListView to xml.

 <com.diegocarloslima.fgelv.lib.FloatingGroupExpandableListView android:id="@+id/expandableListView" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@android:color/transparent" android:groupIndicator="@null" /> 

3. Java code:

 FloatingGroupExpandableListView expandableListView = (FloatingGroupExpandableListView) findViewById(R.id.expandableListView); MyexpandableListAdapter adapter = new MyexpandableListAdapter(context, mList); WrapperExpandableListAdapter wrapperAdapter = new WrapperExpandableListAdapter(adapter); expandableListView.setAdapter(wrapperAdapter); 

Hope this helps you.