使用PaginatedDataTable時解決最后一頁不夠當前行的話會有很空白行的問題
解決的場景:
比如下圖,28行資料,每頁5行最后一頁會多出兩行空白,

解決方法:
可以使用PaginatedDataTable中的onPageChanged 來進行操作
onPageChanged (發生翻頁時回呼)
onPageChanged: (value) { int rowCount = controller.dataSource.value.rowCount; // Q:下面這些代碼都是為了解決最后一頁不夠當前行的話會有很空白行的問題 // 先判斷當前展示行是否大于剩余行數 if(rowCount - value < controller.rowsPerPage.value){ var perPage = rowCount - value; // 如果當前展示行數大于剩余行數,就修改當前展示行為剩余的行數 // 但是有個操蛋的問題,修改的行數必須在availableRowsPerPage這個里面有數字,所以要新增 if(!controller.availableRows.contains(perPage)){ // 新增剩余行 controller.availableRows.add(perPage); controller.rowsPerPage.value =https://www.cnblogs.com/glwuzhang/archive/2023/03/02/ perPage; } }else{ var defaultPage = controller.rowsPerPageLast.value; // 如果rowsPerPage和rowsPerPageLast不相等就表示rowsPerPage在上面被修改過 if(controller.rowsPerPage.value != defaultPage){ // 這兒的操作和上面描述相反,出了最后一頁就把新增的最后一頁行數頁刪了 controller.availableRows.removeLast(); // 因為上面最后一頁切換了展示行數,所以要跳出最后一頁時要恢復之前的行數 controller.rowsPerPage.value =https://www.cnblogs.com/glwuzhang/archive/2023/03/02/ defaultPage; } } },
具體的邏輯在上面寫了注釋,我再說下部分引數的意義
controller.dataSource => DataTableSource的封裝類,我在controller中把它設定成了可監測的類
controller.rowsPerPage => 當前頁顯示的行數
controller.rowsPerPageLast => 切換顯示行數后保留的上一個行數
controller.availableRows => 能切換展示行的串列 總結: 代碼段中是flutter+getx的寫法,如果你不使用getx,請靈活改變引數呼叫的方式,在StatefulWidget同樣可以完成, 在onRowsPerPageChanged還可以優化一下代碼,不然在最后一頁改變展示行的話availableRows中新增進去的選項不會被去除轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/545653.html
標籤:其他
上一篇:flutter專案沖突解決
