Android RecyclerView 簡單教學範例

RecycleView是一種進化版的 ListView 詳細的特點因為介紹很多我就先跳過了，我們來實作吧

要準備的材料有：

RecyclerView 範例檔 github 下載

Java檔案

• MainActivity.java
• MyAdapter.java
• ItemData.java

View檔案

• activity_main.xml
• item_layout.xml

Gradle

• compile 'com.android.support:recyclerview-v7:23.1.1'

---

遊戲開始： 

Layout

activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="match_parent"
    tools:context="com.hmkcode.android.recyclerview.MainActivity" >
 
    <android.support.v7.widget.RecyclerView
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity"
    />
</RelativeLayout>

item_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="80dp"
    android:background="@drawable/border"
    >
   <TextView
         android:id="@+id/item_title"
         android:layout_width="fill_parent"
         android:layout_height="wrap_content"
          />
</RelativeLayout>

---

JAVA

MainActivity.java

@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        //  宣告 recyclerView
        RecyclerView recyclerView = (RecyclerView) findViewById(R.id.my_recycler_view);
        recyclerView.setLayoutManager(new LinearLayoutManager(this));
        
        // 設定要給 Adapter 的陣列為 itemsData
        ItemData itemsData[] = {
                new ItemData("hello1"),
                new ItemData("hello2"),
                new ItemData("hello3"),
        };
        
        MyAdapter mAdapter = new MyAdapter(itemsData);

        // 將 mAdapter 交給 recyclerView 顯示
recyclerView.setAdapter(mAdapter);
        recyclerView.setItemAnimator(new DefaultItemAnimator());

    }

這邊我們可以發現我們需要用到兩個 class ，分別是 ItemData 和 MyAdapter

ItemData.java

public class ItemData {
    private final String title;

    public ItemData(String title) {
        this.title = title;
    }
    public String getTitle(){
        return title;
    }
}

在上一個動作中，我們將陣列傳進去給 ItemData 。就是在 public ItemData(String title) 這邊去做接取的動作。如果每一個 ItemData 有兩個欄位的話就會是要做成 public ItemData(String key的名稱,String 第二個key的名稱)

MyAdapter.java

public class MyAdapter extends RecyclerView.Adapter {
    private ItemData[] itemsData;
    public MyAdapter(ItemData[] ItemData){ //這邊是接 MainActivity 傳進來的值
        this.itemsData = ItemData;
    }



    @Override
    public MyAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View itemLayoutView = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_layout, null);
        ViewHolder viewHolder = new ViewHolder(itemLayoutView);
        return viewHolder;
    }

    @Override
    public void onBindViewHolder(MyAdapter.ViewHolder holder, int position) {

            // 設定 textView 的文字由 itemsData 取出，而 itemsData 的內容已經在 ItemData.java 設定好了
            holder.textView.setText(itemsData[position].getTitle());

    }

    @Override
    public int getItemCount() {

        // 顯示的數量
        return itemsData.length;
    }

    public class ViewHolder extends RecyclerView.ViewHolder {
        public TextView textView;
        public ViewHolder(View itemView) {
            super(itemView);

        // 設定 textView 為 item_title 這個 layout 物件
textView = (TextView) itemView.findViewById(R.id.item_title);
        }

    }
}

大功告成！

下一篇我們將會讓這個 RecyclerView 的清單可以執行點擊動作

RecyclerView 加上 OnClickListener 事件監聽