Android教程2020 - RecyclerView使用入門
本文介紹RecyclerView的使用入門。這裡給出一種比較常見的使用方式。
Android教程2020 - 系列總覽
本文連結
想必讀者朋友對列表的表現形式已經不再陌生。手機上有聯絡人列表,檔案列表,簡訊列表等等。
本文講述的是在Android開發中用RecyclerView來實現列表效果。
使用步驟
引入RecyclerView
在app的build.gradle檔案中新增引用。我們使用的是androidx包。
dependencies {
// ...
implementation 'androidx.recyclerview:recyclerview:1.1.0'
}
資料準備
先確定一下要顯示什麼樣的資料。是使用者資訊,聯絡人,或是檔案。這裡以字元為例。
寫程式碼前,我們先考慮一下需求,就是要如何顯示,怎麼顯示資料。日常工作中,一般會有UI效果圖。本文中的美術設計就由我們自己發揮了。
比如顯示 a
97
。
ViewHolder與layout
現在要顯示的資料已經確定了。來設計UI表現。layout與ViewHolder緊密相關。在設計Adapter類前,先寫ViewHolder類會比較好。
新建定義item(列表子項)的佈局檔案item_letter.xml
。
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="horizontal"> <TextView android:id="@+id/tv1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textColor="#000000" /> <TextView android:id="@+id/tv2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textColor="#000000" /> </LinearLayout>
這裡使用內部類,把ViewHolder類寫在activity類裡面。
private class VH extends RecyclerView.ViewHolder { TextView tv1; TextView tv2; public VH(@NonNull View itemView) { super(itemView); tv1 = itemView.findViewById(R.id.tv1); tv2 = itemView.findViewById(R.id.tv2); } }
從上面可以看出,ViewHolder和item的layout是緊密相關的。
layout裡面的id寫的比較簡單。實際專案中可以給一些更有意義的id命名。
在activity的layout中,新增RecyclerView。
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/re_view"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
設計Adapter
設計一個介面卡繼承自RecyclerView.Adapter<VH>
。這裡的VH
是我們上面寫好的ViewHolder。
LetterAdapter
中持有它自己的資料列表。需要實現3個方法。
onCreateViewHolder方法,要求返回VH物件。這裡就是建立VH物件並返回。
而VH構造器要求傳入一個View,我們利用LayoutInflater
建立一個view給它。當然,建立的根據就是前面設計好的item_letter
。
onBindViewHolder是把資料交給對應的VH來顯示。
getItemCount方法要求返回資料的數量。
private class LetterAdapter extends RecyclerView.Adapter<VH> {
private List<Character> dataList;
public LetterAdapter(List<Character> dataList) {
this.dataList = dataList;
}
@NonNull
@Override
public VH onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
return new VH(LayoutInflater.from(parent.getContext()).inflate(R.layout.item_letter, parent, false));
}
@Override
public void onBindViewHolder(@NonNull VH holder, int position) {
Character c = dataList.get(position);
holder.tv1.setText(c.toString());
holder.tv2.setText(String.valueOf(Integer.valueOf(c)));
}
@Override
public int getItemCount() {
return dataList.size();
}
}
粗心大意的時候,可能會忘記初始化adapter裡的dataList。報一個null pointer異常。
設定RecyclerView
在Activity的onCreate方法裡進行了初始化。
RecyclerView需要2項設定,介面卡與LayoutManager。介面卡就是我們上面定的那個。
LayoutManager這裡用LinearLayoutManager
,指定為垂直方向,這樣我們會得到一個上下滑動的列表。
List<Character> characterList = new ArrayList<>();
for (char c = 'a'; c <= 'z'; c++) {
characterList.add(c);
}
mLetterAdapter = new LetterAdapter(characterList);
RecyclerView letterReView = findViewById(R.id.re_view);
letterReView.setAdapter(mLetterAdapter);
letterReView.setLayoutManager(new LinearLayoutManager(this, RecyclerView.VERTICAL, false));
觀察執行結果
執行到手機或者模擬器上,開啟這個activity。有的朋友就發現,為啥螢幕裡一個子項item就佔滿了整個螢幕?
因為我們前面設定的item佔滿螢幕。回到item_letter.xml
,看一下根layout的設定。
把layout_height="match_parent"
裡的設定改為wrap_content
。
重新編譯執行一下再看看結果。
也可以給根layout設定固定的高度。具體視美術設計和需求而定。
小結
到這裡我們掌握了RecyclerView的基本使用方式。
接下來還要了解如何自定義它的表現形式。例如點選或長按item的反應;item之間新增分割線;增/刪/改資料;使用瀑布流樣式等等。
RecyclerView使用了介面卡模式。
可以參考官方的RecyclerView文件。
工程放這裡: https://github.com/AnRFDev/Tutorial2020
相關閱讀
RecyclerView - 使用入門
RecyclerView點選事件 - 如何設定點選事件
RecyclerView示例 - 實際使用
RecyclerView獲取滑動距離
RecyclerView顯示多種i