Flutter开发 -- 条件绘制

先水一篇,后面扩种这篇的内容。当然就不止是条件绘制了。

很多时候难免会出现一种情况,那就是屏幕显示的一个或者多个Widget和某些条件相关联。满足条件的显示出来,不满足的不显示。这就需要用到条件绘制。

用最常见的三元操作符 ?:

这个是最常见的,在Flutter是,在隔壁React也是。使用的非常普遍。

上面的代码是说,如果满足条件controller.hasSuchField('due date'),就显示一个Icon,否则什么都不显示。

或者

使用If-case或者switch表达式

if-case:

Switch表达式

使用一个匿名方法

根据value的值返回带有不同文本的Text。

用Builder

这是Flutter提供的实现复杂的绘制的工具。万能的builder在各种第三方的状态管理库里频繁出现。

现在看一个例子:

使用自定义方法

这个方式在Flutter里也会经常用到。不管是高情商代码抽象,还是低情商减少缩进。

以上大部分都可以用在child属性下。但是在Row,Column这样的children属性不一定适用。现在看看对children怎么实现条件绘制:

其实也是用了if表达式,或者类似于三元操作符。只是这里多了一个对Widget列表的操作。就是那个spread operator。让widget列表spread在children里。

相关推荐
AH_HH1 小时前
SmartCabinet:基于 Android 的智能储物柜管理系统技术解析
android·kotlin·存储柜
西部风情1 小时前
聊聊并发、在线、TPS
android·java·数据库
2501_916008897 小时前
Web 前端开发常用工具推荐与团队实践分享
android·前端·ios·小程序·uni-app·iphone·webview
2501_915921437 小时前
“HTTPS 个人化”实战,个人站点与设备调试的部署、验证与抓包排查方法
网络协议·http·ios·小程序·https·uni-app·iphone
我科绝伦(Huanhuan Zhou)7 小时前
MySQL一键升级脚本(5.7-8.0)
android·mysql·adb
怪兽20148 小时前
Android View, SurfaceView, GLSurfaceView 的区别
android·面试
消失的旧时光-19439 小时前
iFlutter --> Flutter 开发者 的 IntelliJ IDEA / Android Studio 插件
flutter·android studio·intellij-idea
龚礼鹏9 小时前
android 图像显示框架二——流程分析
android
消失的旧时光-19439 小时前
kmp需要技能
android·设计模式·kotlin
帅得不敢出门10 小时前
Linux服务器编译android报no space left on device导致失败的定位解决
android·linux·服务器