Question

我只想问一个Container隐藏时如何删除空格？

您可以在下面看到我的代码，我试图将其放在Visibility中并清空Container，但是它仍然占用GridView.count的空格。

代码：

  GridView.count(
        primary: false,
        padding: const EdgeInsets.all(20),
        crossAxisSpacing: 0,
        mainAxisSpacing: 0,
        crossAxisCount: 2,
        scrollDirection: Axis.vertical,
        shrinkWrap: true,
        children: <Widget>[

         GestureDetector(
              onTap: () => businessTypeClicked(1),
              child: Container(
                decoration: BoxDecoration(
                  color: Colors.white,
                  border: Border.all(
                      color: pressed[1]
                          ? Colors.green
                          : Colors.transparent, // set border color
                      width: 3.0), // set border width
                ),
                padding: const EdgeInsets.all(15),
                child: new Column(children: <Widget>[
                  Image.asset(
                    "assets/car.png",
                    height: 100,
                    width: 100,
                  ),
                  Text('Automotive/Transportation',
                      textAlign: TextAlign.center,
                      style: TextStyle(color: Constants.colorPrimary))
                ]),
              )),

          Visibility(
            visible: false,
            child: Container(
              color: Colors.white,
            ),
          ),

          Visibility(
            visible: false,
            child: Container(
              color: Colors.white,
            ),
          ),
       ]),

图片：

Answer 1

在if上使用条件语句Container，它将允许您隐藏/显示窗口小部件的渲染。

 GridView.count(
        primary: false,
        padding: const EdgeInsets.all(20),
        crossAxisSpacing: 0,
        mainAxisSpacing: 0,
        crossAxisCount: 2,
        scrollDirection: Axis.vertical,
        shrinkWrap: true,
        children: [
          Container(
            height: 100,
            width: 100,
            color: Colors.red,
          ),
          Container(
            height: 100,
            width: 100,
            color: Colors.green,
          ),
          if (false) // TODO: Condition
            Container(
              color: Colors.white,
            ),
          if (false) // TODO: Condition
            Container(
              color: Colors.white,
            ),
          Container(
            height: 100,
            width: 100,
            color: Colors.red,
          ),
          Container(
            height: 100,
            width: 100,
            color: Colors.red,
          ),
        ],
      ),

Answer 2

要隐藏小部件，请尝试Offstage widget

如果属性为offstage:true //this will not occupy any physical space and will be invisible

如果属性为offstage:false //this will occupy the physical space and visible

Offstage(
   offstage: true,
   child: Text("Visible"),
),

Flutter Gridview.count-隐藏容器时如何删除空白？

2 个答案: