09 | Widget，构建Flutter界面的基石
该思维导图由 AI 生成，仅供参考
荧光笔
直线
曲线- 深入了解
- 翻译
- 解释
- 总结
Flutter中的Widget是整个视图描述的基础，是Flutter功能的抽象描述，也是数据的映射。文章介绍了Widget在Flutter中的设计思路和基本原理，以及Widget渲染过程中的关键概念。在Flutter中，Widget、Element和RenderObject构成了视图构建的关键部分。Widget是视图的结构化描述，Element是Widget的实例化对象，负责连接配置信息到最终渲染，而RenderObject则是负责实际视图渲染的对象。文章还介绍了RenderObjectWidget的源码，展示了如何使用Element和RenderObject完成图形渲染工作。通过对这些概念的深入理解，读者可以更好地掌握Flutter的核心概念和技术，从而更高效地构建Flutter应用。 在Flutter中，Widget是整个视图描述的基础，是功能的抽象描述，也是数据的映射。本文介绍了Widget在Flutter中的设计思路和基本原理，以及Widget渲染过程中的关键概念。在Flutter中，Widget、Element和RenderObject构成了视图构建的关键部分。Widget是视图的结构化描述，Element是Widget的实例化对象，负责连接配置信息到最终渲染，而RenderObject则是负责实际视图渲染的对象。通过对这些概念的深入理解，读者可以更好地掌握Flutter的核心概念和技术，从而更高效地构建Flutter应用。
《Flutter 核心技术与实战》，新⼈⾸单¥59
全部留言(47)
- 最新
- 精选
- 竹之同学如果用 Vue 来比喻的话，Widget 就是 Vue 的 template；Element 就是 virtual DOM；RenderObject 就是DOM，不知道这种想法对不？
作者回复: 赞
2019-07-18265 
大土豆React：JSX->虚拟DOM->浏览器DOM React Native：JSX->虚拟DOM->Android/iOS原生控件 flutter：Widget->Element（类似虚拟DOM，只是一种数据结构）-> RenderObject 交给底层渲染作者回复: 赞
2019-07-19223
KrystalJake您好： 我看有的文档(flutter in action)会说一个Widget会对应多个Element，因为Element是根据Widget创建的，您的分享里说一个渲染点对应可能对应多个Widget，还是不太理解Widget，Element，RenderObject之间的关系，什么情况下一对一，一对多或多对一，希望能详细讲解一下，谢谢作者回复: Element是可复用的，只要Widget前后类型一样。比如Widget是蓝色的，重建后变红色了，Element是会复用的。所以是多个Widget（销毁前后）会对应一个Element
2019-07-18313
丁某某flutter 将Widget设计成不可变，怎么理解？作者回复: 变了就销毁重建
2019-07-1810
加温后的啤酒在iOS中，UIView相当于Element，CALayer相当于renderObject。 老师 我的理解对吗？作者回复: 可以这么理解
2019-07-228
Keep-Moving文中提到的绘制和渲染的区别是什么呢？作者回复: 绘制侧重绘图命令（GPU前），渲染侧重最终呈现（GPU后）
2019-07-187
TonyElement 则是 Widget 的一个实例化对象是什么含义作者回复: 两层意思：1.表示Widget是一个配置，Element才是最终的对象；2.Element是通过遍历Widget树时，调用Widget的方法创建的
2019-09-144
Paradise一个Widget可以对应多个Element，因为Widget是不可变的配置信息，而一个Element对应一个RenderObject作者回复: 前半部分不对哈。Element是可复用的，只要Widget前后类型一样。比如Widget是蓝色的，重建后变红色了，Element是会复用的。所以是多个Widget（销毁前后）会对应一个Element
2019-07-184
Longwei243listview想要通过代码滑动到某个item有什么办法吗？item的高度都是不固定的作者回复: ScrollController确实还不支持，可以关注下这个issue：https://github.com/flutter/flutter/issues/12319
2019-07-183
mαnajay我想问下 flutter 关于GPU 离屏渲染 这块有和iOS之类的不一样的地方吗？ 比如圆角 ，阴影， mask ，不透明多层合并 等 处理作者回复: 这块RenderObject帮你自动做了，一般情况下不需要管这么底层的渲染机制。
2019-07-242