flutter - Flutter Dart：底部对齐行小部件

Question

我是 Flutter 的新手，我试图在底部连续显示两个按钮，我已经尝试了所有可能的解决方案，包括对齐、扩展等，但没有成功。如果有人可以帮忙，因为我的按钮没有不要在屏幕底部这是我的代码：

return Scaffold(
      body: SingleChildScrollView(
        child: Column(children: [
          Container(
           //code
          ),
          Container(
            //code
          ),
          Row(
            children: [
              ConstrainedBox(
                constraints: BoxConstraints.tightFor(width: 100, height: 80),
                child: ElevatedButton(
                  child: Text(
                    'Register',
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: 15.0,
                    ),
                  ),
                  style: ElevatedButton.styleFrom(
                    primary: Colors.blue.shade900,
                  ),
                  onPressed: () {
                    Navigator.push(
                      context,
                      MaterialPageRoute(builder: (context) => Intro()),
                    );
                  },
                ),
              ),
              ConstrainedBox(
                constraints: BoxConstraints.tightFor(width: 100, height: 80),
                child: ElevatedButton(
                  child: Text(
                    'Register',
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: 15.0,
                    ),
                  ),
                  style: ElevatedButton.styleFrom(
                    primary: Colors.blue.shade900,
                  ),
                  onPressed: () {
                    Navigator.push(
                      context,
                      MaterialPageRoute(builder: (context) => Intro()),
                    );
                  },
                ),
              ),
            ],
          ),
        ]),
      ),
    );

标签： flutterdartflutter-layoutflutter-test

Answer 1

这是您更新的代码，请检查

Scaffold(
          body: Column(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [
            SingleChildScrollView(
              child: Column(
                children: [
                  Container(
                      //code
                      ),
                  Container(
                      //code
                      ),
                ],
              ),
            ),
            Row(
              children: [
                ConstrainedBox(
                  constraints: BoxConstraints.tightFor(width: 100, height: 80),
                  child: ElevatedButton(
                    child: Text(
                      'Register',
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 15.0,
                      ),
                    ),
                    style: ElevatedButton.styleFrom(
                      primary: Colors.blue.shade900,
                    ),
                    onPressed: () {
                      Navigator.push(
                        context,
                        MaterialPageRoute(builder: (context) => Intro()),
                      );
                    },
                  ),
                ),
                ConstrainedBox(
                  constraints: BoxConstraints.tightFor(width: 100, height: 80),
                  child: ElevatedButton(
                    child: Text(
                      'Register',
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 15.0,
                      ),
                    ),
                    style: ElevatedButton.styleFrom(
                      primary: Colors.blue.shade900,
                    ),
                    onPressed: () {
                      Navigator.push(
                        context,
                        MaterialPageRoute(builder: (context) => Intro()),
                      );
                    },
                  ),
                ),
              ],
            ),
          ]),
        ),

或者

您可以使用bottomSheet脚手架的方法

Scaffold(
          bottomSheet: Padding(
        padding: const EdgeInsets.only(bottom: 10),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            ConstrainedBox(
              constraints: BoxConstraints.tightFor(width: 100, height: 80),
              child: ElevatedButton(
                child: Text(
                  'Register',
                  style: TextStyle(
                    color: Colors.white,
                    fontSize: 15.0,
                  ),
                ),
                style: ElevatedButton.styleFrom(
                  primary: Colors.blue.shade900,
                ),
                onPressed: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(builder: (context) => Intro()),
                  );
                },
              ),
            ),
            SizedBox(width: 50),
            ConstrainedBox(
              constraints: BoxConstraints.tightFor(width: 100, height: 80),
              child: ElevatedButton(
                child: Text(
                  'Register',
                  style: TextStyle(
                    color: Colors.white,
                    fontSize: 15.0,
                  ),
                ),
                style: ElevatedButton.styleFrom(
                  primary: Colors.blue.shade900,
                ),
                onPressed: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(builder: (context) => Intro()),
                  );
                },
              ),
            ),
          ],
        ),
      ),
          body: SingleChildScrollView(
            child: Column(children: [
              Column(
                children: [
                  Container(
                      //code
                      ),
                  Container(
                      //code
                      ),
                ],
              ),
            ]),
          ),
        ),