浏览页面

Question

我是 Flutter 新手。我知道如何从一个页面导航到另一个页面，但问题是我的导航不起作用。根据我的短暂经验，我意识到您无法从无状态小部件导航到有状态小部件或相反的小部件。

我将在下面分享我的代码。那么你能告诉我我犯了什么样的错误吗？

谢谢。 :)

实际上我打算删除按钮，因为这个页面可能是介绍页面，它可以显示我想要的图像和文本，3 秒后它可以转到 MainApp() 页面。也许如果你知道如何去做。我也想听听。:)



void main() {
  runApp(Intro());
}

class Intro extends StatefulWidget {
  @override
  _IntroState createState() => _IntroState();
}

class _IntroState extends State<Intro> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        backgroundColor: Colors.yellow.shade300,
        body: SafeArea(
          child: (Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: <Widget>[
              Expanded(
                child: Padding(
                  padding: const EdgeInsets.all(20.0),
                  child: Image.asset(
                    'assets/dinoapp2.png',
                    height: 200.0,
                    width: 200.0,
                  ),
                ),
              ),
              Expanded(
                child: Padding(
                  padding: const EdgeInsets.only(top: 40.0),
                  child: Text(
                    'Big Title',
                    textAlign: TextAlign.center,
                    style: TextStyle(
                        fontFamily: 'Russo One Regular',
                        fontSize: 30.0,
                        color: Colors.blueAccent),
                  ),
                ),
              ),
              Container(
                margin: EdgeInsets.fromLTRB(120.0, 20, 120, 100),
                child: RaisedButton(
                  onPressed: () {
                    Navigator.push(
                      context,
                      MaterialPageRoute(builder: (context) => MainApp()),
                    );
                  },
                  padding: EdgeInsets.all(20.0),
                  textColor: Colors.black,
                  color: Colors.white,
                  child: Text(
                    "Start",
                    style: TextStyle(fontSize: 20.0),
                  ),
                ),
              )
            ],
          )),
        ),
      ),
    );
  }
}

class MainApp extends StatefulWidget {
  @override
  _MainAppState createState() => _MainAppState();
}

class _MainAppState extends State<MainApp> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        backgroundColor: Colors.blue,
        body: SafeArea(
          child: Center(
            child: Text('This page I want to go after I press Start button'),
          ),
        ),
      ),
    );
  }
}

Answer 1

只需在您的简介中添加此功能即可class

   @override
   void initState() {
   super.initState();
   Future.delayed(const Duration(seconds: 2), () {
   Navigator.push( context, MaterialPageRoute(builder: (context) =>      
   MainApp()),
   );  }); 
  }

Answer 2

试试这个

void main() {
      runApp(MaterialApp(
        home: Intro(),
      ));
    }
    
    class Intro extends StatefulWidget {
      @override
      _IntroState createState() => _IntroState();
    }
    
    class _IntroState extends State<Intro> {
      @override
      void initState() {
        Future.delayed(Duration(seconds: 3), () {
          Route route = MaterialPageRoute(builder: (context) => MainApp());
    
          Navigator.push(context, route);
        });
        super.initState();
      }
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          backgroundColor: Colors.yellow.shade300,
          body: SafeArea(
            child: (Column(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.stretch,
              children: <Widget>[
                Expanded(
                  child: Padding(
                    padding: const EdgeInsets.all(20.0),
                    child: Image.asset(
                      'assets/dinoapp2.png',
                      height: 200.0,
                      width: 200.0,
                    ),
                  ),
                ),
                Expanded(
                  child: Padding(
                    padding: const EdgeInsets.only(top: 40.0),
                    child: Text(
                      'Big Title',
                      textAlign: TextAlign.center,
                      style: TextStyle(
                          fontFamily: 'Russo One Regular',
                          fontSize: 30.0,
                          color: Colors.blueAccent),
                    ),
                  ),
                ),
                Center(
                  child: CircularProgressIndicator(),
                )
              ],
            )),
          ),
        );
      }
    }
    
    class MainApp extends StatefulWidget {
      @override
      _MainAppState createState() => _MainAppState();
    }
    
    class _MainAppState extends State<MainApp> {
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          backgroundColor: Colors.blue,
          body: SafeArea(
            child: Center(
              child: Text('This page I want to go after I press Start button'),
            ),
          ),
        );
      }
    }

Answer 3

我不知道为什么，但我将您的代码复制到了 Intro class。它没有用。 :(

浏览页面

Navigate the page

navigation

flutter

flutter-layout