|
|
@@ -0,0 +1,44 @@
|
|
|
+# flutter 组件(widget)概念
|
|
|
+
|
|
|
+`#d 来源`
|
|
|
+Flutter 从 React 中吸取灵感，通过现代化框架创建出精美的组件。
|
|
|
+
|
|
|
+`#d 描述UI`
|
|
|
+它的核心思想是用 widget 来构建你的 UI 界面。
|
|
|
+Widget 描述了在当前的配置和状态下视图所应该呈现的样子。
|
|
|
+当 widget 的状态改变时，它会重新构建其描述（展示的 UI），框架则会对比前后变化的不同，
|
|
|
+以确定底层渲染树从一个状态转换到下一个状态所需的最小更改。
|
|
|
+
|
|
|
+`#d 组件分类`
|
|
|
+组件分为有状态组件与无状态组件
|
|
|
+
|
|
|
+## 无状态组件 `StatelessWidget`
|
|
|
+`#e 理解`
|
|
|
+无状态组件应该是flutter中最基础的元素,有状态组件也是基于某种语法糖来自动更新无状态组件来实现状态更新的功能
|
|
|
+
|
|
|
+`#d 无状态组件`
|
|
|
+无状态组件需要 build 后进行使用,不会根据因为值的更新而自动更新ui. 组件的变量最终为不可变的值
|
|
|
+
|
|
|
+`#d 无状态组件参数`
|
|
|
+无状态 widget 接收的参数来自于它的父 widget，它们储存在 final 成员变量中。
|
|
|
+当 widget 需要被 build() 时，就是用这些存储的变量为创建的 widget 生成新的参数。
|
|
|
+
|
|
|
+## 有状态组件 `StatefulWidget`
|
|
|
+`#d 有状态组件作用`
|
|
|
+有状态组件可以根据变量数值的变化来自动更新UI界面所显示的内容.
|
|
|
+
|
|
|
+`#d 有状态组件构成`
|
|
|
+有状态组件所需要创建的两个类( `state` 和 `statefulWidget` ) 的作用
|
|
|
+分别是用来存储记录变量值的变化,以及构建出最终的组件作为组件(widget)树的一部分
|
|
|
+
|
|
|
+### statefulWidget
|
|
|
+`#d 作用`
|
|
|
+作为 widget 树的一部分,返回 state 中可根据状态自动更新的组件
|
|
|
+
|
|
|
+`#e 使用方式`
|
|
|
+
|
|
|
+### state
|
|
|
+`#d 组件的状态`
|
|
|
+`state` 类用来存放[有状态组件]()中的变量,其中的变量(状态)在更新数据时会触发组件的更新.从而实现UI界面的更新
|
|
|
+
|
|
|
+
|
