写这个就是为了巩固，顺便以后来查。
配置开发环境，按照网上的教程配置基本上都有坑，我就不写了（我到处踩坑，都不知道这环境到底是怎么配置成功的。反正它就是成功了）
先贴代码，后面逐行进行解释
目录
正文开始
import 'package:flutter/material.dart';
void main() => runApp(App());
class App extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: '我的第一个Flutter APP',
home: HomePage(title: '首页',),
);
}
}
class HomePage extends StatefulWidget {
const HomePage({Key key, this.title}) : super(key: key); //构造函数
final String title;
@override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Text("This is a Text Widget !!"),
)
);
}
}好，代码也贴了。我先说明一下，初次接触Flutter难免有不足的地方，后续再补（嘿嘿，我就当公开的私人博文了)。
import 'package:flutter/material.dart';第一行中的 import '*' 是dart语法中的导入外部包。
其中 package:flutter/material.dart 是Material Design(质感设计，后简称MD)风格，了解过Android的应该都不陌生吧。
void main() => runApp(App());main() 函数(方法)，知道编程都不会陌生，这个就是程序的主入口。
Flutter 中执行也是从这里开始的。
=> 而这个符号是dart中的单行函数(方法)，注意：这是一条有返回值的单行函数（方法）。
上式也可以写成
void main(){
return runApp(App());
}诶，很奇怪是不是？返回值是 void 怎么还能return呢？其实dart任何函数(方法)都有返回值 除非你将它指定为void（但是main好像不遵循这个规则，我也是太了解，有知道的大佬可以给我解释下，嘿嘿。），就算你是写成这样
main(){
return runApp(App());
}它还是能够运行。好吧，我们来测试一个方法。
好了，这是dart的语法规则，我只是粗略提一下，
runApp() 函数(方法)，这是App的开始方法，dart 执行了main函数碰到它了怎么办？
没办法，执行它呗。（注意：main()函数并没有执行完哦，这时候还在执行runApp()呢！）
StatelessWidget
class App extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: '我的第一个Flutter APP',
home: HomePage(title: '首页',),
);
}
}上面的代码就是定义一个类。现在来说一下，Flutter常用的两种形态（毕竟我也没深入了解，想要深入了解框架可以看这篇阿里巴巴Flutter技术全解析）
但是，Flutter中一切皆Widget！
这句话很重要哦！
StatelessWidget 无状态的组件（本人理解：不可变的，静态的）
何为静态的页面?
静态：不可变的，最终的。
也就是说，该Widget一经绘制将不可变。
哎呀，StatelessWidget好像就这样了！
对了，好像还没解释代码……（小尴尬）。
那么 build(BuildContext context) 这个函数(方法)是干嘛的呢？
这个牵扯得就有点深入了……(所以，我们就先不讲，先会用就行了)
但是这个方法是必须要写的，否则会报错哦。
至于用法，就只要知道它是构建并返回一个Widget。
然而接下来这段就是App的框架了。
return MaterialApp(
title: '我的第一个Flutter APP',
home: HomePage(title: '首页',),
);这些参数什么的下一篇文章再细说(我都写了一部分了，发现太乱了，又给删掉了。)
StatefulWidget
class HomePage extends StatefulWidget {
const HomePage({Key key, this.title}) : super(key: key); //构造函数
final String title;
@override
_HomePageState createState() => _HomePageState();
}代码贴了，接下来说一下StatefulWidget。
StatefulWidget 有状态的组件(本人理解：可变的，能够实时变化的)
const HomePage({Key key, this.title}) : super(key: key); //构造函数dart中的构造函数(方法)很简单，固定写法就是这样。
HomePage({Key key, this.title}) 来看下参数。
{可选参数1，可选参数2}
如上说述，{}中的是可选参数，何为可选？
也就是，你可以给某个指定的参数赋值。
如下（Text() 是Flutter中的一个Widget）：
const Text(this.data, {
Key key,
this.style,
this.strutStyle,
this.textAlign,
this.textDirection,
this.locale,
this.softWrap,
this.overflow,
this.textScaleFactor,
this.maxLines,
this.semanticsLabel,
})data是必写参数，然后接下来的一切都是可选写的参数。
举个例子：
必写参数没有写，所以会报错。
只写一个必写参数，Ok。
写一个必写参数，写一个可选参数，Ok。
相信你也发现了，除了必写参数之外，其他的都要指定。
比如TextAlign参数（每个参数由逗号隔开，函数(方法)传值知道吧。）
textAlign: TextAlign.left,好，可选参数暂时告一段落，我们回到StatefulWidget
class HomePage extends StatefulWidget {
const HomePage({Key key, this.title}) : super(key: key); //构造函数
final String title;
@override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Text(
"This is a TextWidget!!",
textAlign: TextAlign.left,
),
));
}
}上面这段代码其实是固定写法，写一个Statefulwidget创建返回一个继承至State的泛型，然后在State中的build中写返回的控件。
（dart中没有类似于java的private，在变量(函数)前面添加一个下划线就表示该变量(函数)为私有的 _HomePageState 就是一个私有类）
Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Text(
"This is a TextWidget!!",
textAlign: TextAlign.left,
),
));脚手架，这是Flutter提供的通用App框架，其中包含了一般应用应有的布局(后面再作详解)。
最后贴一张图
