如何将窗口小部件紧密关闭？

Question

我正在面对问题

[如果在列中添加了两个小部件，则小部件之间有空间。我需要删除它们之间的空间。如何做到这一点。

    Container(height: 50,
                width: 50,
                color: Colors.grey,
                child: Column(mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: <Widget>[

                    Flexible(flex: 2,
                        child: Container(color: Colors.indigo,
                            child: SizedBox(child: Icon(
                              Icons.filter_list, color: Colors.white,),))),            
                    Flexible( flex:1, child:
                  Text('5',style: TextStyle(color: Colors.black),)
                ),]));

输出应为

实际上我也需要这种情况，

非常感谢您的帮助

Answer 1

您可以在文本小部件中添加0.6的高度。

Container(
    height: 50,
    width: 50,
    color: Colors.grey,
    child: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      crossAxisAlignment: CrossAxisAlignment.center,
      children: <Widget>[
        Flexible(
          flex: 2,
          child: Text(
            '5',
            style: TextStyle(color: Colors.black),
          ),
        ),
        Flexible(
          flex: 1,
          child: Text(
            '5',
            style: TextStyle(color: Colors.black, height: 0.6),
          ),
        ),
      ],
    ),
  ),

Answer 2

您可以使用assorted_layout_widgets package和innerDistance参数轻松地重叠两个小部件：

return ColumnSuper(
        innerDistance: -8,
          children: <Widget>[
            Text(
              '5',
              style: TextStyle(
                  color: Colors.black,
              ),
            ),
            Icon(
              Icons.filter_list,
              color: Colors.blue,
            ),
          ]
      );