Flutter 移除底部填充容器

Question

我创建了一个自定义对话框，但是当我在底部添加 2 个按钮时，我仍然有一个填充，我该如何删除它？

这是我的代码

  contentBox(context) {
    return ClipRRect(
      borderRadius: BorderRadius.circular(20),
      child: Container(
        color: Colors.white,
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            Container(
              padding: EdgeInsets.all(20),
              child: Column(
                children: [
                  Text(
                    widget.title,
                    style: TextStyle(fontSize: 23, fontWeight: FontWeight.w600),
                    textAlign: TextAlign.center,
                  ),
                  SizedBox(height: 15),
                  Text(
                    widget.descriptions,
                    style: TextStyle(fontSize: 16),
                    textAlign: TextAlign.center,
                  ),
                ],
              ),
            ),
            Row(
              children: <Widget>[
                Expanded(
                  child: RaisedButton(
                    child: Text('Reject'),
                    onPressed: () => null,
                  ),
                ),
                Expanded(
                  child: RaisedButton(
                    color: Colors.amber,
                    child: Text('Approve'),
                    onPressed: () => null,
                  ),
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }

结果：

PS：如果有优化，请告诉我，因为我刚开始接触flutter

Answer 1

这是因为RaisedButton有一个固定的高度。将 RaisedButton 包裹在 Container 小部件中并为其指定高度值。像这样应该没问题

Expanded(
    child: Container(
      height: 48,
      child: RaisedButton(
        child: Text('Reject'),
        onPressed: () => null,
      ),
    ),
  ),

对你的两个按钮都这样做这是输出：

此外，如果你想创建一个警告框，最好使用像 AlertDialog 这样的小部件中的 flutter build 如果你想要 iOS 样式的警告框，那么你可以使用 CupertinoAlertDialog

AlertDialog 在 video

中得到了很好的解释

Answer 2

RaisedButton 有一些默认填充，因此您需要像这样创建一个自定义按钮：

class CustomButton extends StatelessWidget {
      const CustomButton({
        Key key,
        this.backgroundColor,
        this.child,
      }) : super(key: key);
    
      final child;
      final Color backgroundColor;
    
      @override
      Widget build(BuildContext context) {
        return Container(
          height: 40,
          child: Material(
            color: backgroundColor,
            child: InkWell(
              onTap: () {},
              child: Container(
                alignment: Alignment.center,
                child: child,
              ),
            ),
          ),
        );
      }
    }

现在在你的代码中使用它，用这个替换你的行

Row(
  children: <Widget>[
    Expanded(
     child: CustomButton(
      backgroundColor: Colors.grey[100],
      child: Text('Reject'),
     ),
    ),
    Expanded(
     child: CustomButton(
      backgroundColor: Colors.amber,
      child: Text('Approve'),
     ),
    ),
   ],
 ),

结果：

Flutter 移除底部填充容器

Flutter remove bottom padding container

containers

padding

flutter