在第九天，已經成功地將資料清單顯示在 RecyclerView 上了。代表已經掌握了 App 開發中的列表顯示技術。
今天我們要做在點擊清單中，任何一個項目時，App 也應該要做出反應，例如跳轉到新的頁面、或顯示詳細資訊。
所以來學習如何為 RecyclerView 的列表項目，加入點擊事件！

處理 RecyclerView 項目點擊事件的兩種方法

在 RecyclerView 中，處理點擊事件有兩種常見的方法：

1. 在 Adapter 中直接處理：這個方法最簡單，但如果點擊後需要跳轉到新的頁面，程式碼會寫得比較雜亂。
2. 透過 interface 回傳：這是更專業、更推薦的方法。它能將「處理點擊」的邏輯，和「如何顯示」的邏輯分開，讓你的程式碼更清晰。

今天，我們將會使用第二種方法，因為它更符合程式設計的「分層」思維。

實作時間：讓列表項目可以被點擊

我們要延續昨天的專案，在點擊列表項目時，App 會跳出一個小提示 (Toast)，告訴我們點擊了哪一個名字。

1. 修改 MyAdapter.java 檔案

   • 我們需要在 MyAdapter 中，定義一個 interface（介面），這就像是訂立一個「契約」，告訴 MainActivity 說：「如果你想知道誰被點擊了，就請簽下這份契約。」

   以下是修改後的 MyAdapter.java 完整程式碼。我會用註解標出改動的部分。

   `import android.view.LayoutInflater;
   import android.view.View;
   import android.view.ViewGroup;
   import android.widget.TextView;
   import android.widget.Toast;
   import androidx.annotation.NonNull;
   import androidx.recyclerview.widget.RecyclerView;

   import java.util.List;

   public class MyAdapter extends RecyclerView.Adapter<MyAdapter.MyViewHolder> {

    // 【新增程式碼】定義一個介面，用來處理點擊事件
    public interface OnItemClickListener {
        void onItemClick(String clickedText);
    }
   
    // 【新增程式碼】宣告一個監聽器變數
    private final OnItemClickListener listener;
   
    // 【修改建構子】新增一個參數，用來接收監聽器
    public MyAdapter(List<String> dataList, OnItemClickListener listener) {
        this.dataList = dataList;
        this.listener = listener;
    }
   
    private final List<String> dataList;
   
    @NonNull
    @Override
    public MyViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.list_item, parent, false);
        return new MyViewHolder(view);
    }
   
    @Override
    public void onBindViewHolder(@NonNull MyViewHolder holder, int position) {
        String text = dataList.get(position);
        holder.itemTextView.setText(text);
   
        // 【修改程式碼】在 onBindViewHolder 裡設定點擊事件
        holder.itemView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // 點擊後，呼叫監聽器的 onItemClick 方法
                if (listener != null) {
                    listener.onItemClick(dataList.get(position));
                }
            }
        });
    }
   
    @Override
    public int getItemCount() {
        return dataList.size();
    }
   
    static class MyViewHolder extends RecyclerView.ViewHolder {
        TextView itemTextView;
   
        public MyViewHolder(@NonNull View itemView) {
            super(itemView);
            itemTextView = itemView.findViewById(R.id.itemTextView);
        }
    }
   

   }`

2. 修改 MainActivity.java 檔案

   • 我們需要告訴 MainActivity，請實現我們在 MyAdapter 中定義的 interface，並將自己傳給 Adapter。

   `import androidx.appcompat.app.AppCompatActivity;
   import android.os.Bundle;
   import android.widget.Toast;
   import androidx.recyclerview.widget.LinearLayoutManager;
   import androidx.recyclerview.widget.RecyclerView;
   import java.util.ArrayList;
   import java.util.List;

   // 【修改程式碼】讓 MainActivity 實現 MyAdapter.OnItemClickListener 介面
   public class MainActivity extends AppCompatActivity implements MyAdapter.OnItemClickListener {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
   
        RecyclerView myRecyclerView = findViewById(R.id.myRecyclerView);
   
        List<String> myData = new ArrayList<>();
        myData.add("小明");
        myData.add("小華");
        myData.add("小李");
        // ... 更多資料 ...
   
        // 【修改程式碼】建立 Adapter 實例時，將 this 傳入
        MyAdapter myAdapter = new MyAdapter(myData, this);
   
        myRecyclerView.setLayoutManager(new LinearLayoutManager(this));
        myRecyclerView.setAdapter(myAdapter);
    }
   
    // 【新增程式碼】實現介面的方法
    @Override
    public void onItemClick(String clickedText) {
        // 在這裡處理點擊事件，並彈出一個小提示
        Toast.makeText(this, "你點擊了：" + clickedText, Toast.LENGTH_SHORT).show();
    }
   

   }`

3. 執行你的 App！

   • 點擊綠色的「▶」按鈕，執行你的 App。
   • 你會看到畫面上依然有列表，但這次，當你點擊列表中的任何一個名字時，App 就會跳出一個小提示，告訴你點擊了誰！

   

你的 RecyclerView 已經可以與使用者互動了！

今日總結

今天我們學會了如何使用 interface 來處理 RecyclerView 的點擊事件。這是一個非常重要的概念，它能讓你的程式碼更有彈性、更易於維護。

明天，我們要進入 App 的美學領域！我們會學習 Material Design，並教你如何利用 styles.xml 和 colors.xml，快速改變 App 的整體外觀，讓你的 App 變得更專業！

明天見！