Recycler View Arrange Items In A Grid That Scrolls Horizontally

I have set of icons that I need to display in a RecyclerView arranged in a grid, and make that grid scroll horizontally. Normally I would use GridLayoutManager for something like t

Solution 1:

You might consider using HorizontalScrollView for each of your rows. I am giving you a sample implementation.

You need to have the layout of the item to be in each row first. Let us have a layout like the following.

Let us have a layout like this. Let us name it item_layout.xml

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

    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Some title" />
</LinearLayout>

Now let us have a View class for this layout to be loaded dynamically.

public class CustomItemView extends LinearLayout {
    private Context context;
    private TextView mTextView;

    public CustomItemView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        initView(context);
    }

    public CustomItemView(Context context, AttributeSet attrs) {
        super(context, attrs);
        initView(context);
    }

    public CustomItemView(Context context) {
        super(context);
        initView(context);
    }

    private void initView(Context context) {
        this.context = context;

        View v = inflate(context, R.layout.item_layout, null);
        mTextView = (TextView) v.findViewById(R.id.title);

        addView(v);
    }

    public void setTitle(String title) {
        mTextView.setText(title);
    }
}

Now let us have a class to populate the views inside HorizontalScrollView.

public class MyHorizontalScrollView {
    HorizontalScrollView horizontalScrollView;
    LinearLayout linearLayout;
    Context context;

    public MyHorizontalScrollView(final Context context) {
        this.context = context;
        initScrollView();
    }

    private void initScrollView() {
        horizontalScrollView = new HorizontalScrollView(context);
        HorizontalScrollView.LayoutParams params = new HorizontalScrollView.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT);
        horizontalScrollView.setLayoutParams(params);
        horizontalScrollView.setHorizontalScrollBarEnabled(false);

        linearLayout = new LinearLayout(context);
        LinearLayout.LayoutParams linearLayoutParams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
        linearLayout.setLayoutParams(linearLayoutParams);

        horizontalScrollView.addView(linearLayout);
    }

    public LinearLayout addHorizontalScrollView(LinearLayout linearLayout) {
        linearLayout.addView(horizontalScrollView);
        return linearLayout;
    }

    public CustomItemView addNewEntryView(final String newTitle) {
        CustomItemView customItemView = new CustomItemView(context);
        customItemView.setTitle(newTitle);
        linearLayout.addView(customItemView);

        return customItemView;
    }
}

Now get a LinearLayout as the scroll view holder and add views to the based on the items to be added in each row.

In the activity layout of your Activity

<ScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/white"
    android:fillViewport="true">

    <LinearLayout
        android:id="@+id/scrollViewHolder"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical" />
</ScrollView>

Now just add your HorizontalRecyclerView to this LinearLayout by looping through your list, thrice at a time.

private LinearLayout mScrollViewHolder;
mScrollViewHolder = (LinearLayout) v.findViewById(R.id.scrollViewHolder);

MyHorizontalScrollView myHorizontalScrollView = new MyHorizontalScrollView(this.getContext());
myHorizontalScrollView.addHorizontalScrollView(mScrollViewHolder);
myHorizontalScrollView.addNewEntryView("Something");