Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

GridLayout and LinearLayout both in one RecyclerView

any idea how to use Two different LayoutManager in one View? I have four cards in grid on top of the screen and bottom, and I want LinearLayout but RecyclerView showing one View at a time

RecyclerView.LayoutManager mLayoutManager = new GridLayoutManager(this, 2);
recyclerView.setLayoutManager(mLayoutManager);
RecyclerView.LayoutManager lmLayoutManager = new LinearLayoutManager(this);
recyclerView.setLayoutManager(lmLayoutManager);
recyclerView.addItemDecoration(new GridSpacingDashboard(2, dpToPx(2), true));
recyclerView.setItemAnimator(new DefaultItemAnimator());
recyclerView.setAdapter(adapter);

Is there any way I can use both Views in a single RecyclerView Or on Index O I have GridLayout and on 1 showing LinearLayout , How can achieve if there is any possibilities

Update (Card Adapter)

    public class CardAdapter extends RecyclerView.Adapter<adapter.CardAdapter.CardViewHolder> {

        public static final int topGridCard = 0;
        public static final int bottomCards=1;

        private Context mContext;
        private List<CardModel> cardList;

        public CardAdapter(Context mContext, List<CardModel> cardList) {
            this.mContext = mContext;
            this.cardList = cardList;
        }

        @Override
        public.adapter.CardAdapter.CardViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
            View v;

            if (viewType == topGridCard) {
                v = LayoutInflater.from(parent.getContext()).inflate(R.layout.card_view_sec, parent, false);
                return new adapter.CardAdapter.TopGridCardView(v);

            }
            else if (viewType == bottomCards) {
                v = LayoutInflater.from(parent.getContext()).inflate(R.layout.card_view, parent, false);
                return new adapter.CardAdapter.BottomCardView(v);
            }
            return null;
        }

        @Override
        public void onBindViewHolder(final adapter.CardAdapter.CardViewHolder holder, final int position) {
            CardModel cardModel = cardList.get(position);
            if (holder.getItemViewType()==topGridCard){ adapter.CardAdapter.TopGridCardView vholder = (adapter.CardAdapter.TopGridCardView) holder;
                vholder.secTitleStats.setText(cardModel.getNumStats());
                vholder.secNumStats.setText(cardModel.getCardTitles());
                vholder.secCardStats.setText(cardModel.getSecCartNumStats());
                Glide.with(mContext).load(cardModel.getThumbnail()).into(vholder.secthumbnail);
            }
            else if(holder.getItemViewType()==bottomCards){
adapter.CardAdapter.BottomCardView vholder = (adapter.CardAdapter.BottomCardView) holder;
                vholder.numStats.setText(cardModel.getNumStats());
                vholder.image_title.setText(cardModel.getCardTitles());
                Glide.with(mContext).load(cardModel.getThumbnail()).into(vholder.thumbnail);
            }       
        }

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

        public static class CardViewHolder extends RecyclerView.ViewHolder {
            public CardViewHolder(View v) {
                super(v);
            }
        }

        public class TopGridCardView extends adapter.CardAdapter.CardViewHolder {
            public TextView secTitleStats, secNumStats,secCardStats;
            public ImageView secthumbnail;

            public TopGridCardView(View view){
                super(view);

                secTitleStats = (TextView) view.findViewById(R.id.secTitleNumStats);
                secNumStats = (TextView) view.findViewById(R.id.secCardNumStats);
                secCardStats = (TextView) view.findViewById(R.id.sectitle);
                secthumbnail = (ImageView) view.findViewById(R.id.seCthumbnail);
            }
        }

        public class BottomCardView extends adapter.CardAdapter.CardViewHolder {

            public TextView numStats,image_title;
            public ImageView thumbnail;

            public BottomCardView(View view) {
                super(view);
                numStats=(TextView)view.findViewById(R.id.numStatics);
                image_title=(TextView) view.findViewById(R.id.title_overlay);
                thumbnail = (ImageView) view.findViewById(R.id.thumbnail);
            }
        }

        @Override
        public int getItemViewType(int position) {
            if (isPositionHeader(position))
                return topGridCard;
            return bottomCards;
        }

        private boolean isPositionHeader(int position) {
            return position == 0;
        }
    }

I have attached my Adapter just for more understanding , what the desired result should be |Grid Card 1 | Grid Card 2 | |Grid Card 3 | Grid Card 4 | | LinearLayout Card 1 | | LinearLayout Card 2 |

any possibilities

like image 301
Mohtashim Avatar asked Dec 13 '16 09:12

Mohtashim


People also ask

How many layouts are used in RecyclerView?

The RecyclerView library provides three layout managers, which handle the most common layout situations: LinearLayoutManager arranges the items in a one-dimensional list.

What is grid LayoutManager?

A RecyclerView. LayoutManager implementations that lays out items in a grid. By default, each item occupies 1 span. You can change it by providing a custom SpanSizeLookup instance via setSpanSizeLookup(SpanSizeLookup) .


1 Answers

you can simply use gridLayout with different viewType to achieve this.

    mLayoutManager = new GridLayoutManager(getActivity(), 2);
    mLayoutManager.setSpanSizeLookup(new GridLayoutManager.SpanSizeLookup() {
        @Override
        public int getSpanSize(int position) {
            switch (adapter.getItemViewType(position)) {
                case MenuAdapter.ITEM:
                    return 1;
                case MenuAdapter.FULLSIZE:
                    return 2;
                default:
                    return 1;
            }
        }
    });
    recyclerView.setLayoutManager(mLayoutManager);

Where ITEM is a grid(2x column) then return 1, otherwise FULLSIZE return 2(takes 2x grid column).

hope it helped.

like image 156
Damian Avatar answered Sep 19 '22 03:09

Damian