首页 > 解决方案 > 如何减少按钮之间的空间,这是我的代码

问题描述

           Container(
              child: SizedBox(
                height: 400,
                child: GridView.count(
                  crossAxisCount: 1,
                  crossAxisSpacing: 0,
                  mainAxisSpacing: 2,
                  childAspectRatio: 1.5,
                  children: [
                    Container(
                      child: RaisedButton(
                          child: Text("Press Me"),
                          onPressed: (){},
                          color: Colors.blue[300],
                          splashColor: Colors.red,
                          shape: RoundedRectangleBorder(borderRadius: new BorderRadius.circular(10.0))
                      ),
                      padding: EdgeInsets.symmetric(horizontal: 10.0,vertical: 100.0),
                    ),
                    Container(
                      child: RaisedButton(
                          child: Text("Press Me"),
                          onPressed: (){},
                          color: Colors.blue[300],
                          splashColor: Colors.red,
                          shape: RoundedRectangleBorder(borderRadius: new BorderRadius.circular(10.0))
                      ),
                      padding: EdgeInsets.symmetric(horizontal: 10.0,vertical: 100.0),
                    ),
                  ],
                ),
              ),
            ),

在此处输入图像描述

标签: flutterbutton

解决方案


如果您想像这样以垂直顺序放置其子项,则可能应该使用Column小部件而不是 a 。GridView.count

Column(
  children: [
    RaisedButton(
      child: Text("Press Me"),
      onPressed: () {},
      color: Colors.blue[300],
      splashColor: Colors.red,
      shape: RoundedRectangleBorder(
        borderRadius: new BorderRadius.circular(10.0),
      ),
    ),
    SizedBox(height: 20), //any height you want
    RaisedButton(
      child: Text("Press Me"),
      onPressed: () {},
      color: Colors.blue[300],
      splashColor: Colors.red,
      shape: RoundedRectangleBorder(
        borderRadius: new BorderRadius.circular(10.0),
      ),
    ),
  ],
),

GridView当您想在网格中显示小部件时应该使用

有关更多信息,您可以访问GridView forGridViewColumn forColumn


推荐阅读