The vertical Gallery, zoom in the middle and press on both sides

Use RecyclerView to achieve Gallery effect, enlarge in the middle, and press both sides


Specific github: https://github.com/Azoft/CarouselLayoutManager

Usage method

1. Add dependency

2. Add a layout and use the recyclerview of the system (remember to import the package of recyclerview)

Item

3. The user-defined adapter usually uses the item click event, so you write it in advance

public class MyAdapter extends RecyclerView.Adapter<MyAdapter.ViewHolder> {
    private List<Integer> mFruitList;
    private OnItemClickListener mOnItemClickListener;

    public interface OnItemClickListener{
        void onClick( int position);
        void onLongClick( int position);
    }
    public void setOnItemClickListener(OnItemClickListener onItemClickListener ){
        this. mOnItemClickListener=onItemClickListener;
    }
    public MyAdapter(List<Integer> mFruitList) {
        this.mFruitList = mFruitList;
    }
    @NonNull
    @Override
    public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        View view=LayoutInflater.from(parent.getContext())
                .inflate(R.layout.item_img,parent,false);
        ViewHolder holder=new ViewHolder(view);
        return holder;
    }
    @Override
    public void onBindViewHolder(@NonNull final ViewHolder holder, int position) {
        final int index=position;
        int fruit=mFruitList.get(index);
        holder.imageView.setImageResource(fruit);
        if( mOnItemClickListener!= null){
            holder.itemView.setOnClickListener( new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    mOnItemClickListener.onClick(index);
                }
            });
            holder. itemView.setOnLongClickListener( new View.OnLongClickListener() {
                @Override
                public boolean onLongClick(View v) {
                    mOnItemClickListener.onLongClick(index);
                    return false;
                }
            });
        }
    }
    @Override
    public int getItemCount() {
        return mFruitList.size();
    }
    public class ViewHolder extends RecyclerView.ViewHolder {
        ImageView imageView;
        public ViewHolder(View itemView) {
            super(itemView);
            imageView=itemView.findViewById(R.id.img_item_img);
        }
    }
}

4. Used in activity

public class CarouselRecyclerView extends AppCompatActivity {
        private List<Integer> mDatas;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_carousel_recycler_view);
        mDatas=new ArrayList<>();
        mDatas.add(R.drawable.fruit1);
        mDatas.add(R.drawable.fruit2);
        mDatas.add(R.drawable.fruit3);
        mDatas.add(R.drawable.fruit4);
        mDatas.add(R.drawable.fruit5);

        final CarouselLayoutManager layoutManager = new CarouselLayoutManager(CarouselLayoutManager.VERTICAL, true);
        layoutManager.setPostLayoutListener(new CarouselZoomPostLayoutListener());//Achieve zoom effect
        final RecyclerView recyclerView =findViewById(R.id.carousel_recyclerview);
        recyclerView.setLayoutManager(layoutManager);
        recyclerView.setHasFixedSize(true);//Fixed item size
        final MyAdapter myAdapter=new MyAdapter(mDatas);
        recyclerView.setAdapter(myAdapter);
        recyclerView.addOnScrollListener(new CenterScrollListener());
        myAdapter.setOnItemClickListener(new MyAdapter.OnItemClickListener() {
            @Override
            public void onClick(int position) {
                Toast.makeText(CarouselRecyclerView.this,"you click "+position+" position"
                            ,Toast.LENGTH_SHORT).show();
            }
            @Override
            public void onLongClick(int position) {
            }
        });
        
        layoutManager.addOnItemSelectionListener(new CarouselLayoutManager.OnCenterItemSelectionListener() {
            /*
             After use, it is found that this method is a listening method for item change. For example, after the completion of rolling from pos=1 to pos=2, it will call
                    */
            @Override
            public void onCenterItemChanged(int adapterPosition) {
                int index=adapterPosition;
                //I don't know what the judgment is. It's rolling enough
                if(CarouselLayoutManager.INVALID_POSITION!= adapterPosition) {
                    Toast.makeText(CarouselRecyclerView.this,"you scroll to "+index+" position"
                            ,Toast.LENGTH_SHORT).show();
                }
                Toast.makeText(CarouselRecyclerView.this,"you scroll to "+index+" position"
                        ,Toast.LENGTH_SHORT).show();
            }
        });
    }
}

 

The above is all the code. Copy, paste and import the package to use

Conclusion:

I can't write it myself, so I have to find it

It took a long time to find this effect

It seems that the spacing between two items cannot be set directly. Change the xml of the item to meet the effect

If the ImageView in this item is changed to VideoView, scrolling up and down will still show the masking effect, but I'm satisfied

 

See the github address of this project for other details

Reference article: https://www.cnblogs.com/guanhaoran/p/7060843.html

Tags: github xml

Posted on Sun, 05 Jan 2020 19:30:58 -0800 by adi