首页 > 解决方案 > 如何使用 Shimmer 在 Flutter App 中添加 X 持续时间的延迟?

问题描述

我正在开发 Flutter 应用程序,我想在其中显示加载选项 5 秒,5 秒后它将显示“未找到结果”。

代码

Widget Loading(){
 return Center(
  child: Shimmer.fromColors(
  baseColor: Colors.blueAccent,
  highlightColor: Colors.red,
  child:Text("Loading...",style: TextStyle(
      fontWeight: FontWeight.w900,
      fontSize: 50),
    textAlign: TextAlign.center,),
  period: Duration(seconds: 2),

  ),

 );
}

/// Use of Loading() in flutter pages

 body: (Details == null||Details.isEmpty)?
      Loading()
      : new SizedBox(.............)

// In this case, if "Details" has some data it automatically displays on-screen else, continuously loading(), I want after 5 seconds it displays "No Data Found"

有谁知道如何在上面的代码中添加定时器/持续时间/延迟?,这样 5 秒后屏幕上会显示“未找到数据”。

标签: flutterflutter-layoutflutter-dependenciesflutter-animation

解决方案


您可以为此使用FutureBuilder 。这是一个例子:

这是 FutureBuilder 的未来函数。在此功能中,您可以构建自己的逻辑。

Future<bool> _future = Future<bool>.delayed(
    Duration(seconds: 5),
    () {
      //do something here
      return true;
    },
  );

这 FutureBuilder 应该看起来像

FutureBuilder<bool>(
      future: _future,
      builder: (BuildContext context, AsyncSnapshot<bool> snapshot) {
        if (snapshot.hasData) {
          return snapshot.data ? SizedBox(.............) : Text("No data found");
        } else {
          return Loading();
        }
      },
    )

推荐阅读