Expandable List view with recycler list view as child

Question

As shown in the image, I am able to render the view. But the onChildClick event of Expandable view is not getting triggered.

Also the touch event in the adapter is not responding. My layout details are mentioned below.

The full source code for this can be found in here.

main_activity.xml

<ExpandableListView
    android:id="@+id/list_brands"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:divider="@null"
    android:groupIndicator="@null"
    android:dividerHeight="5dp" />

item_parent.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal" android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center_vertical">

    <TextView
        android:id="@+id/text_brand"
        android:textSize="18dp"
        android:text="Text"
        android:layout_weight="1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <ImageView
        android:id="@+id/image_indicator"
        android:src="@drawable/ic_keyboard_arrow_down_black_18dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</LinearLayout>

item_group_child.xml

<android.support.v7.widget.RecyclerViewxmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/mobiles"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />

item_child.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:padding="10dp">

        <ImageView
            android:id="@+id/image_mobile"
            android:layout_width="70dp"
            android:adjustViewBounds="true"
            android:layout_height="120dp" />


        <TextView
            android:id="@+id/text_mobile_model"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center" />

        <TextView
            android:id="@+id/text_mobile_price"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center" />

</LinearLayout>

**My Solution : ** Touch events are directly passed to the UI Elements of the View holder in the Recycler List view. But to give the touch event to the whole layout I have added the transparent button on top of child_item layout and added a click listener. Following is the updated child_item.xml

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <FrameLayout
            android:layout_height="match_parent"
            android:layout_width="match_parent" >

        <Button
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/dummy_click"
            android:background="@android:color/transparent"/>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical"
            android:layout_marginLeft="5dp"
            android:layout_marginRight="5dp"
            android:padding="10dp"

            android:background="@color/colorGrey"
            >
        <ImageView
            android:id="@+id/img_subcategory"
            android:layout_gravity="center"
            android:src="@mipmap/ic_launcher"
            android:layout_marginTop="10dp"
            android:layout_width="180dp"
            android:layout_height="90dp"

            android:scaleType="fitXY"/>
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Sub Category"
            android:textColor="@color/colorWhite"
            android:layout_marginTop="10dp"
            android:layout_marginBottom="5dp"
            android:gravity="center"
            android:id="@+id/txt_subcategory"
            android:textSize="@dimen/app_text_title"/>

        </LinearLayout>
        </FrameLayout>
    </LinearLayout>

Answer 1

Theory

ExpandableListView, child click sample:

for click on child, you can handle this way.

getExpandableListView().setOnChildClickListener(new OnChildClickListener() {              
    public boolean onChildClick(ExpandableListView parent, View v,
                int groupPosition, int childPosition, long id) { 
        // your code...
    }
});

Expandable RecyclerView, useful library and easy item click support:

This blog post by Hugo shows an alternative way without listeners: http://www.littlerobots.nl/blog/Handle-Android-RecyclerView-Clicks/

It comes down to adding these lines:

ItemClickSupport.addTo(mRecyclerView).setOnItemClickListener(new ItemClickSupport.OnItemClickListener() {
    @Override
    public void onItemClicked(RecyclerView recyclerView, int position, View v) {
        // do it
    }
});

When using this class:

public class ItemClickSupport {...}

And this value in ids.xml:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <item name="item_click_support" type="id" />
</resources>

Why doesn't RecyclerView have onItemClickListener()? And how RecyclerView is different from Listview?

Since the introduction of ListView, onItemClickListener has been problematic. The moment you have a click listener for any of the internal elements the callback would not be triggered, but it wasn't notified or well documented (if at all) so there was a lot of confusion and SO questions about it.

OnItemClickListener doesn't work with ListView item containing button

Just add this line into the item views instead of listView itself

android:focusable="false"

Check more detail about this from: Android custom ListView unable to click on items

---

Practice

@Override
public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent) {

    ChildHolder childHolder = null;
    if (convertView == null) {
        LayoutInflater inflater = (LayoutInflater) context.getSystemService(context.LAYOUT_INFLATER_SERVICE);
        convertView = inflater.inflate(R.layout.item_group_child, parent, false);
        childHolder = new ChildHolder();

        // Fix listview onclicklistener issue: inner views can not be focusable
        childHolder.YOUR_INNER_BUTTON = (YOUR_BUTTON_TYPE) convertView.findViewById(R.id.YOUR_BUTTON_ID);
        childHolder.YOUR_INNER_BUTTON.setFocusable(false);

        convertView.setTag(childHolder);
    }
    else {
        childHolder = (ChildHolder) convertView.getTag();
    }

    childHolder.horizontalListView = (RecyclerView) convertView.findViewById(R.id.mobiles);
    LinearLayoutManager layoutManager = new LinearLayoutManager(context, LinearLayoutManager.HORIZONTAL, false);
    childHolder.horizontalListView.setLayoutManager(layoutManager);

    MobileAdapter horizontalListAdapter = new MobileAdapter(context, brands.get(groupPosition).mobiles);
    childHolder.horizontalListView.setAdapter(horizontalListAdapter);

    return convertView;
}

Added two lines to your code based on my legacy code:

    // Creates a ViewHolder and store references to the children views (collapsed)
    holder = new ViewHolderChildren();
    holder.textLine = (TextView) convertView.findViewById(R.id.usersTextLine);
    holder.subtextLine = (TextView) convertView.findViewById(R.id.usersSubtextLine);
    holder.iconLine = (ImageView) convertView.findViewById(R.id.usersIconLine);
    holder.buttonLine = (ImageButton) convertView.findViewById(R.id.usersButtonLine);
    holder.infoLine = (TextView) convertView.findViewById(R.id.usersInfoLine);
    holder.infoLine.setVisibility(TextView.GONE);
    holder.userprofileButton = (ImageButton) convertView.findViewById(R.id.usersUserprofileBtn);

    holder.buttonLine.setOnClickListener(new OnClickListener() {
        public void onClick(View v) {
            // if gone, set visible and arrow up image
            if (holder.infoLine.getVisibility() == TextView.GONE) {
                holder.infoLine.setVisibility(TextView.VISIBLE);
                holder.buttonLine.setImageLevel(1);
            }
            // if visible, set gone and arrow down image
            else {
                holder.infoLine.setVisibility(TextView.GONE);
                holder.buttonLine.setImageLevel(0);
            }
        }
    });
    //fixed listview onclicklistener bug: inner views can not be focusable
    holder.buttonLine.setFocusable(false);

    convertView.setTag(holder);