📌

RefreshIndicatorの配下のリストの要素が少ない場合でもPull To Refreshをできるようにする

2021/08/12に公開

フィード系のアプリではよくあるフィードを引っ張って更新するやつ(=Pull To Refresh)をFlutterで実装する時はRefreshIndicatorを使えば良い。

フィードに十分なアイテムがある場合は問題ないが、アイテムが無い場合やアイテムが1〜2個しかない場合は配下のListViewのlength小さくて結果的にPull To Refreshが出来ないことがある。

この場合はどうすればいいかというと、AlwaysScrollableScrollPhysics()をphysicsフィールドに指定してやれば終わり。

RefreshIndicator(
  child: ListView.builder(
      // これだけ↓
      physics: const AlwaysScrollableScrollPhysics(),
    itemCount: data.length,
    itemBuilder: (context, i) {
    }
  )
)

急遽この実装が必要になって調べたけど検索条件が悪かったのか日本語ではさくっと情報が出てこなかった。

しかし公式ドキュメントを読むとちゃんと書いてあったようだ。困ったらとりあえず公式ドキュメントを読め...

even if the scrollable's content fits within its viewport, set the scrollable's Scrollable.physics property to AlwaysScrollableScrollPhysics:

https://api.flutter.dev/flutter/material/RefreshIndicator-class.html

Discussion