颤振图标不在容器中居中答案

【问题标题】：flutter icon is not centered in container颤振图标不在容器中居中
【发布时间】：2021-05-03 02:09:15
【问题描述】：

我试图使图标在圆形背景中居中，但即使我将中心小部件用作子小部件，它也会失败，除非增加容器大小。


    Container(
                  height: 22,
                  width: 22,
                  decoration: BoxDecoration(
                    shape: BoxShape.circle,
                    color: Color(0xffF7825C),
                  ),
                  child: Center(
                    child: Icon(
                      Icons.add,
                      color: Colors.white,
                    ),
                  ),
                )

【问题讨论】：

标签： flutter flutter-widget flutter-container

【解决方案1】：

试试这个：

             Container(
              alignment: Alignment.center,
              height: 22,
              width: 22,
              decoration: BoxDecoration(
                shape: BoxShape.circle,
                color: Color(0xffF7825C),
              ),
              child: Icon(
                  Icons.add,
                  color: Colors.white,
                  size: 22 
                ),
            )

【讨论】：

它在为图标设置大小时起作用。

【解决方案2】：

您需要使用size 属性设置图标的大小，因此您的图标小部件应如下所示

Icon(
    Icons.add,
    color: Colors.white,
    size: 22
)

【讨论】：

最后我通过将其更改为 CircleAvatar 小部件来解决它，这样它就可以毫无困难地对齐中心，

【解决方案3】：

也可以使用RawMaterialButton，可以这样设置

RawMaterialButton(
              onPressed: () {},
              fillColor: Color(0xffF7825C),
              child: Icon(
                Icons.add,
                size: 22.0,
                color: Colors.white,
              ),
              shape: CircleBorder(),
            )

【讨论】：

【解决方案4】：

使用以下内容：

Container(
              height: 22,
              width: 22,
              decoration: BoxDecoration(
                shape: BoxShape.circle,
                color: Color(0xffF7825C),
              ),
              alignment: Alignment.center,
                child: Icon(
                  Icons.add,
                  color: Colors.white,
                ),
              
            )

【讨论】：