RecyclerView使用指南（三）—— 新增分割線和點選事件

will20151115發表於2018-11-27
View事件

宣告：原創作品，轉載請註明出處：www.jianshu.com/p/4d658b0b7…

今天來說一說，我們如何給自己的RecyclerView新增分割線和點選事件，講完這兩個功能點，已經可以滿足日常開發工作了。

一、分割線：

這個功能非常簡單，因為SDK已經為我們實現了這個功能，我們只需要呼叫RecyclerView的addItemDecoration()方法，並傳入DividerItemDecoration的物件就OK了。程式碼如下：

    RecyclerView recyclerView = findViewById(R.id.rv);
    RvAdapter adapter = new RvAdapter(list);
    recyclerView.addItemDecoration(new DividerItemDecoration(this, DividerItemDecoration.VERTICAL));
    recyclerView.setAdapter(adapter);
複製程式碼

這樣，我們就為我們的RecyclerView新增了分割線。

RecyclerView使用指南（三）—— 新增分割線和點選事件

二、點選事件

RecyclerView本身沒有提供點選事件給我們，所以我們需要自己實現這個功能。

  • 基本思路：
  1. 建立OnItemClickListener介面。
  2. 修改Adapter，增加OnItemClickListener型別的成員變數和set方法。
  3. 在onBindViewHolder()方法中，根據OnItemClickListener，為條目設定監聽。
  4. 在Activity中設定點選監聽。

好，有了思路，我們開始一步一步的執行： 建立介面OnItemClickListener：

package com.liuym.myapplication;

import android.view.View;

public interface OnItemClickListener {
    void onItemClick(View view, int positon);
}
複製程式碼

修改Adapter：

package com.liuym.myapplication;

import android.support.annotation.NonNull;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;

import java.util.List;

public class RvAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
    //條目型別
    public static final int TYPE_0 = 0;
    public static final int TYPE_1 = 1;

    //資料來源
    private List<Data> mList;
    //點選監聽
    private OnItemClickListener mOnItemClickListener;

    public RvAdapter(List<Data> list) {
        mList = list;
    }

    public void setOnItemClickListener(OnItemClickListener onItemClickListener) {
        mOnItemClickListener = onItemClickListener;
    }

    @NonNull
    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(@NonNull ViewGroup viewGroup, int viewType) {
        View item;
        RecyclerView.ViewHolder holder = null;
        if (viewType == TYPE_0) {
            item = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.item_rv_type1, viewGroup, false);
            holder = new Type0ViewHolder(item);
        }
        if (viewType == TYPE_1) {
            item = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.item_rv_type2, viewGroup, false);
            holder = new Type1ViewHolder(item);
        }
        return holder;
    }

    /**
     * 根據資料來源的某一項，返回相應的佈局類別
     *
     * @param position
     * @return
     */
    @Override
    public int getItemViewType(int position) {
        return mList.get(position).getType();
    }

    @Override
    public void onBindViewHolder(@NonNull RecyclerView.ViewHolder viewHolder, final int i) {
        int type = getItemViewType(i);
        Data data = mList.get(i);
        if (type == TYPE_0) {
            Type0ViewHolder holder = (Type0ViewHolder) viewHolder;
            holder.iv.setImageResource(R.drawable.ic_launcher_background);
            holder.tv.setText(data.getText());
            if (mOnItemClickListener != null) {
                holder.ll.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        mOnItemClickListener.onItemClick(v,i);
                    }
                });
            }
        }
        if (type == TYPE_1) {
            Type1ViewHolder holder = (Type1ViewHolder) viewHolder;
            holder.iv.setImageResource(R.drawable.ic_launcher_background);
            holder.tv.setText(data.getText());
            if (mOnItemClickListener != null) {
                holder.ll.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        mOnItemClickListener.onItemClick(v,i);
                    }
                });
            }
        }
    }

    @Override
    public int getItemCount() {
        return mList == null ? 0 : mList.size();
    }


    class Type0ViewHolder extends RecyclerView.ViewHolder {
        LinearLayout ll;
        ImageView iv;
        TextView tv;

        public Type0ViewHolder(@NonNull View itemView) {
            super(itemView);
            ll = itemView.findViewById(R.id.ll);
            iv = itemView.findViewById(R.id.iv);
            tv = itemView.findViewById(R.id.tv);
        }
    }

    class Type1ViewHolder extends RecyclerView.ViewHolder {
        LinearLayout ll;
        ImageView iv;
        TextView tv;

        public Type1ViewHolder(@NonNull View itemView) {
            super(itemView);
            ll = itemView.findViewById(R.id.ll);
            iv = itemView.findViewById(R.id.iv);
            tv = itemView.findViewById(R.id.tv);
        }
    }
}
複製程式碼

在Activity中為Adapter設定條目點選事件：

    adapter.setOnItemClickListener(new OnItemClickListener() {
        @Override
        public void onItemClick(View view, int positon) {
            Toast.makeText(MainActivity.this, list.get(positon).getText(), Toast.LENGTH_SHORT).show();
        }
    });
複製程式碼

總結

這一篇，我講解了如何新增分割線和Item的點選事件，下一篇我會詳細的講解一下ItemDecoration的使用方式。

系列文章

《RecyclerView使用指南（一）—— 基本使用》
《RecyclerView使用指南（二）—— 多種ItemLayout》
《RecyclerView使用指南（三）—— 新增分割線和點選事件》
《RecyclerView使用指南（四）—— 使用ItemDecoration》
《RecyclerView使用指南（五）—— 實現吸頂效果》

相關文章