facebook twitter hatena line email

「Flutter/UI/ListView/都度読み込み」の版間の差分

提供: 初心者エンジニアの簡易メモ
移動: 案内検索
(Admin がページ「Flutter/UI/ListView/無限」を「Flutter/UI/ListView/都度読み込み」に、リダイレクトを残さずに移動しました)
 
(相違点なし)

2019年12月4日 (水) 11:21時点における最新版

articlesが全体の記事リスト。listdatasが都度読み込む記事リスト。


List<Article> articles = new List<Article>();
List<Listdata> listdatas = new List<Listdata>();
void _loadArticleToListdata(int page) async {
   int i = 0;
   for (Article article in articles) {
     int tmpPage = (i / 10).floor();
     print("tmpPage=" + tmpPage.toString());
     if (page - 1 == tmpPage) {
       setState(() {
         listdatas.add(data);
       });
       print("listdatas.add listdatas.length=" + listdatas.length.toString());
     }
     i++;
   }
 }
 Widget _articleWidget() {
   return ListView.builder(
     padding: const EdgeInsets.only(bottom: 10.0),
     itemCount: listdatas.length,
     itemBuilder: (context, int index) {
       var length = listdatas.length;
       print("ListView index=" + index.toString() + " length=" + length.toString());
       if (index == length - 1) {
         if (length < articles.length) {
           page++;
           print("ListView page=" + page.toString());
           _loadArticleToListdata(page);
           // ローディング
           return new Center(
             child: new Container(
               margin: const EdgeInsets.only(top: 8.0),
               width: 32.0,
               height: 32.0,
               child: const CircularProgressIndicator(),
             ),
           );
         }
       } else if (index > length) {
         return null;
       }
       return InkWell(・・・略
       );
     },
   );
 }

参考:https://qiita.com/najeira/items/454462c794c35b3b600a