亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

Flutter知識點: Widget隱藏與顯示

標簽:
Android

在Flutter中没有removeView,addView这种方式控制Widget Tree中的组件

场景: 根据状态显示隐藏widget

解决方案1(占位):

Widget _buildA() {
  var content;  if (data?.isNotEmpty) {    //如果数据不为空,则显示Text
      content = new Text('数据不为空');
  } else {   //当数据为空我们需要隐藏这个Text
   //我们又不能返回一个null给当前的Widget Tree
   //只能返回一个长宽为0的widget占位
      content = new Container(height:0.0,width:0.0);
  }  return content;
}

解决方案2(透明度):

class _HideAndShowPageState extends State<HideAndShowPage> {
bool visible = true;@overrideWidget build(BuildContext context) {  return new Scaffold(
    appBar: new AppBar(
      title: new Text('widget显示与隐藏'),
      centerTitle: true,
    ),
    body: new ListView(
      children: <Widget>[        new Padding(
          padding: const EdgeInsets.only(left: 10.0, top: 10.0, right: 10.0),
          child: new RaisedButton(
              textColor: Colors.black,
              child: new Text(visible ? '隐藏B    显示A' : '隐藏A   显示B'),
              onPressed: () {
                visible = !visible;
                setState(() {});
              }),
        ),        new Padding(
          padding: const EdgeInsets.only(left: 10.0, top: 10.0, right: 10.0),
          child: new Stack(
            children: <Widget>[              new TestAWidget(
                visible: visible,
              ),              new TestBWidget(
                visible: !visible,
              ),
            ],
          ),
        ),
      ],
    ),
  );
}
}class TestAWidget extends StatelessWidget {final bool visible;const TestAWidget({Key key, this.visible}) : super(key: key);@overrideWidget build(BuildContext context) {  return AnimatedOpacity(
    duration: Duration(milliseconds: 300),
    opacity: visible ? 1.0 : 0.0,
    child: new Container(
      color: Colors.blue,
      height: 100.0,
      child: new Center(
        child: new Text('TestAWidget'),
      ),
    ),
  );
}
}class TestBWidget extends StatelessWidget {final bool visible;const TestBWidget({Key key, this.visible}) : super(key: key);@overrideWidget build(BuildContext context) {  return AnimatedOpacity(
    duration: Duration(milliseconds: 300),
    opacity: visible ? 1.0 : 0.0,
    child: new Container(
      color: Colors.green,
      height: 100.0,
      child: new Center(
        child: new Text('TestBWidget'),
      ),
    ),
  );
}
}

解决方案3(Offstage):

class TestCWidget extends StatelessWidget { final bool visible; const TestCWidget({Key key, this.visible}) : super(key: key); @override
 Widget build(BuildContext context) {   return new Offstage(
     offstage: visible,
     child:new Container(
       color: Colors.orange,
       height: 100.0,
       child: new Center(
         child: new Text('TestCWidget'),
       ),
     ),
   );
 }
}



作者:老实巴交的读书人
链接:https://www.jianshu.com/p/3caddaeb0f1b



點擊查看更多內容
TA 點贊

若覺得本文不錯,就分享一下吧!

評論

作者其他優質文章

正在加載中
  • 推薦
  • 評論
  • 收藏
  • 共同學習,寫下你的評論
感謝您的支持,我會繼續努力的~
掃碼打賞,你說多少就多少
贊賞金額會直接到老師賬戶
支付方式
打開微信掃一掃,即可進行掃碼打賞哦
今天注冊有機會得

100積分直接送

付費專欄免費學

大額優惠券免費領

立即參與 放棄機會
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號

舉報

0/150
提交
取消