列表和详细信息屏幕的颤动式Firestore流

时间:2020-09-09 15:48:23

标签: firebase flutter google-cloud-firestore stream-builder

我正在创建一个具有用户个人资料列表视图的应用程序,当您单击个人资料时,它将带您进入详细信息屏幕。

我将Firbase流用于列表视图,如下所示。

SearchResults.dart

  @override
  Widget build(BuildContext context) {
    return StreamProvider<List<Profile>>.value(
      value: db.getProfiles(),
      child: ProfileListings(),
    );
  }

ProfileListings.dart

Widget build(BuildContext context) {
    List profiles = Provider.of<List<Profile>>(context);

    final title = 'Profiles';

    return MaterialApp(
        child: Scaffold(
          appBar: AppBar(
            title: Text(title),
          ),
          body: gridView(profiles),
          drawer: DrawerNav(),
        ),
    );
  }

gridView

 GridView gridView(List<Profile> profiles) {
    return GridView.count(
      crossAxisCount: 2,
      // Generate 100 widgets that display their index in the List.
      children: List.generate(profiles.length, (index) {
        return Center(
          child: Card(
            semanticContainer: true,
            clipBehavior: Clip.antiAliasWithSaveLayer,
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(0.0),
            ),
            elevation: 5,
            margin: EdgeInsets.all(10),
            child: GestureDetector(
                onTap: () {
                  Navigator.push(
                      context,
                      MaterialPageRoute(
                          builder: (context) => ProfileDetails(
                                profileIndex: index,
                                profiles: profiles,
                              )));
                },
                child: Column(children: <Widget>[
                  Expanded(child: getPhoto(profiles[index])),
                  Row(
                    children: <Widget>[
                      Expanded(
                        child: Text(profiles[index].username,
                            textAlign: TextAlign.left),
                      ),
                      Expanded(
                        child: Text(profiles[index].age,
                            textAlign: TextAlign.right),
                      ),
                    ],
                  )
                ])),
          ),
        );
      }),
    );
  }

现在在详细信息屏幕上,我有一个按钮可以编辑配置文件的详细信息。我的问题是如何将配置文件作为流从列表视图从列表视图传递到详细信息屏幕,而无需单独调用firestore数据库?

由于我已经有了配置文件,所以我不想每次单击以查看配置文件详细信息时都进行个人通话。

有什么建议吗?

enter image description here

谢谢。

0 个答案:

没有答案