flutter - Flutter Firebase提供程序架构

标签 flutter dart flutter-layout flutter-animation

我有一个带有动画容器的有状态小部件。在该动画容器内,我有一个连接到firebase的streamProvider。我的问题是,当我使用setState制作动画时,整个小部件都会重新生成,并再次调用firebase。我的解决方案是提起streamProvider并包装用该streambuilder设置动画的小部件。但这意味着我需要创建另一个小部件,从而创建更多样板。

我觉得自己在做错了,但由于所有提供程序资源都与身份验证相关,所以我有点卡住了...

有谁知道我如何以一种干净的方式解决这个问题? setState是在有状态的小部件中触发动画的正确方法吗?

最佳答案

对于动画,请尝试使用AnimatedBuilder进行动画制作的最简单方法,但是我想它不能解决您的问题。

我个人总是使用Provider程序包,我也不知道您是否也在使用它。

因此,通常,firebase为您提供数据流(如果您将其与具有不同功能的云功能一起使用)

现在,您可以在Stream Firebase为您提供和使用流数据的情况下使用StreamBuilder。使用此版本重建时,小部件将不会导致应用程序连接到服务器并获取新数据。

如果您真的想使用ChangeNotifier,则可以在ChangeNotifier内使用该流,侦听该流,并始终将此实现发生的更改通知给侦听器,也不会有任何不必要的网络调用。

第二个版本的一些示例:

class SomeNotifier extends ChangeNotifier {
  List<MyData> dataList = [];

  SomeNotifier() {
    Firestore.instance.collection("MyCollection").snapshots().listen((data) {
      dataList = data.documents.map((doc) => MyData.fromDoc(doc));
      notifyListeners();
    });
  }
}

class _MyWidgetState extends State<MyWidget>
    with SingleTickerProviderStateMixin {
  AnimationController _controller;

  @override
  void initState() {
    _controller = AnimationController(vsync: this);
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider<SomeNotifier>(
      create: (context) => SomeNotifier(),
      child: AnimatedBuilder(
        animation: _controller,
        builder: (context, child) {
          var notifier = Provider.of<SomeNotifier>(context);
          return Container(); //Here you can use your animated widget, it will be rebuilt to animate propperly
          //It will also rebuild every time data in firebase changes
        },
      ),
    );
  }
}

我希望这回答了你的问题。

关于flutter - Flutter Firebase提供程序架构,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61239793/

相关文章:

flutter - 如何在 PopupMenuItem 中使用 onTap 或 onPressed

Flutter 使用 ProxyProvider

dart - onTap 不适用于 ListWheelScrollView 子项 - Flutter

flutter - 为容器提供固定的宽度和高度与通过 BoxConstraints 类提供约束

flutter - Dart引用的回调带有返回值

firebase - FLUTTER Firestore在合并用于更新字段时创建新文档

flutter - 如何在 flutter 中自定义切换按钮

flutter - ld : framework not found Flutter

android - flutter : Errors when adding TextFields

firebase - 从Firebase DB中的 'map'读入Flutter中的ListView