中文网:Flutter中文网
一、环境:
我使用的android stuido
1.下载插件:
2.下载Flutter Sdk
GitHub上搜Flutter 下载
SDK路径就是:D:\flutterSdk\flutter
3.studio直接创建Flutter项目就可以。Android studio导入别的flutter项目,直接open打开,不要import。
二、语言及相关Api
1.Dart语言(不懂Dart的最好找个文档学习下,因为和Java不一样,按java逻辑写会有坑、我也是在摸索学习~)
2.秉承Dart语言特点,真正的面向对象编程,万物皆对象,所有的数据都是对象。不论什么控件、方法。
3.每个ui widget 分为 StatelessWidget 和 StatefulWidget 。Flutter框架将依次构建这些widget,直到构建到最底层的子widget时,这些最低层的widget通常为“RenderObject”,它会计算并描述widget的几何形状。StatelessWidget :状态不变 , StatefulWidget :状态变(即会更新)
4.UI变化时, 必须执行方法setState(){}。StatefulWidget 必须 实现一个单独的State<>类。
5.初学flutter,总无法清楚每个控件的作用是啥,有时定义widget 会:new MaterialApp();有时是:new Scaffold();
MaterialApp : 为了继承主题数据,widget需要位于MaterialApp内才能正常显示, 因此我们使用MaterialApp来运行该应用,主要是各个Material风格控件的类。
其包括:Scaffold,Navigator,MaterialPageRoute,WidgetsApp。
从红框中可知:
Scaffold:主要用于appBar和Drawer的创建。
WidgertsApp:封装应用程序通常需要的许多小部件的便利类。WidgetsApp提供的主要角色之一是将系统back按钮绑定到弹出导航器或退出应用程序。
Navigator:是用于管理每个页面的堆栈类。
MaterialPageRoute:大意指用于定义每个页面相关Material,即 阴影,主题颜色,等视觉效果(具体未看)
6.widget常用基础类型树:
Flutter有一套丰富、强大的基础widget,其中以下是很常用的:
Text:该 widget 可让创建一个带格式的文本。
Row、 Column: 这些具有弹性空间的布局类Widget可让您在水平(Row)和垂直(Column)方向上创建灵活的布局。其设计是基于web开发中的Flexbox布局模型。
Stack: 取代线性布局 (译者语:和Android中的LinearLayout相似),Stack允许子 widget 堆叠, 你可以使用 Positioned 来定位他们相对于Stack的上下左右四条边的位置。Stacks是基于Web开发中的绝度定位(absolute positioning )布局模型设计的。
Container: Container 可让您创建矩形视觉元素。container 可以装饰为一个BoxDecoration, 如 background、一个边框、或者一个阴影。 Container 也可以具有边距(margins)、填充(padding)和应用于其大小的约束(constraints)。另外, Container可以使用矩阵在三维空间中对其进行变换。