在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 点赞
评论
共同学习,写下你的评论
评论加载中...
作者其他优质文章
正在加载中
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦