持续创作,加速成长!这是我参与「掘金日新计划 · 6 月更文挑战」的第19天,点击查看活动详情
Flutter 中widget、Element、 RenderObject关系
- Widget实际上就是Element的配置数据,Widget树实际上是⼀个配置树,⽽真正的UI渲染树是由Element构成;不过,由于Element是通过Widget⽣成,所以它们之间有对应关系,所以在⼤多数场景,我们可以宽泛地认为Widget树就是指UI控件树或UI渲染树。
- ⼀个Widget对象可以对应多个Element对象。这很好理解,根据同⼀份配置(Widget),可以创建多个实例(Element)。
- 从创建到渲染的⼤体流程是:根据Widget⽣成Element,然后创建相应的RenderObject并关联到Element.renderObject属性上,最后再通过RenderObject来完成布局排列和绘制。flutter使⽤RenderObjects管理传统UI对象的许多职责(例如维护布局的状态)。RenderObjects在帧之间保持不变,flutter的轻量级
- Widgets告诉框架在状态之间改变RenderObjects。
- Widget 仅⽤于存储渲染所需要的信息。
- RenderObject 负责管理布局、绘制等操作。
- Element 才是这颗巨⼤的控件树上的实体。
Layer
IOS的每⼀个UIView都有⼀个layer,flutter的render object不⼀定存在layer,⼀般情况下⼀个renderObject⼦树都渲染在⼀个layer上,那么什么renderObject具有layer,⼦renderObject怎么渲染到这个layer?
- 当⼀个renderObject的 alwaysNeedsCompositing == true 或isRepaintBoundary == true,renderOject会有对应的compositinglayer
- ⼦renderObject会对⽬标layer返回对应的offsetLayer, ⽬标compositing layer再根据offset合成⼀个渲染的纹理buffer
didChangeDependencies有两种情况会被调⽤。
- 创建时候在initState 之后被调⽤
- 在依赖的InheritedWidget发⽣变化的时候会被调
Flutter跟ReactNative、weex 等有什么不同?
- WebViews 最早的跨平台⽅案是基于JaveScript 和 WebView的,像PhoneGap Cordova、Ionic等。UI通过WebView来显⽰html代码,系统服务则通过⼀个中间层桥接到JaveScript中去。
- 原⽣App 苹果2008年发布iOS,Google 2009年发布Android,它们的SDK是基于两种不同的编程语⾔Objective-C 和 Jave.现在⼜有了Swift和Kotlin
- React Native RN不仅桥接系统服务,也将系统UI也桥接到了JaveScript中,这样写出来的UI最终也会渲染成原⽣的控件。
- Flutter Flutter使⽤Dart语⾔开发,Dart可以被编译(AOT)成不同平台的本地代码,让Flutter可以直接和平台通讯⽽不需要⼀个中间的桥接过程,从⽽提⾼了性能。
Widget的两种类型是什么
- StatelessWidget: ⼀旦创建就不关⼼任何变化,在下次构建之前都不会改变。它们除了依赖于⾃⾝的配置信息(在⽗节点构建时提供)外不再依赖于任何其他信息。⽐如典型的Text、Row、Column、Container等,都是StatelessWidget。它的⽣命周期相当简单:初始化、通过build()渲染。
- StatefulWidget: 在⽣命周期内,该类Widget所持有的数据可能会发⽣变化,这样的数据被称为State,这些拥有动态内部数据的Widget被称为StatefulWidget。⽐如复选框、Button等。State会与Context相关联,并且此关联是永久性的,State对象将永远不会改变其Context,即使可以在树结构周围移动,也仍将与该context相关联。当state与context关联时,state被视为已挂载。StatefulWidget由两部分组成,在初始化时必须要createState()时初始化⼀个与之相关的State对象
mixins extends implement之间的关系
继承(关键字 extends)、混⼊ mixins (关键字 with)、接⼝实现(关键字 implements)。这三者可以同时存在,前后顺序是extends ->mixins ->implements。
Flutter中的继承是单继承,⼦类重写超类的⽅法要⽤@Override,⼦类调⽤超类的⽅法要⽤super。
在Flutter中,Mixins是⼀种在多个类层次结构中复⽤类代码的⽅法。mixins的对象是类,mixins绝不是继承,也不是接⼝,⽽是⼀种全新的特性,可以mixins多个类,mixins的使⽤需要满⾜⼀定条件。