大佬教程收集整理的这篇文章主要介绍了谈谈我对 Flutter 未来发展 和 “嵌套地狱” 的浅显看法,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
提到 Flutter 就不得不提到 Fuchsia 系统,这是一个尚未正式发布的操作的系统,引用 Android 和 Chrome 的高级副总裁 @H_801_12@Hiroshi Lockheimer 在一档播客节目中对 Fuchsia 的介绍是:@H_489_4@
是的,Fuchsia 系统是为物联网研发的操作系统,物联网简称 IoT,现在全世界都在押注 IoT,包括华为、小米等国内公司。@H_489_4@
那 Flutter 和 Fuchsia 又有什么关系呢?@H_489_4@
Flutter 是 Fuchsia 官方指定的唯一UI开发框架。@H_489_4@
现在有很多物联网操作系统 ,Fuchsia 就一定可以脱颖而出吗?@H_489_4@
不一定,未来的事情谁说的准呢,但在我看来 Fuchsia 是最有可能发展起来的物联网操作系统,因为一个操作系统的发展除了本身优秀以外,最大的阻碍其实是生态,而 Fuchsia 在生态方面具有天然的优势, 国外的一篇报道曾说:@H_489_4@
试想一下,一旦 Google 将 Android App 无缝移植到 Fuchsia 上,其他物联网操作系统如何与之抗衡。@H_489_4@
这里引用 Google 公众号底部的一句话送给大家:@H_489_4@
在跨平台技术上 Flutter 还有很多竞争对手,比如 HTML5、React Native、Weex、快应用、小程序等,我曾在跨平台技术发展简介 中详细说明了各个跨平台技术的发展历史及优缺点。@H_489_4@
Flutter 的出现会终结其他跨平台技术?我想不会的, React Native 发展了这么多年也没有完全干掉 HTML5,应为 HTML5 有其独特的应用场景,比如 营销活动场景、新闻或者博客详情页面等,这些场景非常适合 HTML5。因此 Flutter 也不可能终结其他跨平台技术,总结一句话就是:@H_489_4@
未来很长一段时间,将会是跨平台技术共存的时代,但 Flutter 适用场景更为广阔。@H_489_4@
现在网络上对 Flutter 吐槽最多大概就是 Flutter “嵌套地狱”写法了,为什么会出现这种现象?个人认为最大的原因就是目前大部分开源的 Flutter 项目都是这种嵌套写法(包括我自己以前也是如此),导致后来的初学者认为这么写没有问题,当项目越来越复杂时,这种嵌套写法给项目的维护带来了巨大的挑战。下面说说如何避免这种嵌套写法?@H_489_4@
嵌套地狱 的写法:@H_489_4@
@override
Widget build(BuildContext context) {
return column(
children: <Widget>[
Container(
height: 45,child: Row(
children: <Widget>[
SizedBox(
width: 30,),Icon(
Icons.notifications,color: Colors.blue,SizedBox(
width: 30,Expanded(
child: Text('消息中心'),Container(
padding: EdgeInsets.symmetric(horizontal: 10),decoration: BoxDecoration(
shape: BoxShape.rectangle,borderRadius: BorderRadius.all(Radius.circular(50)),color: Colors.red),child: Text(
'2',style: TextStyle(color: Colors.whitE),SizedBox(
width: 15,],Divider(),//类似上面的布局写6个
],);
}
上面还仅仅是第一项的布局,下面还有7个,一个30多行代码,7个就是200多行的布局代码,这还仅仅是布局代码,如果加上逻辑,都不敢想象啊。@H_489_4@
或许有一点封装思想开发者会将每一个 Item封装为一个方法,写法如下:@H_489_4@
_buildItem(IconData iconData,Color iconColor,String title,Widget widget) {
return Container(
height: 45,child: Row(
children: <Widget>[
SizedBox(
width: 30,Icon(
iconData,color: iconColor,SizedBox(
width: 30,Expanded(
child: Text('$title'),widget,SizedBox(
width: 15,);
}
@override
Widget build(BuildContext context) {
return column(
children: <Widget>[
_buildItem(...),_buildItem(...),);
}
这样看起来好多了,基本解决了嵌套地狱问题,但这样写还存在一个非常大的问题-性能问题,一旦其中一个数字发生变化,整个页面都要重建,Flutter 开发中非常重要的一个原则就是 尽可能少的重建组件,因此将上面封装到方法中组件变为一个 Widget。@H_489_4@
class SetTingDemo extends StatelessWidget {
@override
Widget build(BuildContext context) {
return column(
children: <Widget>[
_SetTingItem(
iconData: Icons.notifications,iconColor: Colors.blue,title: '消息中心',suffix: _NotificationsText(
text: '2',_SetTingItem(
iconData: Icons.thumb_up,iconColor: Colors.green,title: '我赞过的',suffix: _Suffix(
text: '121篇',_SetTingItem(
iconData: Icons.grade,iconColor: Colors.yellow,title: '收藏集',suffix: _Suffix(
text: '2个',_SetTingItem(
iconData: Icons.shopping_basket,title: '已购小册',suffix: _Suffix(
text: '100个',_SetTingItem(
iconData: Icons.account_balance_wallet,title: '我的钱包',suffix: _Suffix(
text: '10万',_SetTingItem(
iconData: Icons.LOCATIOn_on,iconColor: Colors.grey,title: '阅读过的文章',suffix: _Suffix(
text: '1034篇',_SetTingItem(
iconData: Icons.local_offer,title: '标签管理',suffix: _Suffix(
text: '27个',);
}
}
class _SetTingItem extends StatelessWidget {
const _SetTingItem(
{Key key,this.iconData,this.iconColor,this.title,this.suffix})
: super(key: key);
final IconData iconData;
final Color iconColor;
final String title;
final Widget suffix;
@override
Widget build(BuildContext context) {
return Container(
height: 45,child: Row(
children: <Widget>[
SizedBox(
width: 30,Icon(iconData,SizedBox(
width: 30,Expanded(
child: Text('$title'),suffix,SizedBox(
width: 15,);
}
}
class _NotificationsText extends StatelessWidget {
final String text;
const _NotificationsText({Key key,this.text}) : super(key: key);
@override
Widget build(BuildContext context) {
return Container(
padding: EdgeInsets.symmetric(horizontal: 10),decoration: BoxDecoration(
shape: BoxShape.rectangle,child: Text(
'$text',);
}
}
class _Suffix extends StatelessWidget {
final String text;
const _Suffix({Key key,this.text}) : super(key: key);
@override
Widget build(BuildContext context) {
return Text(
'$text',style: TextStyle(color: Colors.grey.withOpacity(.5)),);
}
}
封装为一个个单独的小组件,将有变化的组件尽量单独封装,这样就不会重建整个控件树,增强了可读性和可维护性,而且对性能有很大的提升。@H_489_4@
最后总结一句:@H_489_4@
虽然 Flutter 一切皆是组件,但并不代表一切都要写在组件中。@H_489_4@
当然这仅仅是我个人的看法,如果您有更好的方法欢迎一起讨论,从我做起,规范写法,为 Flutter 发展贡献做出一点微不足道的贡献。@H_489_4@
老孟Flutter博客地址(330个控件用法):http://laomengit.com@H_489_4@
欢迎加入Flutter交流群(微信:laomENGIt)、关注公众号【老孟Flutter】:@H_489_4@
以上是大佬教程为你收集整理的谈谈我对 Flutter 未来发展 和 “嵌套地狱” 的浅显看法全部内容,希望文章能够帮你解决谈谈我对 Flutter 未来发展 和 “嵌套地狱” 的浅显看法所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。