Barak Barak - 6 months ago 163
Android Question

Highlight for selected item in expandable list

I have a layout where I have an expandable list in a fragment on the left and a details fragment on the right. This all works fine.

Now I would like to indicate what item on the left is having it's details shown on the right and here I'm having a problem.

In a normal list view I have achieved this by setting the choice mode for the list view to single and then using a state drawable based on the "activated" state. When I click the item, the background is set to my selected color and stays that way until I select another item on the list.

I tried to apply this to my expandable listview and it was/is a dismal failure. There were no errors, but the selected item did not maintain it's color state. I'm not sure if I'm not setting the choice mode properly for it (I've tried it in the layout file as well as programatically, it doesn't seem to make a difference), or pointing it to the wrong thing (not sure how that could be, but...)

Any help/pointers appreciated (even if it's in a completely different direction).

Most current failure:

expandable listview code

private void fillData(String group, String child) {
ExpandableListView lv;
mGroupsCursor = mDbHelper.fetchGroup(group);
getActivity().startManagingCursor(mGroupsCursor);
mGroupsCursor.moveToFirst();
lv = (ExpandableListView) getActivity().findViewById(R.id.explist);
lv.setChoiceMode(ExpandableListView.CHOICE_MODE_SINGLE);

mAdapter = new MyExpandableListAdapter(mGroupsCursor, getActivity(),
R.layout.explistlayout,
R.layout.explistlayout,
new String[] { "_id" },
new int[] { android.R.id.text1 },
new String[] { child },
new int[] { android.R.id.text1 });
lv.setAdapter(mAdapter);
registerForContextMenu(lv);

lv.setOnChildClickListener(new ExpandableListView.OnChildClickListener() {
@Override
public boolean onChildClick(ExpandableListView parent, View v, int groupPosition, int childPosition, long id)
{
mRowId = id;
EventDisplayFragment eventdisplay = new EventDisplayFragment();
getFragmentManager().beginTransaction().replace(R.id.rightpane, eventdisplay).commit();
return true;
}
});
}

public class MyExpandableListAdapter extends SimpleCursorTreeAdapter {

public MyExpandableListAdapter(Cursor cursor, Context context,
int groupLayout, int childLayout, String[] groupFrom,
int[] groupTo, String[] childrenFrom, int[] childrenTo) {
super(context, cursor, groupLayout, groupFrom, groupTo,
childLayout, childrenFrom, childrenTo);
}
@Override
protected Cursor getChildrenCursor(Cursor groupCursor) {
Cursor childCursor = mDbHelper.fetchChildren(mGroup, groupCursor
.getString(groupCursor
.getColumnIndex(AttendanceDB.EVENT_ROWID)));
getActivity().startManagingCursor(childCursor);
childCursor.moveToFirst();
return childCursor;
}
}


item_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_pressed="true"
android:drawable="@color/green" />
<item
android:state_selected="true"
android:drawable="@color/blue" />
<item
android:state_focused="true"
android:drawable="@color/violet" />
<item
android:state_activated="true"
android:drawable="@color/blue" />
</selector>

Answer

I finally figured out how to make this work (for me). It seems a bit of the hack, but it's the only thing I've managed to get working for this.

Basically I create a two dimensional array to hold the selected state of the children, initialize it in the adapter constructor, then I reference that in my getChildView method (in case the currently selected child scrolls out of view) and my onChildClick method (to change the current selection and turn off the old one).

private selectedStatus[][];  // array to hold selected state
private View oldView;        // view to hold so we can set background back to normal after selection of another view

Constructor initialize the array

    public MyExpandableListAdapter(Cursor cursor, Context context,
            int groupLayout, int childLayout, String[] groupFrom,
            int[] groupTo, String[] childrenFrom, int[] childrenTo) {
        super(context, cursor, groupLayout, groupFrom, groupTo,
                childLayout, childrenFrom, childrenTo);
        selectedStatus = new boolean[cursor.getCount()][];
        for (int i = 0; i < cursor.getCount(); i++) {
            cursor.moveToPosition(i);
            Cursor childCheckCursor = mDbHelper.fetchChildren(mGroup,
                    cursor.getString(cursor
                            .getColumnIndex(AttendanceDB.EVENT_ROWID)));
            getActivity().startManagingCursor(childCheckCursor);
            selectedStatus[i] = new boolean[childCheckCursor.getCount()];
            for (int j = 0; j < childCheckCursor.getCount(); j++) {
                selectedStatus[i][j] = false;
            }
        }

    }

getChildView needed for when the child scrolls out of view

    @Override 
    public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent) { 
        final View v = super.getChildView(groupPosition, childPosition, isLastChild, convertView, parent); 
        if(selectedStatus[groupPosition][childPosition] == true){
            v.setBackgroundResource(R.color.blue);                          
        } else {
            v.setBackgroundResource(R.color.black);
        }
        return v; 
    } 

onChildClick change selected item

    lv.setOnChildClickListener(new ExpandableListView.OnChildClickListener() {
        @Override
        public boolean onChildClick(ExpandableListView parent, View v,
                int groupPosition, int childPosition, long id) {
            mRowId = id;
            EventDisplayFragment eventdisplay = new EventDisplayFragment();
            getFragmentManager().beginTransaction()
                    .replace(R.id.rightpane, eventdisplay).commit();
            if(oldView != null){
                oldView.setBackgroundResource(R.color.black);   // change the background of the old selected item back to default black                 }
            oldView = v;                                        // set oldView to current view so we have a reference to change back on  next selection
            for (int i = 0; i < selectedStatus.length; i++) {
                for (int j = 0; j < checkedStatus[i].length; j++) {
                    if(i == groupPosition && j == childPosition){  // set the current view to true and all others to false
                        selectedStatus[i][j] = true;
                    } else {
                        selectedStatus[i][j] = false;
                    }
                }
            }
            v.setBackgroundResource(R.color.blue);
            return true;
        }
    });
Comments