如何删除列中小部件之间的间隙？

Question

您好，我正在尝试删除列中某些小部件之间的 space，但我不确定如何操作！截图：screenshot

代码：

Column(
      children: [
        GestureDetector(
          onTap: () {},
          child: const Icon(Icons.arrow_drop_up_rounded, size: 80),
        ),
        SizedBox(
          width: 130,
          height: 75,
          child: TextField(
            textAlign: TextAlign.center,
            onChanged: (a) {},
            decoration: InputDecoration(
              border: OutlineInputBorder(
                borderRadius: BorderRadius.circular(15),
              ),
              focusedBorder: OutlineInputBorder(
                borderSide: const BorderSide(
                  width: 4,
                ),
                borderRadius: BorderRadius.circular(15),
              ),
              labelStyle: TextStyle(fontSize: 27),
              labelText: "text",
            ),
          ),
        ),
        GestureDetector(
          onTap: () {},
          child: const Icon(
            Icons.arrow_drop_down_rounded,
            size: 80,
          ),
        ),
      ],
    ),

我想缩小两个图标之间的间隙。提前致谢！

Answer 1

您可以使用 Stack 并相应地对齐其子项，以获得此结果：

代码如下：


SizedBox(
      height: 200,
      child: Stack(
        children: [
          Align(
            alignment: Alignment.topCenter,
            child: Container(
              margin: const EdgeInsets.only(top: 15),
              child: GestureDetector(
                onTap: () {},
                child: const Icon(Icons.arrow_drop_up_rounded, size: 80),
              ) 
            ),
          ),  
          Center(
            child: SizedBox(
            width: 130,
            height: 50,
            child: TextField(
              textAlign: TextAlign.center,
              onChanged: (a) {},
              decoration: InputDecoration(
                border: OutlineInputBorder(
                  borderRadius: BorderRadius.circular(15),
                ),
                focusedBorder: OutlineInputBorder(
                  borderSide: const BorderSide(
                    width: 4,
                  ),
                  borderRadius: BorderRadius.circular(15),
                ),
                labelStyle: TextStyle(fontSize: 27),
                labelText: "text",
              ),
            ),
          ) 
          ),
          Align(
            alignment: Alignment.bottomCenter,
            child: Container(
              margin: const EdgeInsets.only(bottom: 15),
              child: GestureDetector(
                onTap: () {},
                child: const Icon(
                  Icons.arrow_drop_down_rounded,
                  size: 80,
                ),
              )
            ),
          )
        ],
      )
    )

如何删除列中小部件之间的间隙？

How to remove gaps between widgets in a column?

flutter

layout

widget

padding