Why does my expanded content cause an overflow?

[chenasraf]

original SO question

I have an ExpandableRecyclerView, following this article. However, when I test my code, here's what happens when I expand items:

Initial view | Expanded: Example 1, Example 2

Here's my fragment onCreateView:

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    View view = inflater.inflate(R.layout.fragment_inventory_list, container, false);

    // Set the adapter
    if (view instanceof RecyclerView) {
        Context context = view.getContext();
        RecyclerView recyclerView = (RecyclerView) view;
        recyclerView.setLayoutManager(new LinearLayoutManagerWrapper(context));
        InventoryViewAdapter expandableAdapter = new InventoryViewAdapter(context, mInventoryItemList);
        recyclerView.setAdapter(expandableAdapter);
    }
    return view;
}

The LinearLayoutManagerWrapper extends LinearLayoutManager and the only difference is it catches IndexOutOfBound exceptions caused due to some library bugs (took it from another SO question).

Here's my ParentViewHolder's bind method (which I call inside my ViewAdapter's onBindParentViewHolder:

public void bind(InventoryItem item) {
    setItem(item);
    getNameView().setText(item.getName());
    getCountView().setText(Html.fromHtml("×").toString().concat(String.valueOf(item.getCount())));

    getView().setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            if (isExpanded()) {
                collapseView();
            } else {
                expandView();
            }
        }
    });
}

Here's my fragment view xml (ignore the static params, I'll extract them soon):

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="@dimen/accordion_arrow_width">

        <TextView
            android:id="@+id/name"
            android:text="@string/inventory_list_item_name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="@dimen/text_margin"
            android:textAppearance="?attr/textAppearanceListItem" />

        <TextView
            android:id="@+id/count"
            android:text="@string/inventory_item_count"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="@dimen/text_margin"
            android:layout_marginTop="20dp"
            android:layout_alignParentEnd="true"
            android:textColor="@color/foregroundLighter"
            android:textSize="@dimen/text_size_small"
            android:textAppearance="?attr/textAppearanceListItem" />
    </RelativeLayout>


    <ImageView
        android:id="@+id/parent_list_item_expand_arrow"
        android:layout_width="@dimen/accordion_arrow_width"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_marginTop="16dp"
        android:layout_marginEnd="12dp"
        android:paddingTop="7dp"
        android:paddingBottom="7dp"
        android:src="@android:drawable/arrow_down_float" />
</RelativeLayout>

And my child's xml (the expanded area):

<?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="wrap_content"
                android:background="@drawable/accordion_background">

    <ImageView
        android:id="@+id/inventory_edit_icon"
        android:layout_width="30dp"
        android:layout_height="30dp"
        android:src="@android:drawable/ic_menu_edit"
        android:layout_margin="@dimen/text_margin" />

</RelativeLayout>

[paul-turner]

Hi @chenasraf Sorry for not catching your SO post. What do you mean by overflow? could you highlight what you are seeing happen incorrectly in the screenshots? What is the drawable @drawable/accordion_background?

[chenasraf]

@drawable/accordion_backgroun is just a background gradient, the white to gray one you can see in the expanded view.

The actual problem is - if you look at the initial scr, you will see 4 items. In examples 1 & 2, any open accordion seems to push the other ones down to clear space for the expansion (so far so good), but the overall height of the viewport only fits 4, so when one is expanded and takes the space of 1 more item, you eventually see only 3 while 1 is overflown below the break.

[paul-turner]

Oh I see, what is the xml of your fragment/activity that has the RecyclerView, looks like you may be using wrap content?

[chenasraf]

Yes, I am. Anything else I tried broke the layout even more, what do you suggest? The XML is in my original post :)

[paul-turner]

The XML I'm looking for is something that contains your RecyclerView, something like (I don't see it in the original post but I might be wrong!):

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.RecyclerView
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

I haven't tried to use a RecyclerView with wrap_content so I'm not sure of what part is not adapting to the change in size, that should not be affected by the adapter since we are simply notifying and adding/removing items.

My suggestion would be to try and use match parent for the RecyclerView, I don't see how that might break the layout since there are no items below it (but maybe there is more to this layout).

[chenasraf]

Sorry then, my bad. Did you mean this?

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.RecyclerView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/list"
    android:name="com.csheet.d20.adventure_mode.inventory.InventoryFragment"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginLeft="16dp"
    android:layout_marginRight="16dp"
    app:layoutManager="LinearLayoutManager"
    tools:context="com.csheet.d20.adventure_mode.inventory.InventoryFragment"
    tools:listitem="@layout/fragment_inventory" />

[paul-turner]

And that version is still clipping your views?

[chenasraf]

@paul-turner yep :(

[paul-turner]

@chenasraf
Did you accidentally override getItemCount and return a fixed number? What about the view of the activity where you are inserting the fragment?

Otherwise, something is cutting off your recyclerview from displaying all the items, the adapter does not affect any of the layout of RecyclerView so it is unlikely this is an issue with the library.

Those would be my last guesses without being able to run the code, if you can recreate it with a small sample that would be great. Otherwise, maybe screenshots with show layout bounds enabled might help.