web-dev-qa-db-ja.com

未来のリストをフラッターで返す

こんにちは私はフラッターと非同期プログラミングに新しいです。私はこのようなことをする必要があります:

List<Widget> usersProfiles = [];
      getUsers('DcofOiHWcjbjD0i18miW').then((user) {
        user.forEach((u) {
          usersProfiles.add(new ListTile(
            leading: CircleAvatar(
              backgroundImage: AssetImage(u.profilePicture),
            ),
            trailing: u.icon,
            title: new Text(u.name),
            onTap: () {
              Navigator.Push(context,
                  new MaterialPageRoute(builder: (context) => new Home()));
            },
          ));
        });
      });

しかしusersProfilesnullを返します

私はとても素晴らしくなります

3
Gabriel Cortes

FutureBuilder または StreamBuilder (ストリーム用)のいずれかをお勧めします。これにより、レイアウトのパフォーマンスが向上し、ロードウィジェットとエラーウィジェットを簡単に追加できるツールも提供されます。次のようになります。

Future<List<User>> usersFuture = getUsers('DcofOiHWcjbjD0i18miW');

メンバー変数としてフューチャーを作成して、1回だけフェッチするようにします(メソッドが呼び出すたびにメソッドが新しいフューチャーを開始する場合)。その後、FutureBuilder内で使用します。

FutureBuilder<List<User>>(
    future: usersFuture,
    builder: (context, snapshot) {
      if(snapshot.connectionState != ConnectionState.done) {
        // return: show loading widget
      }
      if(snapshot.hasError) {
        // return: show error widget
      }
      List<User> users = snapshot.data ?? [];
      return ListView.builder(
        itemCount: users.length,
        itemBuilder: (context, index) {
          User user = users[index];
          return new ListTile(
            leading: CircleAvatar(
              backgroundImage: AssetImage(user.profilePicture),
            ),
            trailing: user.icon,
            title: new Text(user.name),
            onTap: () {
              Navigator.Push(context,
                  new MaterialPageRoute(builder: (context) => new Home()));
            },
          );
      });
  });
8
JonasH