Horizontal RecyclerView follows first item height with wrap_content

Question

I have a RecyclerView with a horizontal layout. The height of the individual adapter items can depend on the content of the item.

So in theory it can look like the following:

The problem I have now is that it wrap_content only seems to care about the height of the first problem, because the result I am getting looks like this:

Where as you can see that the 4th item gets cut off. However, it works perfectly if I put the tallest item first.

And to get rid of the obvious solution; I don't know the height of the items. I could only do that during testing.

--

adapter_item.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="100dp"
    android:layout_height="wrap_content"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:animateLayoutChanges="true"
    android:padding="@dimen/padding_view_small">

    <ImageView
        android:id="@+id/image"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_gravity="center_horizontal"
        app:srcCompat="@drawable/flamme"/>

    <TextView
        android:id="@+id/name"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textColor="@color/black"
        android:layout_marginTop="@dimen/padding_view_small"
        android:text="@string/placeholder"
        android:gravity="center_horizontal"/>

</LinearLayout>

parent.xml

<LinearLayout
    android:id="@+id/symbol_list_parent"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:background="@drawable/container_content"
    android:padding="@dimen/padding_view_normal">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/symbol_list"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"/>

</LinearLayout>

Activity.java

...
final ProductPictogramAdapter symbolAdapter = new ProductPictogramAdapter();
final View symbolListParent = findViewById(R.id.symbol_list_parent);
RecyclerView symbolList = findViewById(R.id.symbol_list);
symbolList.setLayoutManager(new LinearLayoutManager(ProductDetailActivity.this, LinearLayoutManager.HORIZONTAL, false));
symbolList.setAdapter(symbolAdapter);
symbolList.setHasFixedSize(true);

Use **`StaggeredGridLayoutManager`** https://stackoverflow.com/questions/46190573/work-with-staggeredgridlayotmanager/46190845#46190845 — AskNilesh, Jul 13 '18 at 12:28
I decided to use FlexboxLayoutManager from Google's FlexBox to show all the items evenly. After playing around with it I figured it would be better to have all items showing at once instead of scrolling through them. — Ezzy, Jul 13 '18 at 12:47
try to remove setHasFixedSize property, i am also facing same issue then i removed this property. — Mayur Coceptioni, Jul 23 '19 at 09:24

score 2 · Answer 1 · edited Jun 17 '22 at 16:33

Try this.

mRecyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
    @Override
    public void onScrollStateChanged(@NonNull RecyclerView recyclerView, int newState) {
        super.onScrollStateChanged(recyclerView, newState);
        final int newHeight = recyclerView.getMeasuredHeight();
        if (0 != newHeight && minHeight < newHeight) {
        // keep track the height and prevent recycler view optimizing by resizing
            minHeight = newHeight;
            recyclerView.setMinimumHeight(minHeight);
        }
    }
});

score 1 · Accepted Answer · answered Jun 30 '20 at 13:53

Since this question is getting quite a lot of traction and I only posted my personal solution in the comments I'll submit an answer as well.

--

I decided to use Google's Flexbox layout library to achieve what I wanted. It's very customizable and I would recommend it to people who are trying to solve similar problems.

score -1 · Answer 3 · answered Jul 13 '18 at 12:59

-1

change your imageview height as wrap_content. I'm not sure, try like that.

answered Jul 13 '18 at 12:59

Mani Vasagam

820
5
10

score -1 · Answer 4 · edited Jul 05 '21 at 01:42

-1

i faced the same error i solved with following code;

binding.recyclerView.setHasFixedSize(false);

edited Jul 05 '21 at 01:42

Simas Joneliunas

2,890
20
28
35

answered Jul 01 '21 at 10:09

Yasin Ege

605
4
14

2

It is not working fully actually, check out this one, it is is working like a charm! https://stackoverflow.com/questions/64504633/horizontal-recyclerview-with-dynamic-item-s-height – haliltprkk Jul 09 '21 at 17:18

Horizontal RecyclerView follows first item height with wrap_content

4 Answers4

Linked