Flutter控件的显示与隐藏

本文介绍了Flutter中控制Widget显示的三种方式:Visibility、Offstage和Opacity。Visibility提供可视性控制,并有额外的属性如maintainState、maintainAnimation和maintainSize。Offstage则在隐藏时不会占用空间,而Opacity通过调整透明度实现隐藏。理解这些属性的相互关系和使用场景对于优化Flutter应用性能至关重要。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

在Android中,使用visibility属性控制View是否显示。
同样地,Flutter也使用Visibility来控制Widget是否显示。
同时也可以使用Offstage或Opacity来控制。

Visibility

 Visibility(
   visible: true,
   /// 隐藏时是否保持占位
   maintainState: false,
   /// 隐藏时是否保存动态状态
   maintainAnimation: false,
   /// 隐藏时是否保存子组件所占空间的大小,不会消耗过多的性能
   maintainSize: false,
   child: Text("显示"),
 ),

使用visible来控制子组件显示或隐藏。

Visibility最灵活,还同时提供了3个属性maintainStatemaintainAnimationmaintainSize
这三个属性有相互依赖.
以下是部分源码,
如果随便设置3个值,可能会报异常。

       assert(
         maintainState == true || maintainAnimation == false,
         'Cannot maintain animations if the state is not also maintained.',
       ),
       assert(
         maintainAnimation == true || maintainSize == false,
         'Cannot maintain size if animations are not maintained.',
       ),
       assert(
         maintainSize == true || maintainSemantics == false,
         'Cannot maintain semantics if size is not maintained.',
       ),
       assert(
         maintainSize == true || maintainInteractivity == false,
         'Cannot maintain interactivity if size is not maintained.',
       );

Offstage

 //能控件隐藏或显示,但是隐藏时不会占位。
 Offstage(
   offstage: true,
   child: Text("显示"),
 ),

Opacity

 ///0表示完全透明,也相当于隐藏
 ///1代表完全不透明,相当于完全显示
 Opacity(
   opacity: 0,
   child: Text("隐藏"),
 ),
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值