リストのリストビューのフラッターにそれらのもの

リストビュー内のフラッターは、垂直方向と水平方向のリストのリストをサポートしています。

水平方向のリスト

 scrollDirection: Axis.horizontal

垂直リスト

scrollDirection:  Axis.vertical

リストビューにもさまざまな方法を作成しました。

アイテムの固定数

これは、直接、直接良い子アイテムを追加割り当てられた子供たちを使用することができます。

new ListView(
  children: <Widget>[
    new Container(
      width: 160.0,
      color: Colors.red,
    ),
    new Container(
      width: 160.0,
      color: Colors.blue,
    ),
    new Container(
      width: 160.0,
      color: Colors.green,
    ),
    new Container(
      width: 160.0,
      color: Colors.yellow,
    ),
    new Container(
      width: 160.0,
      color: Colors.orange,
    ),
  ],
)

サブアイテムの数は可変です

ビルダー方法の構築。

 new ListView.builder(
      itemCount: items.length,
      itemBuilder: (context, index) {
        return Container(
          child: new Text('${items[index]}'),
        );
      },
    );

分割ラインに項目を追加するには、パリティ判断指数に応じて添加してもよいです。

index.isOdd //判断是否是奇数

それが奇数であるかどうかを確認します。

final index = i ~/ 2;//表示i除以2,但返回值是整形(向下取整),比如i为:1, 2, 3, 4, 5时,
        // 结果为0, 1, 1, 2, 2

偽データ分割は、上記の方法を使用することはできません。
特別追加リストビューの分離線生成方法もあります。

ListView.separated(
      itemBuilder: (BuildContext context, int index) {
        if (index == catergoryChildList.length) {
          return buildCircleProgressBar();
        } else {
          CatergoryChild catergoryChild = catergoryChildList[index];
          return ItemView(catergoryChild, index, (index) {
            Scaffold.of(context)
                .showSnackBar(SnackBar(content: Text("第$index项被点击了")));
          });
        }
      },
      separatorBuilder: (context, index) {
        return new Divider(
          height: 1,
        );
      },
      scrollDirection: Axis.vertical,
      itemCount: catergoryChildList.length + 1,
      controller: scrollController,
    );

この方法は、彼らが分周データと単独の分周器を生成する場所をしない、より便利です。

リストビュー]ドロップダウンリフレッシュ。

RefreshIndicator(
      child: listViewM,
      onRefresh: () async{
        getData();
      },
      color: Colors.blue,
    );

この実現のアンドロイドMateialスタイルプルダウンリフレッシュ。
以下の通りのgetData()メソッドは次のとおりです。

void getData(){
    if (!isFetching) {
      catergoryChildTask.getCatergoryTask(type);
      isFetching = true;
    }
  }

onRefreshフィールドが必要とされていることに注意してください非同期の方法で、そうでない場合は、エラーの非同期メソッドです。
また、書くことができます。

RefreshIndicator(
      child: listViewM,
      onRefresh: getData,
      color: Colors.blue,
    );

しかし、この時間getDataメソッドが実装されています。

  Future<Null> getData() async{
    if (!isFetching) {
      catergoryChildTask.getCatergoryTask(type);
      isFetching = true;
    }
    return null;
  }

より多くのキャリア上のラジャのリストビュー

キャリア上のラジャのリストビューはScrollControllerより多くの制御によってトリガーされます。
次のように検出条件の端部に圧延されています。

 scrollController.addListener(() {
      if (scrollController.position.pixels ==
          scrollController.position.maxScrollExtent) {
        loadMore=true;
        getData();
      }
    });

リストビュー最下段の表示処理の進行状況バーロードは、以下を参照してもよいです

 itemBuilder: (BuildContext context, int index) {
        if (index == catergoryChildList.length) {
          return buildCircleProgressBar();
        } else {
          CatergoryChild catergoryChild = catergoryChildList[index];
          return ItemView(catergoryChild, index, (index) {
            Scaffold.of(context)
                .showSnackBar(SnackBar(content: Text("第$index项被点击了")));
          });
        }
      }

前記buildCircleProgressBarを処理する方法は次のとおりです。

  Widget buildCircleProgressBar() {
    return Padding(
      padding: EdgeInsets.all(8),
      child: Center(child: Opacity(
          opacity: 1, child: CircularProgressIndicator()),
      ),);
  }

底部に引っ張られたときに表示サブアイテムの状態のこの実現がロードされます。あなたが他の処理をしたい場合は自分自身することができます。



著者:幸福プログラム人民元
リンクします。https://www.jianshu.com/p/67c427eac0d8
出典:ジェーン・ブック
著者によって予約ジェーンブックの著作権、いかなる形で再現され、承認を得るために、作者に連絡して、ソースを明記してください。

おすすめ

転載: blog.csdn.net/dpl12/article/details/92013029