在 Google 的 Flutter 团队里面，有人是写 HTML5 规范的，所以使用 Flutter 开发移动应用的时候，你会发现有很多概念是从 Web 那里借鉴过来的。也就是如果你在学习 Flutter 之前，能懂一点 Web 相关的知识会有很大的帮助，比如 CSS 的 Flebox 模型，React.js 框架等等。不过一切都从头开始也是没有任何问题的。
开始学习任何一种框架，理解这套框架提供的工具，方法，思路是非常关键的。就是你要熟悉它的工作方式，了解它的脾气。对我来说最有效的方法，就是从一些细小的地方开始动手练习，一点一点的去理解它。这些细小的，简单的练习，练到一定程度的时候，一开始看上去分散的点就会连成一片，这时会有一种开窍的感觉。
首先要明白的是 Flutter 是基于 Dart 语言写的，可以理解成是一套用 Dart 语言写的可以开发移动应用的框架。我们可以不用先去学习 Dart 语言本身，在学习 Flutter 的过程中可以慢慢理解这门语言。它就像是一种加了类型系统的 JavaScript 语言，也就是如果你能明白 JavaScript 的基础，再了解点 TypeScript，开始学习 Flutter 就会更容易一些。
先准备好 Flutter 的开发环境。下面我们通过一个简单的练习来理解一下这个移动应用开发框架，你可以订阅宁皓网，在线观看视频版的 Flutter 课程，最近一段时间每周都会有更新。
在界面上显示 hello
打开 lib/main.dart，清空里面的代码，然后手工敲入下面这几行代码：
import 'package:flutter/material.dart';
void main() {
runApp(
Center(
child: Text(
'hello',
textDirection: TextDirection.ltr,
style: TextStyle(
fontSize: 32.0,
color: Colors.yellow,
),
),
)
);
}保存文件， 运行编辑器的调试（F5），你会在屏幕中间应该会看到一个 hello 字样（暂时还不能使用热加载功能）。
包
lib/main.dart 这个文件是应用的入口文件，文件的一开始我们用 import 导入了一个叫 flutter 的包里面的 material.dart，它里面包含了一些 material 风格应用需要的东西。material 本身是 Google 的一套设计系统，在 Flutter 应用里深度集成了这套设计系统，提供了很多可以使用的 material 风格的界面小部件。导入的这个包来自安装在系统上的 Flutter SDK，我们也可以额外再去安装一些社区提供的包。不同包都提供了各自的一些功能。
根
编译应用的时候，Flutter 会找 main.dart 文件里的 main 这个函数，在这个函数里用了一个 runApp ，里面是应用的 Root Widget，也就是根部件。在 Flutter 应用里面，很多东西都被称为 Widget（小部件），小部件有不同的类型，一个小部件里面可以包含另一个小部件，另一个小部件下面又包含了其它的一些小部件，这就组成了一个 Widget 大树，树的根要交告诉 runApp 。
在 main 函数前面有个 void，这个东西表示的是函数返回的值的类型，void 表示的是空，啥也没有，也就说明 main 这个函数不返回值。
Widget
我们把一个叫 Center 的小部件交给它了 runApp，让它作为应用的根部件 .. Center 这个部件的作用就是让它的子部件居中显示。在部件里面有一些属性还有方法，child 属性的值一般就是部件包装的子部件，属性的值只能是一个部件。有些部件可以有多个孩子，这种部件里有个 children 属性，对应的值是一组小部件（小部件的一群孩子们）。
Center 里面只能用 child 属性，说明它只能有一个孩子。这个子部件我们用了一个叫 Text 的小部件，它可以用来显示文字。第一个参数是要显示的文字，然后又设置了 textDirection 的值，表示的是文字的方向，对应的值是 TextDirection.ltr，表示文字是从左向右阅读的（Left to right）。按住鼠标，点击编辑器上的 TextDirection，可以打开定义它的地方，你会发现，这个东西是一个 enum 类型的数据。
flutter/bin/cache/pkg/sky_engine/lib/ui/text.dart
enum TextDirection {
/// The text flows from right to left (e.g. Arabic, Hebrew).
rtl,
/// The text flows from left to right (e.g., English, French).
ltr,
}样式
设置文字的样式，添加了一个 style 属性，它的值是个 TextStyle，它里面提供的一些属性可以设置文字的样式。我们用了一个 fontSize（字号），值是 32.0，在 Flutter 应用里面，很多数字值一般都是 double 类型的（双精度浮点型），所以这里得用 32.0，而不能直接使用整数 32。另外们还设置了 color（颜色） 属性，它的值是文字的颜色，这个颜色的值用了 Colors.yellow，这是应用里内置的一套调色板里的一种颜色。这套颜色属于 Material 设计系统。
