如何在Flutter中使用计时器显示小部件4秒

Question

我在BuildWaitingScreen小部件中为启动屏幕创建了UI。我想在名为buildWaitingScreen的小部件中显示Splash屏幕4秒钟。我想知道如何给出这个小部件的等待时间？是否可以使用"计时器"进行此操作或"未来延迟"以获得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();
}
}
}

`

Answer 1

也许为时已晚，但如果有人仍然需要答案，我们就来了。

所以我尝试了@Santosh Anad的答案，它有效。我会尽量说清楚的。

首先，您需要在类中启动一个bool类型的变量来控制(显示/隐藏(小部件。

bool _showWidget = true // When the val true, it will show the widget

然后在initState((中添加以下Future代码：

Future.delayed(const Duration(seconds: 3)).then((value) {
setState(() {
_showWidget = false;
});
});

然后在您的小部件中添加条件以知道何时隐藏/显示：

SizedBox(
child: _showWidget
// If _showWidget true, return this widget
? Text('This widget will show!')

// If _showWidget false, return null
: null
),

欢迎提出任何问题或改进！

Answer 2

使用这个。

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

Answer 3

或者你可以试试这个来解决问题，对我来说效果很好。

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>[
],
),
),
),
);
}
}