如何为RecyclerView添加OnClickListener并跳转至详情页？

步骤1：修改Adapter，添加点击回调机制 #

在MakeUpAdapter中定义点击回调接口，将点击事件传递到外部处理：

class MakeUpAdapter : RecyclerView.Adapter<MakeUpAdapter.MakeUpViewHolder>(){
    private val data = ArrayList<MakeUpModel>()
    
    // 定义点击回调接口
    interface OnItemClickListener {
        fun onItemClicked(makeUp: MakeUpModel)
    }
    
    // 存储回调实例
    private var onItemClickListener: OnItemClickListener? = null

    // 设置回调的公共方法
    fun setOnItemClickListener(listener: OnItemClickListener) {
        this.onItemClickListener = listener
    }

    inner class MakeUpViewHolder (itemView: View) : RecyclerView.ViewHolder(itemView){
        fun bind(data: MakeUpModel) {
            Glide.with(itemView.context).load(data.Picture)
                .apply(RequestOptions().override(100, 100))
                .into(itemView.iv_item)
            itemView.tv_Name.text = data.Name

            // 给列表项设置点击事件，触发回调
            itemView.setOnClickListener {
                onItemClickListener?.onItemClicked(data)
            }
        }
    }

    // 以下为原有代码，无需修改
    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): MakeUpViewHolder {
        val view: View =LayoutInflater.from(parent.context).inflate(R.layout.item_makeup, parent, false)
        return MakeUpViewHolder(view)
    }

    override fun onBindViewHolder(holder: MakeUpViewHolder, position: Int) {
        holder.bind(data[position])
    }

    override fun getItemCount(): Int = data.size

    @SuppressLint("NotifyDataSetChanged")
    fun setData(list: ArrayList<MakeUpModel>) {
        data.clear()
        data.addAll(list)
        notifyDataSetChanged()
    }
}

步骤2：在MainActivity中实现点击跳转逻辑 #

初始化Adapter后，设置回调并启动详情页Activity：

class MainActivity : AppCompatActivity() {
    private lateinit var adapter: MakeUpAdapter

    @SuppressLint("NotifyDataSetChanged")
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        rv_kamu.setHasFixedSize(true)
        rv_kamu.layoutManager = LinearLayoutManager(this)
        adapter = MakeUpAdapter()
        
        // 设置点击回调，处理跳转逻辑
        adapter.setOnItemClickListener(object : MakeUpAdapter.OnItemClickListener {
            override fun onItemClicked(makeUp: MakeUpModel) {
                // 启动详情页Activity，替换为你实际的详情页类名
                val intent = Intent(this@MainActivity, DetailActivity::class.java)
                // 传递详情页所需数据，根据MakeUpModel实际字段调整
                intent.putExtra("MAKE_UP_NAME", makeUp.Name)
                intent.putExtra("MAKE_UP_PICTURE", makeUp.Picture)
                // 可添加更多需要传递的字段，比如id、详情描述等
                startActivity(intent)
            }
        })

        rv_kamu.adapter = adapter
        getDataFromApi()
    }

    // 以下为原有代码，无需修改
    private fun getDataFromApi() {
        Retrofit.instance.getMakeUpList().enqueue(object : Callback<ArrayList<MakeUpModel>>{
            override fun onResponse(call: Call<ArrayList<MakeUpModel>>,response: Response<ArrayList<MakeUpModel>>) {
                if(response.isSuccessful) {
                    showData(response.body()!!)
                }
            }

            override fun onFailure(call: Call<ArrayList<MakeUpModel>>, t: Throwable) {
                Log.e("Fail", "Be Fail")
            }
        })
    }

    private fun showData(data: ArrayList<MakeUpModel>) {
        val result = data
        adapter.setData(result)
    }
}

关键说明 #

• 回调接口的作用是解耦Adapter和页面逻辑，避免在Adapter中直接依赖上下文启动Activity，更符合代码设计规范。
• 传递数据时，根据你的MakeUpModel实际字段调整putExtra的参数，确保详情页能正确接收并展示内容。
• 之前添加变量报错通常是因为未正确定义接口或初始化回调实例，按照上述代码结构即可避免这类问题。

内容的提问来源于stack exchange，提问作者Salsabila