8-19リストビューは、フラッターベースの学習の動的なリストを使用します

著作権：帰属、紙ベースを作成するために他人を許可し、（同じライセンスで元のライセンス契約に基づいて用紙配布する必要がありますクリエイティブコモンズ）

はじめに：実際の開発では、このような呼び出しの非常に少ない使用の死亡または静的リストを作成します。私たちは、上で後ろから読んで、そのような私たちのデータなどの動的なリストを、使用して、変数の配列に格納し、リストを循環配列の内容に。

使用の、リストタイプ

ダートのリストは、コレクション型の一つであり、あなたが実際に（私はそうとにかくだと思う）単純に配列として理解それを置くことができ、他の言語にもこのタイプを持っています。これは、いくつかの方法で声明です。

var myList = List()非固定長の宣言。
var myList = List(2)：固定長を宣言します。
var myList= List<String>()：宣言タイプを修正しました。
var myList = [1,2,3]：リストへの直接代入。

我々がここで使うということは、渡されたリスト、一覧の後、直接使用することであるgenerateリスト要素法で生産。最終結果は値を持つリスト変数の生産です。コードは以下の通りであります：

void main () => runApp(MyApp(
  items: new List<String>.generate(1000, (i)=> "Item $i")
));

再：説明mainクラスで呼び出さrunApp MyAppの機能、及びそのクラス使用渡すitemsパラメータおよび生成するために発電機を使用するitems割り当てを。

2つのパラメータを渡す方法を生成し、最初のパラメータは、生成された第2の方法の数です。

第二に、引数を受け取ります

我々はすでにパラメータを渡している、このクラスは、MyAppを受信する必要があるということです。

final List<String> items;
 MyApp({Key key, @required this.items}):super(key:key);

これは、キーに加えて、我々はここで、パラメータを渡します追加、コンストラクタである@required彼が通過します意味します。:super親クラスにはデフォルトコンストラクタ無名のパラメータを持っていない場合は、サブクラスは手動でスーパークラスのコンストラクタを呼び出す必要があります。

私たちは、引数を介してパスを受け取ることができるように、当然のことながら、私たちは事前に宣言する必要があります。

第三に、動的なリストListView.builder（）

値を受け入れた後、あなたは直接、動的に生成されたリストを呼び出すことができます。具体的なコードは次のよう：

import 'package:flutter/material.dart';
//主函数（入口函数）
void main() {
     runApp(MyApp(
       //main函数的runApp中调用了MyApp类，再使用类的使用传递了一个items参数,并使用generate生成器对items进行赋值。
       //使用的是一个List传递，然后直接用List中的generate方法进行生产List里的元素。最后的结果是生产了一个带值的List变量。
       items:new List<String>.generate(1000, (i)=>"item $i")//List可以理解为数组
       //generate方法传递两个参数，第一个参数是生成的个数，第二个是方法
     ));
}
//声明MyApp类继承-StatelessWidget：具有不可变状态(state)的Widget(窗口小部件).
class MyApp extends StatelessWidget{
   //我们已经传递了参数，那MyApp这个类是需要接收的。
   final List<String> items;
   //这是一个构造函数，除了Key，我们增加了一个必传参数，这里的@required意思是必传。:super如果父类没有无名无参数的默认构造函数，则子类必须手动调用一个父类构造函数。
   MyApp({Key key,@required this.items}):super(key:key);
  //重写build方法
  @override
  Widget build(BuildContext context) {
    //返回一个material风格的组件
    return MaterialApp(
       title: 'Welcome to Flutter',   
       //Scaffold:实现了基本的 Material 布局,可以理解为一个布局的容器
       home: Scaffold(                //home ： 应用默认所显示的界面 Widget
          appBar: AppBar(
            title: Text('Welcome to Flutter'),
          ),
          body:new ListView.builder(   //添加一个动态列表,子item数量是可变的,用builder方式构建。
            itemCount: items.length,   //列表长度
            itemBuilder: (context,index){   //构建item
              return new ListTile(
                title: new Text("${items[index]}"),  //接收索引值
              );
            },
          )
        ),
       theme: new ThemeData(primaryColor: Colors.red),  // 设置主题颜色
    );
  }
}

今、私たちは私たちのリストの効果を確認するために、仮想マシンを起動することができます。

8-19リストビューは、フラッターベースの学習の動的なリストを使用します

おすすめ