Two recycler view in same layout as in flipboard app

Question

I want to use a RecyclerView(list like) below another RecyclerView(Grid like) as in flipboard

I tried two RecyclerView inside ScrollView with wrap content but nothing is showing.

I can able to see two views if it is placed in linear layout and equal weight is added to it. But that does not look like this app View.

This is my layout

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:orientation="vertical">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/parent_category_list"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:minWidth="@dimen/default_small_padding"
        android:gravity="center"
        android:visibility="visible"/>

    <android.support.v7.widget.RecyclerView
        android:id="@+id/category_grid"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:columnWidth="150dp"
        android:gravity="center"
        android:visibility="visible"/>

</LinearLayout>

score 3 · Answer 1 · answered Aug 28 '15 at 12:13

There's actually a really simple way to achieve the desired layout with just one RecyclerView!

The key is using a GridLayoutManager and its SpanSizeLookup. First of all define your GridLayoutManager like this:

GridLayoutManager layoutManager = new GridLayoutManager(context, spanCount);

where spanCount is the maximum amount of spans/columns you want to have. In your case, spanCount should be 2;

Now you need a way to tell this layoutManager how many spans an item should span. A simple way would be to use a viewtype/ViewHolder for items that should span just one column and another one for items that span the whole width.

Let's assume you define the viewtype for grid-items as VIEWTYPE_GRID_ITEM and the viewtype for standard listitems as VIEWTYPE_LIST_ITEM. You can then use these viewtypes to tell the layoutManager when to use just one span:

layoutManager.setSpanSizeLookup(new SpanSizeLookup() {
    @Override
    public int getSpanSize(int position){
        return adapter.getItemViewType(position) == VIEWTYPE_GRID_ITEM ? 1 : spanCount;
    }
});

Finally, set the layoutManager to your RecyclerView:

recyclerView.setLayoutManager(layoutManager);

And that's it!

Great to hear that! It would be good if you'd flag this answer as the correct solution to help other readers find it quickly ;) — Johannes, Aug 29 '15 at 07:39

Rami · Accepted Answer · 2015-08-28T11:16:50.047

2

I don't think that they use two ListViews (or ListView + GridView).

I think they use a ListView ( the one in the bottom) and they add a custom Header to this list (the one in the top), which look like a GridView.

Or if they use a Recyclerview, they can achieve this by using a different layout in the adapter for the first item.

PS: it's not recommended to use two scrollable view inside each other (like Recyclerview inside ScrollView).

edited Aug 28 '15 at 11:16

answered Aug 28 '15 at 10:59

Rami

7,879
12
36
66

Thanks, But i have a question. Is it possible to set/change the layout of recycler view dynamically in the adapter? – Prasanna Anbazhagan Aug 28 '15 at 11:06
1

Yes! you can for example add a *type* to your model, and depending on this type you inflate the desired layout... take a look here: http://stackoverflow.com/a/26573338/4224337 – Rami Aug 28 '15 at 11:09
1

So in adapter i wil again set recyclerView.setLayoutManaget(... ) right – Prasanna Anbazhagan Aug 28 '15 at 11:22
no, set layout param where you initialized recycler view – Amarjit Aug 28 '15 at 11:27
No, you don't need to set again the LayoutManager of your RecyclerView. – Rami Aug 28 '15 at 11:29
I tried in onCreateViewHolder(ViewGroup viewGroup, final int position) by checking the position i setting gridLayoutManager.setSpanCount(1). but no luck :( – Prasanna Anbazhagan Aug 28 '15 at 11:38
i am getting these error : IllegalStateException: Cannot call this method while RecyclerView is computing a layout or scrolling – Prasanna Anbazhagan Aug 28 '15 at 11:48
SpanCount should be 2 not 1, and please refer to the above link to know the changes that you should make in your adapter. – Rami Aug 28 '15 at 12:51
@Rami, then how to display the heading 'Categories' in the above picture. – Prasanna Anbazhagan Aug 30 '15 at 13:57
Its a sectionned ListView http://cyrilmottier.com/2011/07/05/listview-tips-tricks-2-section-your-listview/ – Rami Aug 30 '15 at 16:36

score 0 · Answer 3 · edited May 23 '17 at 11:44

0

In android we are advise to use only one scrollable view at time , if you want to use one scrollable view inside other one refer below links.

1)Android list view inside a scroll view

2) https://stackoverflow.com/questions/6210895/listview-inside-scrollview-is-not-scrolling-on-android

edited May 23 '17 at 11:44

Community

1
1

answered Aug 28 '15 at 10:48

Amarjit

4,327
2
34
51

Thanks, But if we set wrap content to recycler view the view is not showing. – Aug 28 '15 at 10:57
Yes , for this we have to set some height to them – Amarjit Aug 28 '15 at 11:03

Two recycler view in same layout as in flipboard app

3 Answers3