flutter 为什么2个扩展小部件的宽度不相等

3b6akqbq  于 2023-01-27  发布在  Flutter
关注(0)|答案(1)|浏览(112)

为什么2个扩展小部件的宽度不等于

在个人小部件和生病小部件之间,您将看到数字零文本与个人小部件不对齐。
因此,我发现个人小部件的小部件树需要73个宽度,而生病的小部件需要100个宽度。

return Container(
      margin: const EdgeInsets.only(top: 12.0, right: 4.0, left: 4.0),
      child: Column(
        children: [
          Row(
            children: [
              Expanded(
                child: StatusItem(
                  img: Assets.images.svgIcons.icPersonal.svg(
                    width: 20.0,
                    height: 20.0,
                    fit: BoxFit.contain,
                  ),
                  label: translations.personalText,
                  total: personalLeave,
                ),
              ),
              const SizedBox(
                width: 8,
              ),
              Expanded(
                child: StatusItem(
                  img: Assets.images.svgIcons.icSwitch.svg(
                    width: 20.0,
                    height: 20.0,
                    fit: BoxFit.contain,
                    color: FigmaColors.slateColor,
                  ),
                  label: translations.switchText,
                  total: switchHoliday,
                ),
              ),
            ],
          ),
          const SizedBox(
            height: 14.0,
          ),
          Row(
            children: [
              Expanded(
                child: StatusItem(
                  img: Assets.images.svgIcons.icSick.svg(
                    width: 20.0,
                    height: 20.0,
                    fit: BoxFit.contain,
                  ),
                  label: translations.sickText,
                  total: sickLeave,
                ),
              ),
              Expanded(child: Container())
            ],
          ),
        ],
      ),
    );

你能解释一下并解决这个问题吗?

ccrfmcuu

ccrfmcuu1#

Expanded是一个小部件,它可以扩展,以便子对象填充可用空间。
在第一个Row中,您有3个孩子:

  • ExpandedSizedBoxExpanded,因此它们将在减小Sizedbox宽度后除以2空格

在第二个Row中,没有SizedBox占用任何空间。这就是为什么Expanded将所有空间除以2
如何修复:添加相同大小的SizeBox到第二个Row

Row(
  children:[
   Expanded(),
   SizedBox(width:8),
   Expanded(),
])

相关问题