【Android】Flutter视图体系简介

一、摘要

Flutter是一种全新的响应式跨平台的移动开发框架，越来越多的开发者参与学习或者研究中，确实在iOS和Android平台上能够用一套代码构建出性能比较高的应用程序。Widget是Flutter应用程序用户界面的基本构建块。每个Widget都是用户界面一部分的不可变声明。与其他将试图、控制器、布局和其他属性分离的框架不同，Flutter具有一致的统一对象模型：Widget。在开发过程中也可以知道Widget可以被定义按钮(button)、样式(style)、填充(Padding)、布局(Row)、手势(GestureDetector)等

二、推广建议

Fultter适合快速迭代的产品，项目需要整合多台的需求

三、正文

1、widget

Flutter widgets是采取React思想使用响应式框架构建的。核心思想就是使用widgets构建出UI(界面)。Widgets根据其当前配置和状态描述了它们的视图。当某个widget的状态发生更改时，widget会重新构建所描述的视图，framework会根据前面所描述的视图(状态没改变时)进行区分，以确定底层呈现树从一个状态转换到下一个状态所需的最小更改步骤。
widget为element(下面再描述)提供配置信息，这里可以知道widget和element存在某种联系。Widgets在Flutter framework是中心类层次结构，widget是不可变的对象并且是界面的一部分，widget会被渲染在elements上，并(elelments)管理底层渲染树(render tree)，这里可以得到一个信息：widget在渲染的时候会最终转换成element.
Wigets本身是没有可变的状态(其所有的字段必须是final)。如果你想吧可变状态和一个widget关联起来，可以使用StatefulWidget，StatefulWidget通过使用StatefulWidget.createState方法创建State对象，并且扩充到element和合并到树中。那么这段可以得出的信息是：widget并不会直接渲染和管理状态，管理状态是交给State对象负责.给定的widget可以零次或者多次被包含在树中，一个给定的widget可以多次放置在树中，每次将一个widget放入树中，他都会被扩充到一个Element，这就意味着多次并入树中的widget将会多次扩充到对应的Element。这段可以这么理解：在一个界面中，有多个Text被挂载在视图树上，这些Text的widget会被填充进自己独立的Element中，就算widget被重复使用，还是会创建多个不同的element对象.
每一个widget都有自己的唯一的key，这里也很容易理解，就是借助key作为唯一标识符。这段话的意思是：key这个属性控制一个widget如何替换树中的另一个widget。如果两个widget的runtimeType和key属性相等==，则新的widget通过更新Element(通过新的widget来来调用Element.update)来替换旧的widget。否则，如果两个widget的runtimeType和key属性不相等，则旧的Element将从树中被移除，新的widget将被扩充到一个新的Element中，这个新的Element将被插入树中。这里可以得出：如果涉及到widget的移动或者删除操作前，会根据widget的runtime和key进行对比。

综上所述：

widget向Element提供配置信息(数据)，界面构造出来的widget树其实只是一颗配置信息树，为了构造出Element树。
Element和widget有对应关系，因为，element是通过widget来生成的。
同一个widget可以创建多个element，也就是一个widget对象可以对应多个element对象

@immutable
abstract class Widget extends DiagnosticableTree {
   
/// Initializes [key] for subclasses.
const Widget({
    this.key });

//省略注释
final Key key;

//构建出element
@protected
Element createElement();

//简短文字描述这个widget
@override
S