主頁 > 移動端開發 > Jetpack系列:Paging組件幫你解決分頁加載實作的痛苦

Jetpack系列:Paging組件幫你解決分頁加載實作的痛苦

2020-09-16 13:39:10 移動端開發

相信很多小伙伴們在專案實戰中,經常會用到界面的分頁顯示加載更多等功能,需要針對具體功能做針對性開發和除錯,耗時耗力,

Paging組件的使用將這部分的作業簡化,從而讓開發者更專注于業務的具體實作,下面我們一起來學習下Paging組件的使用方法,


首先來看下使用Paging組件實作的分頁加載和重繪效果:
![](https://img2018.cnblogs.com/blog/1820853/201910/1820853-20191010103258092-718449477.gif)

資料庫讀取分頁加載


![](https://img2018.cnblogs.com/blog/1820853/201910/1820853-20191010103309867-715023857.gif)

網路端分頁請求資料

下面我們針對這兩個使用Paging組件的例子進行分析,

  • 資料庫讀取分頁加載示例中,資料一次性獲取完成,界面分頁顯示,按需加載資料,減少了記憶體資源的使用
  • 網路端分頁請求資料,每次請求固定長度的資料資訊進行顯示,減少網路帶寬的使用

Paging功能的實作用到了Room組件,Room也是Jetpack庫的一部分,在SQLite上提供了一個抽象層,為開發者提供了流暢的SQLite資料庫訪問體驗,

Room簡介

Room組件包含三個主要組成部分:

  • 資料庫

其應該滿足四個條件:

  1. 含有@Database注解
  2. 是一個繼承自RoomDatabase的抽象類
  3. 注解內包含物體的串列資訊
  4. 包含一個回傳帶@Dao注解類的無參方法
  • 資料物體

表示資料庫中表

  • DAO

包含用于訪問資料庫的方法

應用程式使用Room組件獲取與資料庫關聯的資料訪問物件或DAO,然后獲取物體,將物體的所有更改同步到資料庫,Room三個部分之間的關系如下圖:

![Room架構圖](https://img2018.cnblogs.com/blog/1820853/201910/1820853-20191010104502674-737554548.png)

Room架構圖(引自官方檔案)

Paging的基本使用方法

Paging組件支持三種不同資料結構:

  • 僅從網路獲取
  • 僅從設備資料庫獲取
  • 兩種資料來源的組合,使用設備資料庫作為快取
![Paging支持資料架構](https://img2018.cnblogs.com/blog/1820853/201910/1820853-20191010104520872-165043899.png)

分頁庫支持資料架構(引自官方檔案)

下面我們以僅從設備資料庫獲取的方式來了解下Paging分頁的基本使用方法,

環境配置

首先需要在模塊build.gradle中添加對應庫支持,

dependencies {
    versions.room = "2.1.0-alpha06"
    versions.lifecycle = "2.2.0-alpha03"
    versions.paging = "2.1.0-rc01"
    //room資料庫訪問依賴
    implementation "androidx.room:room-runtime:$versions.room"
    //lifecycle組件依賴,ViewModel
    implementation "androidx.lifecycle:lifecycle-runtime:$versions.lifecycle"
    //paging組件依賴
    implementation "androidx.paging:paging-runtime-ktx:$versions.paging"
    
    kapt "androidx.room:room-compiler:$versions.room"
}

布局檔案

界面的布局比較簡單,主界面包含一個輸入框,一個按鈕和一個RecyclerView,串列每一項的顯示采用卡片式布局,顯示文本,

<androidx.cardview.widget.CardView ...>
    <TextView android:id="@+id/name" .../>
</androidx.cardview.widget.CardView>

資料準備

在主Activity進行資料獲取和顯示前,需要做幾點準備作業:

  1. 創建資料物體類Cheese
  2. 創建資料庫方法DAO
  3. 創建資料庫CheeseDb
  4. 創建自定義CheeseViewModel

1. 創建物體Cheese

物體代表了資料庫每條資料物件,需要注意必須加@Entity注解

@Entity
data class Cheese(@PrimaryKey(autoGenerate = true) val id: Int, val name: String)

此宣告創建了一個資料庫物體,欄位有ID和Name,主鍵為ID

2. 創建資料庫操作方法DAO

資料庫方法提供了對資料庫的基本操作,必須加@Dao注解

@Dao
interface CheeseDao {
    @Query("SELECT * FROM Cheese ORDER BY name COLLATE NOCASE ASC")
    fun allCheesesByName(): DataSource.Factory<Int, Cheese>
    @Insert
    fun insert(cheeses: List<Cheese>)
    @Insert
    fun insert(cheese: Cheese)
    @Delete
    fun delete(cheese: Cheese)
}

此處提供了針對資料庫的查詢,插入和洗掉方法,可以看到在查詢方法里面會指定資料源型別,當前使用默認型別,Paging還支持如下三種資料源:

  • PageKeyedDataSource

實作按上下頁加載顯示

  • ItemKeyedDataSource

根據上一條資料獲取下一條資料

  • PositionalDataSource

從指定位置開始加載

關于這三種資料源的高級使用方法,請參考官方檔案說明和示例:

3. 創建資料庫

資料庫為界面顯示提供了資料支持,當前示例程式中,資料庫創建時,插入了預置資料,

  • 必須加@Database注解

  • 必須宣告資料串列資訊

  • 必須含有無參抽象方法,回傳帶@Dao注解的類

  • 必須為抽象類,且繼承RoomDatabase

@Database(entities = arrayOf(Cheese::class), version = 1)
abstract class CheeseDb : RoomDatabase() {
    abstract fun cheeseDao(): CheeseDao//回傳DAO
    ...
    //獲取資料庫實體,同步且單例
    @Synchronized
    fun get(context: Context): CheeseDb {
        if (instance == null) {
            instance = Room.databaseBuilder(context.applicationContext,
                    CheeseDb::class.java, "CheeseDatabase")
                    .addCallback(object : RoomDatabase.Callback() {
                        override fun onCreate(db: SupportSQLiteDatabase) {
                            //資料庫創建時插入預置資料
                            fillInDb(context.applicationContext)
                        }
                    }).build()
        }
        return instance!!
    }
    
    private fun fillInDb(context: Context) {
        // inserts in Room are executed on the current thread, so we insert in the background
        // CHEESE_DATA為默認資料串列
        ioThread {
            get(context).cheeseDao().insert(
                    CHEESE_DATA.map { Cheese(id = 0, name = it) })
        }
    }
}

4. 創建ViewModel

創建自定義ViewModel為界面和資料提供處理支持,其包含了DAO,資料串列資訊等,

class CheeseViewModel(app: Application) : AndroidViewModel(app) {
    val dao = CheeseDb.get(app).cheeseDao()
    val allCheeses = dao.allCheesesByName().toLiveData(Config(
        pageSize = 30,//指定頁面顯示的資料項數量
        enablePlaceholders = true,//是否允許使用占位符
        maxSize = 200 //一次性加載資料的最大數量
      ),
      fetchExecutor = Executor {  }//自定義Executor更好地控制paging庫何時從應用程式的資料庫中加載串列
    )
    
    fun insert(text: CharSequence) = ioThread {
        dao.insert(Cheese(id = 0, name = text.toString()))
    }

    fun remove(cheese: Cheese) = ioThread {
        dao.delete(cheese)
    }
}

小提示:自定義ViewModel直接繼承AndroidViewModel,可以在其中做一些依賴于Context的資源獲取等功能,

public class AndroidViewModel extends ViewModel {
    ...
    public <T extends Application> T getApplication() {
        return (T) mApplication;
    }
}

ViewModel的創建,包含了資料的獲取和更新:

  • 通過DAO獲取資料庫的資料串列
  • 使用LiveData組件管理資料
  • 增加分頁支持(pageSize,enablePlaceholders,maxSize)功能
  • 增加自定義Executor

Paging組件是依賴頁面長度、占位符、最大長度三個屬性來進行小塊資料加載顯示的,

頁面大小:每頁顯示的物體數量

最大長度:也稱預取長度,此值應為pageSize的幾倍大小(具體專案可根據實際情況除錯)

占位符:如果設定為true,則為尚未完成加載的串列項顯示占位符

占位符的使用需要有可數的資料集合,默認顯示效果,資料項有相同大小的視圖顯示,有以下優點:

  • 提供完整滾動條支持
  • 無需顯示加載更多項

界面系結

資料已經準備好了,下面開始和界面進行系結顯示,

界面顯示時,需要提供與RecyclerView系結的adapter,需要注意使用Paging進行分頁加載,adapter需要繼承自PagedListAdapter,


class CheeseAdapter : PagedListAdapter<Cheese, CheeseViewHolder>(diffCallback) {
    override fun onBindViewHolder(holder: CheeseViewHolder, position: Int) {
        holder.bindTo(getItem(position))
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): CheeseViewHolder =
            CheeseViewHolder(parent)
    companion object {
        //根據diffCallback來確認新加載的資料是否與舊資料有差異,確定是否更新顯示
        private val diffCallback = object : DiffUtil.ItemCallback<Cheese>() {
            override fun areItemsTheSame(oldItem: Cheese, newItem: Cheese): Boolean =
                    oldItem.id == newItem.id
            //kotlin使用==會將物件的內容進行對比,使用java需要重寫equals方法并替換
            override fun areContentsTheSame(oldItem: Cheese, newItem: Cheese): Boolean =
                    oldItem == newItem
        }
    }
}

//ViewHolder的實作比較簡單,將Cheese資料更新到TextView
class CheeseViewHolder(parent :ViewGroup) : RecyclerView.ViewHolder(
        LayoutInflater.from(parent.context).inflate(R.layout.cheese_item, parent, false)) {

    private val nameView = itemView.findViewById<TextView>(R.id.name)
    var cheese : Cheese? = null

    //未系結資料,或者打開占位符后快速滑動會出現cheese為null,實際專案中需要
    //處理此種情況,資料加載時會重新rebind
    fun bindTo(cheese : Cheese?) {
        this.cheese = cheese
        nameView.text = cheese?.name
    }
}

class MainActivity : AppCompatActivity() {
private val viewModel by viewModels<CheeseViewModel>()//創建viewModel
override fun onCreate(savedInstanceState: Bundle?) {
    ...
    val adapter = CheeseAdapter()//繼承PagedListAdapter的類物件
    cheeseList.adapter = adapter //為RecyclerView添加配接器
    //viewmodel資料與adapter系結,在資料變化時通知adapter更新UI
    viewModel.allCheeses.observe(this, Observer(adapter::submitList))
    initSwipeToDelete()//設定左滑/右滑洗掉資料項
    initAddButtonListener()//設定點擊添加Cheese功能
    ...
}

好了,大功告成!

最終效果



你也可以嘗試使用僅網路或網路+資料庫的方式進行功能開發,

原始碼在此:


資料庫分頁

網路請求分頁


歡迎關注公眾號,留言討論更多技術問題
![file](https://img2018.cnblogs.com/blog/1820853/201910/1820853-20191010103323866-283198181.jpg)

轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/57460.html

標籤:Android

上一篇:Android JSON決議插件

下一篇:星之小說下載器Android版

標籤雲
其他(157675) Python(38076) JavaScript(25376) Java(17977) C(15215) 區塊鏈(8255) C#(7972) AI(7469) 爪哇(7425) MySQL(7132) html(6777) 基礎類(6313) sql(6102) 熊猫(6058) PHP(5869) 数组(5741) R(5409) Linux(5327) 反应(5209) 腳本語言(PerlPython)(5129) 非技術區(4971) Android(4554) 数据框(4311) css(4259) 节点.js(4032) C語言(3288) json(3245) 列表(3129) 扑(3119) C++語言(3117) 安卓(2998) 打字稿(2995) VBA(2789) Java相關(2746) 疑難問題(2699) 细绳(2522) 單片機工控(2479) iOS(2429) ASP.NET(2402) MongoDB(2323) 麻木的(2285) 正则表达式(2254) 字典(2211) 循环(2198) 迅速(2185) 擅长(2169) 镖(2155) 功能(1967) .NET技术(1958) Web開發(1951) python-3.x(1918) HtmlCss(1915) 弹簧靴(1913) C++(1909) xml(1889) PostgreSQL(1872) .NETCore(1853) 谷歌表格(1846) Unity3D(1843) for循环(1842)

熱門瀏覽
  • 【從零開始擼一個App】Dagger2

    Dagger2是一個IOC框架,一般用于Android平臺,第一次接觸的朋友,一定會被搞得暈頭轉向。它延續了Java平臺Spring框架代碼碎片化,注解滿天飛的傳統。嘗試將各處代碼片段串聯起來,理清思緒,真不是件容易的事。更不用說還有各版本細微的差別。 與Spring不同的是,Spring是通過反射 ......

    uj5u.com 2020-09-10 06:57:59 more
  • Flutter Weekly Issue 66

    新聞 Flutter 季度調研結果分享 教程 Flutter+FaaS一體化任務編排的思考與設計 詳解Dart中如何通過注解生成代碼 GitHub 用對了嗎?Flutter 團隊分享如何管理大型開源專案 插件 flutter-bubble-tab-indicator A Flutter librar ......

    uj5u.com 2020-09-10 06:58:52 more
  • Proguard 常用規則

    介紹 Proguard 入口,如何查看輸出,如何使用 keep 設定入口以及使用實體,如何配置壓縮,混淆,校驗等規則。

    ......

    uj5u.com 2020-09-10 06:59:00 more
  • Android 開發技術周報 Issue#292

    新聞 Android即將獲得類AirDrop功能:可向附近設備快速分享檔案 谷歌為安卓檔案管理應用引入可安全隱藏資料的Safe Folder功能 Android TV新主界面將顯示電影、電視節目和應用推薦內容 泄露的Android檔案暗示了傳說中的谷歌Pixel 5a與折疊屏新機 谷歌發布Andro ......

    uj5u.com 2020-09-10 07:00:37 more
  • AutoFitTextureView Error inflating class

    報錯: Binary XML file line #0: Binary XML file line #0: Error inflating class xxx.AutoFitTextureView 解決: <com.example.testy2.AutoFitTextureView android: ......

    uj5u.com 2020-09-10 07:00:41 more
  • 根據Uri,Cursor沒有獲取到對應的屬性

    Android: 背景:呼叫攝像頭,拍攝視頻,指定保存的地址,但是回傳的Cursor檔案,只有名稱和大小的屬性,沒有其他諸如時長,連ID屬性都沒有 使用 cursor.getInt(cursor.getColumnIndexOrThrow(MediaStore.Video.Media.DURATIO ......

    uj5u.com 2020-09-10 07:00:44 more
  • Android連載29-持久化技術

    一、持久化技術 我們平時所使用的APP產生的資料,在記憶體中都是瞬時的,會隨著斷電、關機等丟失資料,因此android系統采用了持久化技術,用于存盤這些“瞬時”資料 持久化技術包括:檔案存盤、SharedPreference存盤以及資料庫存盤,還有更復雜的SD卡記憶體儲。 二、檔案存盤 最基本存盤方式, ......

    uj5u.com 2020-09-10 07:00:47 more
  • Android Camera2Video整合到自己專案里

    背景: Android專案里呼叫攝像頭拍攝視頻,原本使用的 MediaStore.ACTION_VIDEO_CAPTURE, 后來因專案需要,改成了camera2 1.Camera2Video 官方demo有點問題,下載后,不能直接整合到專案 問題1.多次拍攝視頻崩潰 問題2.雙擊record按鈕, ......

    uj5u.com 2020-09-10 07:00:50 more
  • Android 開發技術周報 Issue#293

    新聞 谷歌為Android TV開發者提供多種新功能 Android 11將自動填表功能整合到鍵盤輸入建議中 谷歌宣布Android Auto即將支持更多的導航和數字停車應用 谷歌Pixel 5只有XL版本 搭載驍龍765G且將比Pixel 4更便宜 [圖]Wear OS將迎來重磅更新:應用啟動時間 ......

    uj5u.com 2020-09-10 07:01:38 more
  • 海豚星空掃碼投屏 Android 接收端 SDK 集成 六步驟

    掃碼投屏,開放網路,獨占設備,不需要額外下載軟體,微信掃碼,發現設備。支持標準DLNA協議,支持倍速播放。視頻,音頻,圖片投屏。好點意思。還支持自定義基于 DLNA 擴展的操作動作。好像要收費,沒體驗。 這里簡單記錄一下集成程序。 一 跟目錄的build.gradle添加私有mevan倉庫 mave ......

    uj5u.com 2020-09-10 07:01:43 more
最新发布
  • 歡迎頁輪播影片

    如圖,引導開始,球從上落下,同時淡入文字,然后文字開始輪播,最后一頁時停止,點擊進入首頁。 在來看看效果圖。 重力球先不講,主要歡迎輪播簡單實作 首先新建一個類 TextTranslationXGuideView,用于影片展示 文本是類似的,最后會有個圖片箭頭影片,布局很簡單,就是一個 TextVi ......

    uj5u.com 2023-04-20 08:40:31 more
  • 【FAQ】關于華為推送服務因營銷訊息頻次管控導致服務通訊類訊息

    一. 問題描述 使用華為推送服務下發IM訊息時,下發訊息請求成功且code碼為80000000,但是手機總是收不到訊息; 在華為推送自助分析(Beta)平臺查看發現,訊息發送觸發了頻控。 二. 問題原因及背景 2023年1月05日起,華為推送服務對咨詢營銷類訊息做了單個設備每日推送數量上限管理,具體 ......

    uj5u.com 2023-04-20 08:40:11 more
  • 歡迎頁輪播影片

    如圖,引導開始,球從上落下,同時淡入文字,然后文字開始輪播,最后一頁時停止,點擊進入首頁。 在來看看效果圖。 重力球先不講,主要歡迎輪播簡單實作 首先新建一個類 TextTranslationXGuideView,用于影片展示 文本是類似的,最后會有個圖片箭頭影片,布局很簡單,就是一個 TextVi ......

    uj5u.com 2023-04-20 08:39:36 more
  • 【FAQ】關于華為推送服務因營銷訊息頻次管控導致服務通訊類訊息

    一. 問題描述 使用華為推送服務下發IM訊息時,下發訊息請求成功且code碼為80000000,但是手機總是收不到訊息; 在華為推送自助分析(Beta)平臺查看發現,訊息發送觸發了頻控。 二. 問題原因及背景 2023年1月05日起,華為推送服務對咨詢營銷類訊息做了單個設備每日推送數量上限管理,具體 ......

    uj5u.com 2023-04-20 08:39:13 more
  • iOS從UI記憶體地址到讀取成員變數(oc/swift)

    開發除錯時,我們發現bug時常首先是從UI顯示發現例外,下一步才會去定位UI相關連的資料的。XCode有給我們提供一系列debug工具,但是很多人可能還沒有形成一套穩定的除錯流程,因此本文嘗試解決這個問題,順便提出一個暴論:UI顯示例外問題只需要兩個步驟就能完成定位作業的80%: 定位例外 UI 組 ......

    uj5u.com 2023-04-19 09:16:23 more
  • FIDE重磅更新!性能飛躍!體驗有禮!

    FIDE 開發者工具重構升級啦!實作500%性能提升,誠邀體驗! 一直以來不少開發者朋友在社區反饋,在使用 FIDE 工具的程序中,時常會遇到諸如加載不及時、代碼預覽/渲染性能不如意的情況,十分影響開發體驗。 作為技術團隊,我們深知一件趁手的開發工具對開發者的重要性,因此,在2023年開年,FinC ......

    uj5u.com 2023-04-19 09:16:15 more
  • 游戲內嵌社區服務開放,助力開發者提升玩家互動與留存

    華為 HMS Core 游戲內嵌社區服務提供快速訪問華為游戲中心論壇能力,支持玩家直接在游戲內瀏覽帖子和交流互動,助力開發者擴展內容生產和觸達的場景。 一、為什么要游戲內嵌社區? 二、游戲內嵌社區的典型使用場景 1、游戲內打開論壇 您可以在游戲內繪制論壇入口,為玩家提供沉浸式發帖、瀏覽、點贊、回帖、 ......

    uj5u.com 2023-04-19 09:15:46 more
  • iOS從UI記憶體地址到讀取成員變數(oc/swift)

    開發除錯時,我們發現bug時常首先是從UI顯示發現例外,下一步才會去定位UI相關連的資料的。XCode有給我們提供一系列debug工具,但是很多人可能還沒有形成一套穩定的除錯流程,因此本文嘗試解決這個問題,順便提出一個暴論:UI顯示例外問題只需要兩個步驟就能完成定位作業的80%: 定位例外 UI 組 ......

    uj5u.com 2023-04-19 09:14:53 more
  • FIDE重磅更新!性能飛躍!體驗有禮!

    FIDE 開發者工具重構升級啦!實作500%性能提升,誠邀體驗! 一直以來不少開發者朋友在社區反饋,在使用 FIDE 工具的程序中,時常會遇到諸如加載不及時、代碼預覽/渲染性能不如意的情況,十分影響開發體驗。 作為技術團隊,我們深知一件趁手的開發工具對開發者的重要性,因此,在2023年開年,FinC ......

    uj5u.com 2023-04-19 09:14:08 more
  • 游戲內嵌社區服務開放,助力開發者提升玩家互動與留存

    華為 HMS Core 游戲內嵌社區服務提供快速訪問華為游戲中心論壇能力,支持玩家直接在游戲內瀏覽帖子和交流互動,助力開發者擴展內容生產和觸達的場景。 一、為什么要游戲內嵌社區? 二、游戲內嵌社區的典型使用場景 1、游戲內打開論壇 您可以在游戲內繪制論壇入口,為玩家提供沉浸式發帖、瀏覽、點贊、回帖、 ......

    uj5u.com 2023-04-19 09:08:34 more