软件编程
位置:首页>> 软件编程>> flutter编程>> Flutter控制组件显示和隐藏三种方式详解

Flutter控制组件显示和隐藏三种方式详解

作者:莲花小怪兽  发布时间:2023-07-07 03:03:30 

标签:Flutter,控制组件,组件显示,组件隐藏

方式一:if语句控制

// 例如:
Column(
         mainAxisAlignment: MainAxisAlignment.center,
         children: [
           if(a=="显示")
             Text("显示"),
          Offstage(
            offstage: false,
            child: Text("显示"),
          ),
          Visibility(
              visible: true,
              child: Text("显示")
          )
         ],
       ),

方式二:Offstage组件

offstage属性控制控制child的显示和隐藏,true时:隐藏,false时:显示

Offstage(
            offstage: true,
            child: Text("显示"),
          )

方式三: Visibility

visible属性控制child的显示和隐藏,true时:显示,false时:隐藏

Visibility(
              visible: true,
              child: Text("显示")
          )

Offstage和Visibility的区别:

1、Visibility 隐藏/可见,能保存组件的状态;Offstage不能保存组件的状态,组件重新加载。

2、当Offstage不可见(true)的时候,如果child有动画等,需要手动停掉,Offstage并不会停掉动画等操作。

3、Offstage隐藏时不占空间,Visibility可以设置隐藏时占据空间也可以不占据空间,默认不隐藏时不占据空间

备注:Visibility隐藏时占据空间如下:

Visibility(
 visible:false,
 maintainAnimation: true,
 maintainSize: true,
 maintainState: true,
 child: Text("显示"),
),

强调:maintainSize就是保持大小不变,如果只设置这个属性,会报错,另外两个属性:maintainAnimation和maintainState也必须同时设置。

来源:https://www.jianshu.com/p/8e40e281c469

0
投稿

猜你喜欢

手机版 软件编程 asp之家 www.aspxhome.com