Prince Ali
Prince Ali

Reputation: 63

Flexbox horizontal scroll not working - why?

I want just 3 items centered along with horizontal scroll for remaining items, Also I want the centered item to get highlighted on scroll or tap. Here is what i want

enter image description here

I am using flexboxlayout manager and here is what i did

flexboxLayoutManager=new FlexboxLayoutManager(getContext());
flexboxLayoutManager.setJustifyContent(JustifyContent.SPACE_AROUND);
flexboxLayoutManager.setFlexDirection(FlexDirection.COLUMN);
flexboxLayoutManager.setFlexWrap(FlexWrap.WRAP);

recyclerView_stats_list.setLayoutManager(flexboxLayoutManager);

and in the adapter viewholder

 ViewGroup.LayoutParams lp = itemView.getLayoutParams();
        if (lp instanceof FlexboxLayoutManager.LayoutParams) {
            FlexboxLayoutManager.LayoutParams flexboxLp =
                    (FlexboxLayoutManager.LayoutParams) itemView.getLayoutParams();
            flexboxLp.setFlexGrow(1.0f);
        }

If i change the flex direction from column to row it centeres my 3 items but then it starts to scroll vertically, I need that same but with horizontal scrolling.

Upvotes: 3

Views: 3164

Answers (1)

DeadPool
DeadPool

Reputation: 71

If you have a horizontal recyclerView, you can use this in your adapter

ViewGroup.LayoutParams lp = viewHolder.itemView.getLayoutParams();
if (lp instanceof FlexboxLayoutManager.LayoutParams) {
FlexboxLayoutManager.LayoutParams flexboxLp = 
(FlexboxLayoutManager.LayoutParams) lp;
flexboxLp.setFlexShrink(0.0f);
flexboxLp.setAlignSelf(AlignSelf.FLEX_END);
}

set your recyclerView with FlexLayoutManager like the following in your mainActivity

FlexboxLayoutManager layoutManager = new FlexboxLayoutManager(mContext);
layoutManager.setFlexDirection(FlexDirection.ROW);
layoutManager.setFlexWrap(FlexWrap.NOWRAP);
layoutManager.setJustifyContent(JustifyContent.SPACE_AROUND);

recyclerView.setLayoutManager(layoutManager)

once you have set the scrolling and spacing is fine. You can create a drawable file and set onClickListener in your adapter to highlight. Try looking for highlighting elements in recyclerView. Read about FlexLayout on github to get more information as to how you can restrict 3 elements on the screen. Would recommend creating a class ItemDecoration and adding it to your recyclerView

Upvotes: 3

Related Questions