可见性 vs 台下 vs 不透明度,哪个最适合从小部件树中隐藏孩子?



从这个线程中,我发现有很多方法可以从树层次结构中隐藏小部件。喜欢使用:

Visibility

Visibility(
visible: false,
child: Foo(),
);

Offstage

Offstage(
offstage: true,
child: Foo(),
);

Opacity

Opacity(
opacity: 0,
child: Foo(),
);

if条件:

if (visible) {
child
}

什么都没有。

他们中的哪一个是首选(我知道Visibility是那个,为什么Visibility(,if条件和Visibility有什么区别,我如何衡量性能。Opacity文档中提到:

不透明度比按需在树中添加和删除子构件更有效。

这是什么意思,是为了if条件吗?如果是,那么if在这四个人中处于什么位置?

不透明度

这个将不透明度(alpha(设置为您想要的任何内容。将其设置为0.0只是比将其设置为0.1稍微不那么明显,所以希望这很容易理解。小部件仍将保持其大小并占用相同的空间,并保持每个状态,包括动画。由于它留下了间隙,用户仍然可以触摸或单击它。(顺便说一句,如果你不希望人们触摸一个看不见的按钮,你可以用一个IgnorePointer小部件来包装它。

台下

这个隐藏了子小部件。您可以将其想象为将小部件放在"屏幕外",这样用户就不会看到它。小部件仍然会遍历颤振管道中的所有内容,直到它到达渲染阶段,在那里它根本不布局或绘制任何内容。这意味着它将保持所有状态和动画,但在"布局阶段"不会占用任何空间,也不会在"绘画阶段"绘制任何内容。因为它没有留下任何间隙,所以用户自然无法点击它。

能见度

为了您的方便,这个结合了上述(以及更多(。它有maintainStatemaintainAnimationmaintainSizemaintainInteractivity等参数。根据您设置这些属性的方式,它从以下方面做出决定:

  1. 如果要保持状态,它将用OpacityOffstage包裹子项,具体取决于您是否还要保持大小。此外,除非您想maintainInteractivity,否则它还会为您包装一个IgnorePointer,因为单击透明按钮有点奇怪。

  2. 如果你根本不想maintainState,它会直接用SizedBox替换child,所以它完全消失了。您可以使用replacement属性将空白SizedBox更改为所需的任何内容。

删除小部件

如果您不需要维护状态等,通常建议从树中完全删除小部件。例如,您可以使用if (condition)来决定是将小组件包含在列表中,还是使用condition ? child : SizedBox()将其直接替换为SizedBox。这样可以避免不必要的计算,并且最适合性能。

我认为上面的答案非常有用和清晰。关于使用条件方式,我介绍了两种非常有用的方法:

condition ? child : SizedBox()if (condition) child如果您使用至少 2.3.0 的飞镖版本

查看更多 https://github.com/flutter/flutter/issues/3783

最新更新