首页 > 解决方案 > 颤振布局错误“底部的无限像素溢出的 RenderFlex”

问题描述

我有脚手架和

MaterialApp(
    home: Scaffold(
      body: Stact(
    ....
    ....
    return Column(
                children: <Widget>[
                  Align(
                    alignment: Alignment.topCenter,
                    child: Padding(
                      padding: EdgeInsets.fromLTRB(0.0, 60.0, 0.0, 0.0),
                      child: Image(
                        image: AssetImage('assets/images/logo.png'),
                      ),
                    ),
                  ),
                  authController.signIn() == true ? SignInView() : SignUpView(),
                  Align(
                    alignment: Alignment.center,
                    child: Padding(
                      padding: const EdgeInsets.fromLTRB(0.0, 0.0, 0.0, 35.0),
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: <Widget>[
                          RaisedButton(
                            child: Text('Sign In',
                                style: TextStyle(
                                  color: Colors.white,
                                )),
                            shape: RoundedRectangleBorder(
                                borderRadius: BorderRadius.only(
                                  bottomLeft: Radius.circular(15.0),
                                  topLeft: Radius.circular(15.0),
                                ),
                                side: BorderSide(color: Colors.orange)),
                            color: Colors.transparent,
                            onPressed: () {
                              print('login');
                              authController.toSignIn(true);
                            },
                          ),
                          RaisedButton(
                            child: Text('Sign Up',
                                style: TextStyle(
                                  color: Colors.white,
                                )),
                            shape: RoundedRectangleBorder(
                                borderRadius: BorderRadius.only(
                                  bottomRight: Radius.circular(15.0),
                                  topRight: Radius.circular(15.0),
                                ),
                                side: BorderSide(color: Colors.orange)),
                            color: Colors.transparent,
                            onPressed: () {
                              print('signup');
                              authController.toSignIn(false);
                            },
                          ),
                        ],
                      ),
                    ),
                  )
                ],
              );

SignInView() 与

return Scaffold(
      backgroundColor: Colors.transparent,
      body: Container(
        height: 100.0,
        child: Column(
          children: <Widget>[
            Text('hey'),
          ],
        ),
      ),
    );

只要我在 中添加 SignInView 和 SignOutView Column Children,我就会收到这个A RenderFlex overflowed by Infinity pixels on the bottom

我试图将 Scaffold 更改为其他东西,Container 甚至使用 Padding 小部件。如何将 Scaffold 高度设置为其父级高度 100%,如 CSS 高度 100vh 或 Flutter 中的其他内容?

标签: flutter

解决方案


你不应该在另一个 Scaffold 中使用 Scaffold。从 SignInView() 中移除脚手架并将其保留为 Container

return Container(
            height: 100.0,
            child: Column(
              children: <Widget>[
                Text('hey'),
              ],
            ),
          ),

请让我知道这是否有帮助。干杯


推荐阅读