Flutter 飞溅/加载屏幕的最佳方式

Question

我有一个连接到 firebase (firestore) 的 flutter 应用程序。

当用户打开应用程序时，我检查他是用户类型 1 还是用户类型 2。+ 从网络加载图像等。

但是做所有这些事情可能需要一秒钟。制作/实现加载屏幕/启动画面的最佳方法是什么，直到所有内容都加载完毕？

谢谢！

Answer 1

实现此目的的方法之一是使用FutureBuilder。下面给出了我在应用程序中使用的代码片段

FutureBuilder(
    future: _getData(), // the function to get your data from firebase or firestore
    builder : (BuildContext context, AsyncSnapshot snap){
        if(snap.data == null){
            //return loading widget
        }
        else{
            //return the widget that you want to display after loading
        } 
    }
);

AsyncSnapshot由“ future”中的函数返回，即本例中的 _getData()。

Answer 2

我的解决方案是定义一个小部件，它将显示加载动画并同时执行一些后台工作。

该小部件采用一个代表“加载动画”的小部件和一个将在后台执行的函数。

这取自https://github.com/Ephenodrom/EZ-Flutter。

您可以在https://ez-flutter.de/docs/transition找到文档

import 'package:flutter/material.dart';

///
/// Widget for displaying loading animation and doing background work at the same time.
///
class EzTransition extends StatefulWidget {
  EzTransition(this.child, this.toProcess, {this.backgroundColor});

  final Function() toProcess;
  final Widget child;
  final Color backgroundColor;

  @override
  _EzTransitionState createState() => _EzTransitionState();
}

class _EzTransitionState extends State<EzTransition> {
  @override
  void initState() {
    super.initState();
    widget.toProcess();
  }

  @override
  Widget build(BuildContext context) {
    return Material(
      color: getBackgroundColor(),
      child: widget.child,
    );
  }

  Color getBackgroundColor() {
    return widget.backgroundColor == null
        ? Theme.of(context).backgroundColor
        : widget.backgroundColor;
  }
}