1.Android Studio开发Flutetr快捷键
option(alt)+enter:选中StatelessWidget转换为StatefulWidget。option(alt)+enter:选中Widget外层包裹上某Widget。option(alt)+enter:将选中的Widget移除不影响内部。(这个组合快捷键可以做很多事情)。- AS右侧的
FlutterLine选中控件选择extract xxx:将相关的代码提取成一个方法或者build内部出来的Widget抽取到一个单独的Widget。 - AS右侧的
FlutterLine,选中children点击^V调整:上下移动调整children的顺序。 commond+option(alt)+b:查看抽象类的所有实现类。command+n:快速生成getter,setter,toString,construtor等方法。
2.Flutter图像是怎样渲染出来的
不需要经过中间状态,跳过了原生框架,直接通过skia引擎给GPU和CPU提供数据。skia(c++库)谷歌官方图形渲染引擎。
3.StatelessWidget和StatefulWidget的区别
通过观察Widget的源码可以发现
@immutable
abstract class Widget extends DiagnosticableTree {
// ...省略代码
}
被@immutable注解标明的类或者子类都必须是不可变的,所以开发中定义到Widget中的数据是不可变的,需要用final来修饰。
3.1 StatelessWidget:没有状态需要维护的widget
- 它们的数据通常是直接写死;从
parent widget中传入的而且一旦传入就不可以修改;从InheritedWidget获取来使用的数据。 - 执行
build方法时机:
当我们的StatelessWidget第一次被插入到Widget树中时(也就是第一次被创建时);当我们的父Widget(parent widget)发生改变时,子Widget会被重新构建;如果我们的Widget依赖InheritedWidget的一些数据,InheritedWidget数据发生改变时;
3.2 StatefulWidget:有状态的widget
既然Widget是不可变,那么StatefulWidget如何来存储可变的状态呢?
Flutter将StatefulWidget设计成了两个类:一个类继承自StatefulWidget,作为Widget树的一部分;一个类继承自State,用于记录StatefulWidget会变化的状态,并且根据状态的变化,构建出新的Widget;- 当
Flutter在构建Widget Tree时,会获取State的实例,并且它调用build方法去获取StatefulWidget希望构建的Widget;将需要保存的状态保存在State中。 StatefulWidget的生命周期:从创建~销毁的过程
首先,执行StatefulWidget中相关的方法:- 执行
StatefulWidget的构造函数(Constructor)来创建出StatefulWidget; - 执行
StatefulWidget的createState方法,来创建一个维护StatefulWidget的State对象;
其次,调用createState创建State对象时,执行State类的相关方法: - 执行
State类的构造方法(Constructor)来创建State对象; - 执行
initState,我们通常会在这个方法中执行一些数据初始化的操作,或者也可能会发送网络请求; - 执行
didChangeDependencies方法,这个方法在两种情况下会调用:调用initState会调用;从其他对象中依赖一些数据发生改变时,比如前面我们提到的InheritedWidget. Flutter执行build方法,来看一下我们当前的Widget需要渲染哪些Widget;- 当前的
Widget不再使用时,会调用dispose进行销毁; - 手动调用
setState方法,会根据最新的状态(数据)来重新调用build方法,构建对应的Widgets; - 执行
didUpdateWidget方法是在当父Widget触发重建(rebuild)时,系统会调用didUpdateWidget方法; - 复杂版标记(具体看源码去吧):
mounted是State内部设置的一个属性;dirty state是element的一个属性,标记强制调用build来构建widget;clean state当前build出来的Widget,下一次重绘检查时不需要重新build。
- 执行
4.buildContext是什么
其实buildContext 就是就是一个抽象类,其中有两个方法,一个是返回一个widget,一个是返回buildOwner。一切皆widget,我们通过构建嵌套widget来编写UI界面,但是widget并不是真正显示在屏幕上的东西,他只是配置信息而已。他总是不可变的,并且可在多处复用的。那真正显示在视图上的是什么呢,那就是视图树 element tree。
- 我们在
build函数中所使用的context,其实可以理解为当前widget所创建的Element对象。 StatelessWidget: 继承widget, 里面一个重写方法createElement返回StatelessElement。将这个StatelesseElement对象挂载到element树上。StatelessElement继承ComponentElement,里面有build方法 , 传入this将element自身作为BuildContext传入。ComponentElement继承Element,BuildContext接口用于阻止对Element对象的直接操作。StatefulWidget:首先同样也是调用StatefulWidget的createElement方法,并根据这个widget生成StatefulElement对象,并保留widget引用。将这个StatefulElement挂载到Element树上。根据widget的createState方法创建State。StatefulElement对象调用state的build方法,并将element自身作为BuildContext传入。
5.Flutter三棵树(渲染流程)
5.1 Widget
- Widget就是一个个描述文件,这些描述文件在我们进行状态改变时会不断的build。框架会和之前的描述进行对比,使用最小的开销来更新渲染界面。
5.2 Element
- Element是一个Widget的实例在树中详细的位置
- Widget描述和配置子树的样子,而Element实际去配置在Element树中特定的位置。
5.3 RenderObject
- 渲染树上的一个对象
- RenderObject层是渲染库的核心