文章目錄

• 一、RecyclerView.ItemDecoration 方法說明
• 三、getItemOffsets 設(shè)置要點
• 四、完整代碼示例
• 五、RecyclerView 相關(guān)資料

一、RecyclerView.ItemDecoration 方法說明

---

RecyclerView.ItemDecoration 是抽象類 , 當(dāng)前使用的 onDraw , onDrawOver , getItemOffsets $3$ 個方法 , 上一篇博客 【RecyclerView】 五、RecyclerView.ItemDecoration 條目裝飾 ( 簡介 | onDraw | onDrawOver | getItemOffsets ) 二、RecyclerView.ItemDecoration 源碼注釋解析 中已經(jīng)分析了 RecyclerView.ItemDecoration 方法 , 并查看了其源碼 , 這 $3$ 個方法都是空方法 , 因此這里實現(xiàn)方法時 , 不必再使用 super 調(diào)用父類方法 ;

public class ItemDecoration extends RecyclerView.ItemDecoration {@Overridepublic void onDraw(@NonNull Canvas c, @NonNull RecyclerView parent,@NonNull RecyclerView.State state) {}@Overridepublic void onDrawOver(@NonNull Canvas c, @NonNull RecyclerView parent,@NonNull RecyclerView.State state) {}@Overridepublic void getItemOffsets(@NonNull Rect outRect, @NonNull View view,@NonNull RecyclerView parent,@NonNull RecyclerView.State state) {} }

三、getItemOffsets 設(shè)置要點

---

使用 RecyclerView.ItemDecoration 給 RecyclerView 的 item 設(shè)置 " 上 , 下 , 左 , 右 " $4$ 個邊距 , 通過調(diào)用 RecyclerView 的 getChildAdapterPosition 方法 , 可以給指定位置的 item 設(shè)置不同的邊距 ;

這里為 RecyclerView 網(wǎng)格布局設(shè)置邊距 , 普通的 item 組件上下左右邊距都是 $5$ 像素 , 整個網(wǎng)格布局的左側(cè) , 右側(cè) 邊距是 $20$ 像素 , 網(wǎng)格布局每排 $4$ 個元素 ;

為不同位置的 item 設(shè)置不同的邊距 , 這里就需要對當(dāng)前設(shè)置邊距的位置進行查詢與甄別 ;

調(diào)用 RecyclerView 對象的 getChildAdapterPosition 方法 , 傳入 item 組件 View 參數(shù) , 就可以獲取當(dāng)前的位置 ;

@Overridepublic void getItemOffsets(@NonNull Rect outRect, @NonNull View view,@NonNull RecyclerView parent,@NonNull RecyclerView.State state) {// 1. 獲取當(dāng)前設(shè)置邊距的位置int currentPosition = parent.getChildAdapterPosition(view); }

獲取到當(dāng)前設(shè)置位置之后 , 根據(jù)不同的位置設(shè)置不同的偏移量 ;

表格布局中每行有 $4$ 個元素 ,

所有的元素上下左右邊距都設(shè)置 $5$ 像素偏移量 , 每行中最左側(cè)的元素距離左邊界 $20$ 像素 , 每行中最右側(cè)元素距離右邊界 $20$ 像素 ;

使用 currentPosition % 4 == 0 可以篩選出每行最左側(cè)的元素 , 使用 currentPosition %4 == 3 可以篩選出每行最右側(cè)的元素 ;

public class ItemDecoration extends RecyclerView.ItemDecoration {@Overridepublic void getItemOffsets(@NonNull Rect outRect, @NonNull View view,@NonNull RecyclerView parent,@NonNull RecyclerView.State state) {// 1. 獲取當(dāng)前設(shè)置邊距的位置int currentPosition = parent.getChildAdapterPosition(view);// 2. 針對不同的位置設(shè)置不同的邊距// 每排最左側(cè)和最右側(cè)的左右邊距設(shè)置成 20 像素, 其余 4 個邊距一律設(shè)置成 5if (currentPosition % 4 == 0){// 每排最左側(cè)的邊距outRect.left = 20;outRect.top = 5;outRect.right = 5;outRect.bottom = 5;}else if (currentPosition %4 == 3){// 每排最右側(cè)的邊距outRect.left = 5;outRect.top = 5;outRect.right = 20;outRect.bottom = 5;}else{// 普通元素的邊距都是 5outRect.left = 5;outRect.top = 5;outRect.right = 5;outRect.bottom = 5;}} }

運行效果 : 下面的 RecyclerView 中每行最左側(cè)元素距離左邊距 $20$ 像素 , 每行最右側(cè)元素距離右邊距 $20$ 像素 , 其余邊距都是 $5$ 像素 ;

四、完整代碼示例

---

自定義 RecyclerView.ItemDecoration 代碼示例 :

package kim.hsl.recyclerview;import android.graphics.Canvas; import android.graphics.Rect; import android.view.View;import androidx.annotation.NonNull; import androidx.recyclerview.widget.RecyclerView;public class ItemDecoration extends RecyclerView.ItemDecoration {@Overridepublic void onDraw(@NonNull Canvas c, @NonNull RecyclerView parent,@NonNull RecyclerView.State state) {}@Overridepublic void onDrawOver(@NonNull Canvas c, @NonNull RecyclerView parent,@NonNull RecyclerView.State state) {}@Overridepublic void getItemOffsets(@NonNull Rect outRect, @NonNull View view,@NonNull RecyclerView parent,@NonNull RecyclerView.State state) {// 1. 獲取當(dāng)前設(shè)置邊距的位置int currentPosition = parent.getChildAdapterPosition(view);// 2. 針對不同的位置設(shè)置不同的邊距// 每排最左側(cè)和最右側(cè)的左右邊距設(shè)置成 20 像素, 其余 4 個邊距一律設(shè)置成 5if (currentPosition % 4 == 0){// 每排最左側(cè)的邊距outRect.left = 20;outRect.top = 5;outRect.right = 5;outRect.bottom = 5;}else if (currentPosition %4 == 3){// 每排最右側(cè)的邊距outRect.left = 5;outRect.top = 5;outRect.right = 20;outRect.bottom = 5;}else{// 普通元素的邊距都是 5outRect.left = 5;outRect.top = 5;outRect.right = 5;outRect.bottom = 5;}} }

Java 主界面代碼 :

package kim.hsl.recyclerview;import android.graphics.Color; import android.os.Bundle; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.TextView;import androidx.annotation.NonNull; import androidx.appcompat.app.AppCompatActivity; import androidx.recyclerview.widget.GridLayoutManager; import androidx.recyclerview.widget.RecyclerView; import androidx.recyclerview.widget.StaggeredGridLayoutManager;public class MainActivity extends AppCompatActivity {@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);//1 . 從布局中獲取 RecyclerViewRecyclerView recycler_view = findViewById(R.id.recycler_view);//2 . 創(chuàng)建并設(shè)置布局管理器//創(chuàng)建布局管理器StaggeredGridLayoutManager layoutManager = new StaggeredGridLayoutManager(4,RecyclerView.VERTICAL);//設(shè)置布局管理器recycler_view.setLayoutManager(layoutManager);// 設(shè)置邊距recycler_view.addItemDecoration(new ItemDecoration());//3 . 創(chuàng)建并設(shè)置列表適配器Adapter adapter = new Adapter();recycler_view.setAdapter(adapter);}/*** RecyclerView 適配器*/public class Adapter extends RecyclerView.Adapter<Adapter.ViewHolder> {@Overridepublic ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {View root_view = LayoutInflater.from(MainActivity.this).inflate(R.layout.item_recyclerview, parent, false);return new ViewHolder(root_view);}@Overridepublic void onBindViewHolder(@NonNull ViewHolder holder, int position) {holder.text.setText("" + position);}@Overridepublic int getItemCount() {return 10;}public class ViewHolder extends RecyclerView.ViewHolder {TextView text;public ViewHolder(@NonNull View itemView) {super(itemView);text = itemView.findViewById(R.id.text);}}}}

運行效果 :

五、RecyclerView 相關(guān)資料

---

官方文檔 :

使用 RecyclerView 創(chuàng)建動態(tài)列表 : https://developer.android.google.cn/guide/topics/ui/layout/recyclerview

高級 RecyclerView 自定義 : https://developer.android.google.cn/guide/topics/ui/layout/recyclerview-custom

代碼示例 :

GitHub 源碼地址 : https://github.com/han1202012/001_RecyclerView

博客源碼快照 : https://download.csdn.net/download/han1202012/14951713

( 使用 Android Studio 打開 )

總結(jié)

以上是生活随笔為你收集整理的【RecyclerView】 七、RecyclerView.ItemDecoration 条目装饰 ( getItemOffsets 边距设置 )的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。