Flutter 使用不包括导航器的上下文请求导航器操作。 在启动画面上

Question

so I'm trying to implement a splash screen where for two reasons.

1. the time given to the splash screen will be used to load all the data
2. For beautification

I'm using flutter_spinkit So here's my code:

class _SplashScreenState extends State<SplashScreen> {

  void initState() {
    super.initState();
    navigateToHomeScreen();
  }

  Future navigateToHomeScreen() async {
    return Timer(
      const Duration(milliseconds: 4000),
      () {
        Navigator.pushReplacement(context,
            MaterialPageRoute(builder: (BuildContext context) => App())); ---> doesn't go to new screen
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        backgroundColor: Color(0xff75c760),
        body: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            _buildAppName(),
            SizedBox(height: 20),
            _buildSpinner(),
          ],
        ),
      ),
    );
  }

  Widget _buildAppName() {
    return Text(
      "MasterChef",
      style: GoogleFonts.robotoMono(
        color: Colors.black,
        fontStyle: FontStyle.normal,
        fontSize: 30,
        fontWeight: FontWeight.bold,
      ),
    );
  }

  Widget _buildSpinner() {
    return SpinKitDoubleBounce(
      color: Colors.white,
    );
  }
}

and here's the App() from app.dart :

class _AppState extends State<App> {
  //Contains the simple drawer with switch case for navigation
  //Taken directly from the flutter docs
}

The basic idea is to load the splash screen for 4000 milliseconds in which the app will load all the necessary data and then navigate to App() which contains the navigation routes and all. But for some reason I'm getting Unhandled Exception: Navigator operation requested with a context that does not include a Navigator.

Answer 1

I cannot be certain to what the cause is as cannot see your entire app structure but I am guessing the cause is that you do not have a MaterialApp() at the root of your app.

If this doesn't work please update your question to contain more code of how you get the splash screen app to be displayed.

Answer 2

This is because you used return Timer() so remove the return keyword so, try changing your code to:

Future navigateToHomeScreen() async {
  Timer(
   const Duration(milliseconds: 4000),
   () {
    Navigator.pushReplacement(context,
        MaterialPageRoute(builder: (BuildContext context) => App())); 
      },
     );
 }

Alternatively, you can use Future instead of Timer

Future navigateToHomeScreen() async {
  Future.delayed(
   const Duration(milliseconds: 4000),
   () {
    Navigator.pushReplacement(context,
        MaterialPageRoute(builder: (BuildContext context) => App())); 
      },
     );
 }