Flutter入门教程

一、起源

Flutter在2018 世界移动大会发布第一个beta版本，这是谷歌发布的一套移动UI框架 ，可以快速在iOS和Android上构建高质量的原生用户界面。 能够做到一套代码两个终端运行。并且Flutter是完全免费、开源的。
Flutter组件采用现代响应式框架构建，这是从React中获得的灵感，中心思想是用组件(widget)构建你的UI。 组件描述了在给定其当前配置和状态时他们显示的样子。当组件状态改变，组件会重构它的描述(description)，Flutter会对比之前的描述， 以确定底层渲染树从当前状态转换到下一个状态所需要的最小更改。

二、语言

flutter 使用dart作为其开发语言。dart是谷歌开发的计算机编程语言，后来被Ecma (ECMA-408)认定为标准 。它被用于web、服务器、移动应用 和物联网等领域的开发。dart是面向对象的、类定义的、单继承的语言。它的语法类似C语言，可以转译为JavaScript，支持接口(interfaces)、混入(mixins)、抽象类(abstract classes)、具体化泛型(reified generics)、可选类型(optional typing)和sound type system。如果你没有过开发经验，不建议直接上手flutter。

三、flutter安装

了解完flutter的来源后，让我们开始安装flutter,首先根据你的系统，windows,macos，或者linux系统选择不同的flutter sdk下载安装，这里推荐flutter 中文网https://flutterchina.club，我以windows为例
1、使用镜像，将以下两个环境变量加入到用户环境变量中
PUB_HOSTED_URL https://pub.flutter-io.cn
FLUTTER_STORAGE_BASE_URL https://storage.flutter-io.cn
2、安装flutter sdk ，https://flutter.dev/docs/development/tools/sdk/releases#windows，建议选择稳定版本

3、下载完成后，将其解压到你想要的路径内。然后尝试运行flutter命令
要在终端全局运行 flutter 命令， 你需要添加以下环境变量到系统PATH：

转到 “控制面板>用户帐户>用户帐户>更改我的环境变量”
在“用户变量”下检查是否有名为“Path”的条目:
如果该条目存在, 追加 flutter\bin的全路径，使用 ; 作为分隔符.
如果条目不存在, 创建一个新用户变量 Path ，然后将 flutter\bin的全路径作为它的值.
在“用户变量”下检查是否有名为”PUB_HOSTED_URL”和”FLUTTER_STORAGE_BASE_URL”的条目，如果没有，也添加它们。
重启Windows以应用此更改
4、运行flutter doctor
打开一个新的命令提示符或PowerShell窗口并运行以下命令以查看是否需要安装任何依赖项来完成安装：

flutter doctor

将会提示以下信息

[-] Android toolchain - develop for Android devices
• Android SDK at D:\Android\sdk
✗ Android SDK is missing command line tools; download from https://goo.gl/XxQghQ
• Try re-installing or updating your Android SDK,
visit https://flutter.io/setup/#android-setup for detailed instructions.

四、编辑器

开发任何应用都需要编辑器，flutter提供了，IntelliJ IDEA，Android Studio和VS Code的插件，我现在Android Studio为例，如果你是一个android开发者，那这一步将会非常简单，若不是，请看以下步骤。
1、安装android Studio ,从官网下载最新版本 https://developer.android.google.cn/studio/
2、安装过程中，若有选择android SDK，请勾选，若无，我们可以手动下载sdk。

3、studio 安装成功后，需要安装两个插件 dart和flutter,在file->setting->plugins 中搜索这两个插件并进行安装。成功后，重启android studio
ps：手动安装sdk,打开android Studio->tools->sdk manager

点击下载按钮即可下载sdk

五、运行flutter demo

选择 File>New Flutter Project
选择 Flutter application 作为 project 类型, 然后点击 Next
输入项目名称 (如 myapp), 然后点击 Next
点击 Finish
等待Android Studio安装SDK并创建项目.
创建完成后。找到 lib/main.dart，这是项目主程序代码
在控制台输入 flutter doctor

这里我同时安装了vscode ,请忽略，现在提示没有发现设备，我们可以通过创建虚拟机或者使用真机调试
1、创建虚拟机 tools->AVD manager 创建一个虚拟机
2、真机调试 使用usb链接手机，打开手机的开发者模式，允许usb调试
再次运行flutter doctor，无问题后，运行flutter run ，应用将成功运行。
ps :两种方式只选一种即可。
flutter常用命令