如何在 Flutter 中使用 Timer 显示一个小部件 4 秒答案

【问题标题】：How to show a widget for 4 seconds Using Timer in Flutter如何在 Flutter 中使用 Timer 显示一个小部件 4 秒
【发布时间】：2020-04-24 15:27:11
【问题描述】：

我在 BuildWaitingScreen 小部件中创建了启动屏幕的 UI。我想在名为 buildWaitingScreen 的小部件中显示启动屏幕 4 秒。我想知道如何给这个小部件等待时间？是否可以使用 Timer for this 或 Future Delay 来获得 4 秒的延迟？

代码：`

Widget buildWaitingScreen() {
      return Scaffold(
          body: Stack(
            fit: StackFit.expand,
            children: <Widget>[
              Container(
                decoration: BoxDecoration(color: Colors.blueAccent),
              ),
              Column(
                mainAxisAlignment: MainAxisAlignment.start,
                children: <Widget>[
                  Expanded(
                    flex: 2,
                    child: Container(
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: <Widget>[
                          CircleAvatar(
                            backgroundColor: Colors.white,
                            radius: 50.0,
                            child: Icon(
                              Icons.directions_car,
                              color: Colors.blue,
                              size: 50.0,
                            ),
                          ),
                          Padding(padding: EdgeInsets.only(top: 10.0),
                          ),
                          Text(
                            "CarWash Locator v.1",
                            style: TextStyle(color: Colors.white,
                                fontSize: 24.0,
                                fontWeight: FontWeight.bold),
                          )
                        ],
                      ),
                    ),
                  ),
                  Expanded(
                    flex: 1,
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: <Widget>[
                        CircularProgressIndicator(),
                        Padding(
                          padding: EdgeInsets.only(top: 20.0),
                        ),
                        Text(
                          "one click! locate car wash!!",
                          style: TextStyle(color: Colors.white,
                              fontSize: 18.0,
                              fontWeight: FontWeight.bold
                          ),
                        )
                      ],
                    ),
                  )
                ],
              )
            ],
          )
      );
  }

  @override
  Widget build(BuildContext context) {
    switch (authStatus) {
      case AuthStatus.NOT_DETERMINED:
        return buildWaitingScreen();
        break;
      case AuthStatus.NOT_LOGGED_IN:
        return new LandingPage(auth: widget.auth,);
        break;
      case AuthStatus.LOGGED_IN:
        if (_userId.length > 0 && _userId != null) {
          return new HomePage(auth: widget.auth,);
        } else
          return  buildWaitingScreen();
        break;
      default:
        return buildWaitingScreen();
    }
  }
}

【问题讨论】：

标签： user-interface flutter

【解决方案1】：

使用这个。

Future.delayed(Duration(seconds: 4)).then((value) => {
    // hide your widget
  });

【讨论】：

我将它置于 Init 状态并将我的小部件放入其中，但对我不起作用。

【解决方案2】：

或者你可以试试这个来解决问题，对我很有效..

class SplashScreen extends StatefulWidget {


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

class _SplashScreenState extends State<SplashScreen> {

void route(){
  Navigator.pushReplacement(context, MaterialPageRoute(builder: (context) => Route to your widgets));
}

initiateRoute(){
  var duration = Duration(seconds: 3);
  return Timer(duration, route);
}

  @override
  void initState() {
    initiateRoute();
    super.initState();
  }
  @override
  Widget build(context) {
    return Scaffold(
      body: Container(
        child: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
            ],
          ),
        ),
      ),
    );
  }
}

【讨论】：