从TodoList入门Flutter开发

前言

学习了近三周的 Flutter ，想着总结一下，但无奈 Flutter 知识点太多，从 Dart 语言到 Flutter 布局，基础Widget，列表，异步，网络编程及周边生态，有很多点可以细讲，以我现在的知识储备实在不想误人子弟，本文将会从一个Todolist小例子带你入门Flutter开发，而不是单纯的讲解API。

什么是Flutter

Flutter是一个由谷歌开发的开源移动应用软件开发工具包，用于为Android、iOS、Windows、Mac、Linux、Google Fuchsia开发应用。与 h5+混合开发（Uniapp）和JavaScript开发+原生渲染（React Navite）不一样，Flutter 的底层采用自绘UI＋原生的方式，它的性能，开发效率方面都完胜前两者，并且在商业上得到了很好的应用，如闲鱼、淘宝物价版，西瓜视频都采用了Flutter进行开发。

在Flutter当中，一切变量都是 Object，万物皆是 Widget（参考了React组件的设计思想）。

开发TodoList

本文不会教你如何搭建开发环境，如果你想搭建，Flutter官网 讲的更加详细，我们可以直接访问 dartpad 这个网站直接开发Flutter ，如果你有兴趣，可以打开这个网站跟着我一起敲敲代码。

基本结构

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Center(child: Text('Hello, World!')),
    );
  }
}

运行效果：
代码解析：

• import 'package:flutter/material.dart'; 是使用Flutter组件必须要引入的，里面包含了 Text, Image, Center等基础组件等等。
• main 函数是Flutter 的入口函数，它使用 runApp 运行了 MyAPP 这个weiget。
• 接下来我们定义了 MyApp 这个 weiget，重写了它的 build 方法，使用了 MaterialApp 这个入口 widget，定义了首页的样子。

MaterialApp还包含了title，routes等属性。

无状态StatelessWidget和有状态StatefulWidget

和React当中的有状态组件和无状态组件一样，有状态组件就是有单独的交互逻辑和业务数据，通过 setState 来更新&#