CantThinkOfAnything CantThinkOfAnything - 3 months ago 17
Android Question

How to handle touch with ExpandableListView having a group view that consists of a nested layout

I am trying to create an expandable list which has group items consisting of several images, textviews and buttons.

The images and textviews, I all put in one RelativeLayout and the touchevents all work so everything is fine. Then i decided to add a Button bar consisting of 3 buttons in a horizontal LinearLayout, basically creating a nested layout. But now, the group items do not respond to touch events anymore.

I am sure this has got something to do with the way the listview is inflated in the Adapter but I do not know how to do this correctly.

If someone could help me, i would be really glad!

This is the group element 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"
android:orientation="vertical"
android:paddingBottom="3dp"
android:paddingLeft="3dp"
android:paddingRight="3dp"
android:paddingTop="20dp">


<ImageView
android:id="@+id/item1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:background="#828080"
android:focusable="false" />

<TextView
android:id="@+id/item2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/item1"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:text=""
android:textSize="20dp" />

<TextView
android:id="@+id/item3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/item2"
android:paddingBottom="5dp"
android:text="" />

<TextView
android:id="@+id/item4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="@+id/item5"
android:layout_alignTop="@+id/item5"
android:layout_toEndOf="@id/item5"
android:layout_toRightOf="@id/item5"
android:paddingBottom="5dp"
android:text="" />

<TextView
android:id="@+id/item5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="@+id/item3"
android:layout_alignTop="@+id/item3"
android:layout_toEndOf="@id/item3"
android:layout_toRightOf="@+id/item3"
android:paddingBottom="5dp"
android:text="on" />

<TextView
android:id="@+id/item6"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/item3"
android:text=""
android:textSize="15dp" />

<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/item6"
android:orientation="horizontal">

<ImageButton
android:id="@+id/button1"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_margin="0dp"
android:layout_weight="1"
android:background="#c3d69b"
android:padding="0dp"
android:src="@drawable/myDrawable1" />

<ImageButton
android:id="@+id/button2"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_margin="0dp"
android:layout_weight="1"
android:background="#c3d69b"
android:padding="0dp"
android:src="@drawable/myDrawable2" />

<ImageButton
android:id="@+id/button3"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_margin="0dp"
android:layout_weight="1"
android:background="#c3d69b"
android:padding="0dp"
android:src="@drawable/myDrawable3" />

</LinearLayout>



</RelativeLayout>


EDIT

I found a workaround that suits me even better. Simply assigning listeners to the different items did the trick. This code, i added inside the Adapter for the expandablelistview

@Override
protected View newGroupView(Context context, Cursor cursor, boolean isExpanded, ViewGroup parent) {
//Log.d(TAG, "newGroupView");
//DatabaseUtils.dumpCursor(cursor);

final View view = mInflater.inflate(R.layout.group_list_item, parent, false);

image = (ImageView) view.findViewById(R.id.imageview);
button1 = (ImageButton) view.findViewById(R.id.button_1);
button2 = (ImageButton) view.findViewById(R.id.button_2);
button3 = (ImageButton) view.findViewById(R.id.button_3);

image .setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Log.d(TAG, "image clicked");
}
});

button1 .setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Log.d(TAG, "button1 clicked");
}
});

button2 .setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Log.d(TAG, "button2 clicked");
}
});

button3 .setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Log.d(TAG, "button3 clicked");

}
});

return view;
}

Answer

Inside the adapter for the listview i added:

@Override
public View getGroupView(final int groupPosition, final boolean isExpanded, View convertView, final ViewGroup parent) {
    if(convertView == null) {
        LayoutInflater inflater = (LayoutInflater) mActivity.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        convertView = inflater.inflate(R.layout.list_item, parent, false);
    }

    ImageButton button1 = (ImageButton) convertView.findViewById(R.id.button_1);

    button1.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            if(isExpanded) ((ExpandableListView) parent).collapseGroup(groupPosition);
            else ((ExpandableListView) parent).expandGroup(groupPosition);
        }
    });

    return convertView;
}

This way you can set Onclicklisteners for whatever element you want.

Comments