【Android实战】RecyclerView实现水平可滚动gridview

来源：互联网发布：python idle设置编辑：程序博客网时间：2024/05/13 23:56

先看一下实现的效果图（CSDN上传gif图限制在2M，所以只能通过压缩图片宽高和帧数来降低图片大小，结果导致图片分辨率变低），不过还好可以看清

如果有朋友想知道如何录制手机屏幕，然后将录制的video再转换成gif动图，请参考下面这篇博客（Android手机屏幕录制并转换成GIF）

言归正转，这里主要完成的功能如下：

1、实现可以水平滑动的列表

2、列表项的点击效果与交互限制（只可以选择三个标签）

写这篇博客的原因，是因为之前的实现碰到了一个问题。

之前的实现可以查看这篇博客 HorizontalScrollView实现可滑动GridView，并通过与该篇博客进行对比，来了解RecyclerView的强大，以及RecyclerView在使用上与传统ListView和GridView的区别

这里的效果是直接使用RecyclerView来实现的

首先说明一下，这里我并没有通过

<android.support.v7.widget.RecyclerView        android:id="@+id/recyclerview_horizontal"        android:layout_width="match_parent"        android:layout_height="50dp"        android:scrollbars="horizontal" />

这种方式来声明，而是声明了一个FramLayout进行占位，然后在代码中动态添加

<FrameLayout        android:id="@+id/tag_recyclerView_container"        android:layout_width="match_parent"        android:layout_height="50dp"        android:layout_above="@id/start_live_btn"        />

动态添加RecyclerVIew

/**     * 初始化水平滑动标签列表     * add By Author     */    private void initHorizontalTagRecycler() {        // 创建一个线性布局管理器        FrameLayout tagFrameLayout = (FrameLayout) findViewById(R.id.tag_recyclerView_container);        horizontalTagRecyclerView = new RecyclerView(this);        LinearLayoutManager layoutManager = new LinearLayoutManager(this);        layoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);        // 设置布局管理器        horizontalTagRecyclerView.setLayoutManager(layoutManager);        //设置间距        int spacingInPixels = getResources().getDimensionPixelSize(R.dimen.dp_5);        horizontalTagRecyclerView.addItemDecoration(new SpaceItemDecoration(spacingInPixels));        //去掉RecyclerView滑到边界产生的蓝色阴影        horizontalTagRecyclerView.setOverScrollMode(View.OVER_SCROLL_NEVER);        tagFrameLayout.addView(horizontalTagRecyclerView);        TLAdapter = new HorizontalTagAdapter(this);        horizontalTagRecyclerView.setAdapter(TLAdapter);        TLAdapter.setOnItemClickLitener(new HorizontalTagAdapter.OnItemClickLitener() {            @Override            public void onItemClick(View view, int position) {                ArrayList<TalentLableItem> showItems = new ArrayList<TalentLableItem>();                showItems = TLAdapter.getItems();                int count = 0;                for (TalentLableItem item : showItems) {                    if (item.isSelected()) {                        count++;                    }                }                if (count < 3) {                    TLAdapter.setSeclection(position);                    TLAdapter.notifyDataSetChanged();                } else {                    if (items.get(position).isSelected()) {                        TLAdapter.setSeclection(position);                        TLAdapter.notifyDataSetChanged();                    } else {                        ToastUtils.toast(CreateLiveRoomActivity.this, "最多只能选择三个标签");                    }                }            }        });    }

设置item之间的间距使用到了ItemDecoration这个类

RecyclerView没有可以直接设置间距的属性，但可以用ItemDecoration来装饰一个item，所以继承重写ItemDecoration就可以实现（上下左右的）间距了

/**     * RecyclerViews support the concept of ItemDecoration: special offsets and drawing around each element.     */    public class SpaceItemDecoration extends RecyclerView.ItemDecoration{        private int space;        public SpaceItemDecoration(int space) {            this.space = space;        }        @Override        public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {            if(parent.getChildPosition(view) != 0)                outRect.left = space;        }    }

我这里设置的是左边距，你也可以设置top、bottom、right

再来看一下适配器

/** * Created by Author on 2015/12/2. */public class HorizontalTagAdapter extends RecyclerView.Adapter<HorizontalTagAdapter.ViewHolder> {    private static final String TAG = "HorizontalTagAdapter";    private Context context;    private ArrayList<TalentLableItem> items;    private LayoutInflater mInflater;    private int clickTemp = -1;    public HorizontalTagAdapter(Context context) {        super();        this.context = context;        items = new ArrayList<TalentLableItem>();        mInflater = LayoutInflater.from(context);    }    @Override    public ViewHolder onCreateViewHolder(ViewGroup viewGroup, int i) {        // 创建一个View，简单起见直接使用系统提供的布局，就是一个TextView        View view = View.inflate(viewGroup.getContext(), R.layout.talent_label_item, null);        // 创建一个ViewHolder        ViewHolder holder = new ViewHolder(view);        return holder;    }    @Override    public void onBindViewHolder(final HorizontalTagAdapter.ViewHolder viewHolder, int i) {        // 绑定数据到ViewHolder上        viewHolder.mTextView.setText("#" + items.get(i).getLabel() + "#");        TalentLableItem TLItem = items.get(i);        if (TLItem.isSelected()) {            viewHolder.mTextView.setBackgroundResource(R.drawable.shape_roundrect_label_selected);            viewHolder.mTextView.setTextColor(context.getResources().getColor(R.color._3e363d));        } else {            viewHolder.mTextView.setBackgroundResource(R.drawable.shape_roundrect_label_normal);            viewHolder.mTextView.setTextColor(context.getResources().getColor(R.color.ffffff));        }        if (clickTemp == i) {            if (TLItem.isSelected()) {                viewHolder.mTextView.setBackgroundResource(R.drawable.shape_roundrect_label_normal);                viewHolder.mTextView.setTextColor(context.getResources().getColor(R.color.ffffff));                TLItem.setSelected(false);            } else {                viewHolder.mTextView.setBackgroundResource(R.drawable.shape_roundrect_label_selected);                viewHolder.mTextView.setTextColor(context.getResources().getColor(R.color._3e363d));                TLItem.setSelected(true);            }        }        if (mOnItemClickLitener != null) {            viewHolder.itemView.setOnClickListener(new View.OnClickListener() {                @Override                public void onClick(View v) {                    int pos = viewHolder.getLayoutPosition();                    mOnItemClickLitener.onItemClick(viewHolder.itemView, pos);                }            });        }    }    @Override    public int getItemCount() {        return items.size();    }    public static class ViewHolder extends RecyclerView.ViewHolder {        public TextView mTextView;        public ViewHolder(View itemView) {            super(itemView);            mTextView = (TextView) itemView.findViewById(R.id.label);        }    }    public void setShowItems(ArrayList<TalentLableItem> items) {        this.items = items;        notifyDataSetChanged();    }    public ArrayList<TalentLableItem> getItems() {        return items;    }    public void setSeclection(int position) {        clickTemp = position;    }    public interface OnItemClickLitener {        void onItemClick(View view, int position);    }    private OnItemClickLitener mOnItemClickLitener;    public void setOnItemClickLitener(OnItemClickLitener mOnItemClickLitener) {        this.mOnItemClickLitener = mOnItemClickLitener;    }}

RecyclerView在进行视图展示，数据绑定，事件响应方面与普通的ListView和GridVIew略有区别，但是基本方式差不多

0 0