从 ui 中隐藏小部件而不占用任何空间

Question

我有一个类似下面的代码，我想用if隐藏字幕文本，但是当隐藏字幕时，它会在标题下添加空白空间，但如果删除字幕文本，它会正常工作

Column(
  children : [
    SizedBox(height: AppTheme.space1),
    Image.asset(
      image,
      width: 128,
      height: 128,
    ),
    SizedBox(height: AppTheme.space2),
    Text(
      title,
      style: Theme.of(context).textTheme.headline2,
      textAlign: TextAlign.center,
    ),
    if (subTitle != null)
      SizedBox(height: AppTheme.space0),
    if (subTitle != null)
      Text(
        subTitle ?? '',
        style: Theme.of(context).textTheme.bodyText1,
      ),
    SizedBox(height: AppTheme.space3),
    Button(
      onPressed: () {
        Navigator.pop(context, returnTextYes);
        onTapPrimaryButton?.call();
      },
      text: textYes,
    ),
  ]
)

Answer 1

使用Visibility 小部件

bool isVisible = subtitle.isNotEmpty

Visibility(
visible:isVisible
child: Text(
          subTitle ?? '',
          style: Theme.of(context).textTheme.bodyText1,
        )
)