Flutter 系列文章:初识Flutter

322 阅读2分钟
  • what is flutter

Flutter包括一个现代的响应式框架、一个2D渲染引擎、现成的widget和开发工具。这些组件可以帮助您快速地设计、构建、测试和调试应用程序

  • what is flutter widget

一. 一切皆为widget

Widget是Flutter应用程序用户界面的基本构建块。每个Widget都是用户界面的一部分。 它与其它将视图、控制器、布局和其他属性分离的框架不同,Flutter具有一致的统一对象模型:widget。

二. Widget 怎么定义

  • 一个结构元素(如按钮或菜单)
  • 一个文本样式元素(如字体或颜色方案)
  • 布局的一个方面(如填充) 等等… Widget根据布局形成一个层次结构。每个widget嵌入其中,并继承其父项的属性。没有单独的“应用程序”对象,相反,根widget扮演着这个角色。

您可以通过告诉框架使用另一个widget替换层次结构中的widget来响应事件,例如用户交互,替换后框架会比较新的和旧的widget,并高效地更新用户界面。

三. Widget 怎么分类

  • 按是widget是否需要根据用户交互或其他因素进行更改进行有状态跟无状态进行分类

1、有状态的widget-->StatefulWidget

如果widget需要根据用户交互或其他因素进行更改,则该widget是有状态的。例如,如果一个widget的计数器在用户点击一个按钮时递增,那么该计数器的值就是该widget的状态。 当该值发生变化时,需要重新构建widget以更新UI

2、无状态的widget-->StatelessWidget

如果widget不需要根据用户交互或其他因素进行更改,则该widget是无状态的
  • 按控件类型进行分类

1. 基础组件

2. Material Components

实现了Material Design 指南的视觉、效果、motion-rich的widget

3. Cupertino(iOS风格的widget)

用于当前iOS设计语言的美丽和高保真widget

4. Layout

排列其它widget的columns、rows、grids和其它的layouts

5. Text

文本显示和样式

6. Assets、图片、Icons

管理assets, 显示图片和Icon

7. Input

Material Components 和 Cupertino中获取用户输入的widget

8. 动画和Motion

在您的应用中使用动画。查看Flutter中的动画总览

9. 交互模型

响应触摸事件并将用户路由到不同的页面视图(View)

10. 样式

管理应用的主题,使应用能够响应式的适应屏幕尺寸或添加填充

11. 绘制和效果

Widget将视觉效果应用到其子组件,而不改变它们的布局、大小和位置

12. Async

Flutter应用的异步模型

13. 滚动

滚动一个拥有多个子组件的父组件

14. 辅助功能

给你的App添加辅助功能(这是一个正在进行的工作)