Flutter加载页异常：白屏5秒后短暂显示即跳转，如何让加载页显示5秒？

问题根源 #

你加载页的代码中，Future.delayed(const Duration(seconds: 5)) 没有等待延迟完成就直接执行了页面跳转，导致延迟逻辑完全失效。具体来说，这段代码仅创建了一个5秒后触发的异步任务，但未添加等待逻辑，代码会立刻执行后续的Navigator.pushReplacementNamed，使得加载页刚渲染完成就被跳转到首页。你看到的5秒白屏其实是应用启动初始化的耗时，并非加载页的显示时间。

修复方案 #

只需让代码等待延迟结束后再执行跳转，以下两种方式都可以实现：

方式一：修改didChangeDependencies方法

保留原有的didChangeDependencies结构，添加await等待延迟完成：

@override
void didChangeDependencies() {
  super.didChangeDependencies();
  SchedulerBinding.instance.addPostFrameCallback((_) async {
    await Future.delayed(const Duration(seconds: 5));
    Navigator.pushReplacementNamed(context, '/home');
  });
}

方式二：直接在initState中处理（更简洁）

删除didChangeDependencies方法，将逻辑移到initState里：

@override
void initState() {
  super.initState();
  Future.delayed(const Duration(seconds: 5), () {
    Navigator.pushReplacementNamed(context, '/home');
  });
}

修改完成后，加载页会正常显示5秒，之后自动跳转到首页。

内容的提问来源于stack exchange，提问作者David Khalatyan