12345 12345 - 4 months ago 24
Android Question

RecyclerView to be Scrolled horizontally with the width

I have more items to show in the cardView horizontally inside a recyclerView and I have more cards veritically.

I tried to place cardView inside a HorizontalScrollView, It worked to scroll the idividual card. I wanted to scroll the entire RecyclerView to be scrolled to see right end items.

I tried with the RecyclerView inside a HorizontalScroolView not worked. RecyclerView inside a NestedScrollView not worked.

The RecyclerView is in a fragment. Inside the viewPager tabLayout, this is one of the fragment

fragment xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<android.support.v7.widget.RecyclerView
android:id="@+id/record_recycler"
android:layout_width="550dp"
android:scrollbars="horizontal"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>


Adapter:

public class TestAdapter extends RecyclerView.Adapter{
private List<Model> items;
Context context;
public TestAdapter(Context con, List<Model> itemslist) {
context=con;
this.items = itemslist;
}

@Override
public int getItemViewType(int position) {
return items.get(position).getUnique();
}

@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
if(viewType==0)
return new MyViewHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.cricketrank_record_valuecard, parent, false));
else
return new MyViewHolder1(LayoutInflater.from(parent.getContext()).inflate(R.layout.cricketrank_record_titlecard, parent, false));

}

@Override
public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
if (holder instanceof MyViewHolder)
try{
((MyViewHolder)holder).bindViewHolder(position);
}catch (Exception e){
Log.e(Constant.Tag,e.toString());
}
else if(holder instanceof MyViewHolder1)
try{
((MyViewHolder1)holder).bindViewHolder(position);
}catch (Exception e){
Log.e(Constant.Tag,e.toString());
}
}

@Override
public int getItemCount() {
return items.size();
}

public class MyViewHolder extends RecyclerView.ViewHolder{
public TextView text,text1,text2,text3,text4,text5;
public View mCardView;

public MyViewHolder(View view) {
super(view);
text1 = (TextView) view.findViewById(R.id.text1);
text2 = (TextView) view.findViewById(R.id.text2);
text3 = (TextView) view.findViewById(R.id.text3);
text4 = (TextView) view.findViewById(R.id.text4);
}

public void bindViewHolder(int position) {

text1.setText(items.get(position).getTeam());
text2.setText(items.get(position).getRank());
text3.setText(items.get(position).getMatches());
text4.setText(items.get(position).getPoints());
}
}
}

public class MyViewHolder1 extends RecyclerView.ViewHolder{
public TextView text,text1,text2,text3,text4,text5;
public RelativeLayout rl;

public MyViewHolder1(View view) {
super(view);
text = (TextView) view.findViewById(R.id.text);
text1 = (TextView) view.findViewById(R.id.text1);
text2 = (TextView) view.findViewById(R.id.text2);
text3 = (TextView) view.findViewById(R.id.text3);
text4 = (TextView) view.findViewById(R.id.text4);
rl = (RelativeLayout) view.findViewById(R.id.rl);
}

public void bindViewHolder(int position) {
text1.setText(items.get(position).getTeam());
text2.setText(items.get(position).getRank());
text3.setText(items.get(position).getMatches());
text4.setText(items.get(position).getPoints());

}
}
}


MainActivity:

RecyclerView record_recycler= (RecyclerView) view.findViewById(R.id.record_recycler);
RecyclerView.LayoutManager mLayoutManager = new LinearLayoutManager(getActivity());
record_recycler.setLayoutManager(mLayoutManager);
record_recycler.setItemAnimator(new DefaultItemAnimator());
TestAdapter adapter = new TestAdapter(getActivity(), list);
record_recycler.setAdapter(adapter);

Answer

I think you are trying to scroll the recyclerview in two direction. Vertical is usual scroll of recylerview and in horizontally, the scrolling view if it is not fit with the mentioned width. Right?

If you are trying this, then I think it is not possible to scroll like you think. You can scroll the recycler view in both the directions with different views holding on them.

As you said the scrolling of cardview is possible, by default it won't have any scrolling properly normally. So it will scroll to show the card content completely to the user if they are not seeing completely and you set the scrolling view to scroll.

The possible way is, keep the views vertically with their field name and value. If you want to create more, then add one more row to accommodate the values down.

Have a look below:

<android.support.v7.widget.CardView
    android:id="@+id/card"
    android:layout_marginTop="2dp"
    android:layout_marginBottom="4dp"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
        <LinearLayout
            android:id="@+id/layout2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/layout1"
            android:orientation="horizontal">
            <TextView
                android:text="One"
                android:textSize="@dimen/font_itemsrow_13dp"
                android:layout_weight=".11"
                android:paddingLeft="3dp"
                android:paddingRight="3dp"
                android:layout_width="0dp"
                android:layout_height="wrap_content" />
            <TextView
                android:text="Two"
                android:textSize="@dimen/font_itemsrow_13dp"
                android:layout_weight=".11"
                android:paddingRight="3dp"
                android:layout_width="0dp"
                android:layout_height="wrap_content" />
            <TextView
                android:text="Three"
                android:textSize="@dimen/font_itemsrow_13dp"
                android:layout_weight=".24"
                android:paddingRight="3dp"
                android:layout_width="0dp"
                android:layout_height="wrap_content" />
            <TextView
                android:text="Four"
                android:textSize="@dimen/font_itemsrow_13dp"
                android:layout_weight=".11"
                android:paddingRight="3dp"
                android:layout_width="0dp"
                android:layout_height="wrap_content" />
            <TextView
                android:text="Five"
                android:textSize="@dimen/font_itemsrow_13dp"
                android:layout_weight=".17"
                android:paddingRight="3dp"
                android:layout_width="0dp"
                android:layout_height="wrap_content" />
            <TextView
                android:text="Six"
                android:textSize="@dimen/font_itemsrow_13dp"
                android:layout_weight=".26"
                android:paddingRight="3dp"
                android:layout_width="0dp"
                android:layout_height="wrap_content" />

        </LinearLayout>
        <LinearLayout
            android:id="@+id/layout3"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="@dimen/padding_3dp"
            android:layout_below="@+id/layout2"
            android:orientation="horizontal">
            <TextView
                android:id="@+id/one"
                android:textSize="@dimen/font_itemsrow_14dp"
                android:textColor="@color/black"
                android:layout_weight=".11"
                android:paddingLeft="3dp"
                android:paddingRight="3dp"
                android:layout_width="0dp"
                android:layout_height="wrap_content" />
            <TextView
                android:id="@+id/two"
                android:textSize="@dimen/font_itemsrow_14dp"
                android:textColor="@color/black"
                android:layout_weight=".11"
                android:paddingRight="3dp"
                android:layout_width="0dp"
                android:layout_height="wrap_content" />
            <TextView
                android:id="@+id/three"
                android:textSize="@dimen/font_itemsrow_14dp"
                android:textColor="@color/black"
                android:layout_weight=".24"
                android:paddingRight="3dp"
                android:layout_width="0dp"
                android:layout_height="wrap_content" />
            <TextView
                android:id="@+id/four"
                android:textSize="@dimen/font_itemsrow_14dp"
                android:textColor="@color/black"
                android:layout_weight=".11"
                android:paddingRight="3dp"
                android:layout_width="0dp"
                android:layout_height="wrap_content" />
            <TextView
                android:id="@+id/five
                android:textSize="@dimen/font_itemsrow_14dp"
                android:textColor="@color/black"
                android:layout_weight=".17"
                android:paddingRight="3dp"
                android:layout_width="0dp"
                android:layout_height="wrap_content" />
            <TextView
                android:id="@+id/six"
                android:textSize="@dimen/font_itemsrow_14dp"
                android:textColor="@color/black"
                android:layout_weight=".26"
                android:paddingRight="3dp"
                android:layout_width="0dp"
                android:layout_height="wrap_content" />
        </LinearLayout>
        <LinearLayout
         ....// Add extra title Row
        </LinearLayout>
        <LinearLayout
         ....// Add extra Values Row
        </LinearLayout>
    </RelativeLayout>
</android.support.v7.widget.CardView>