零基础三分钟写一个Flutter App

这个教程是面向完全没有接触过Flutter开发，从0开始搭建Flutter开发环境到写第一个Flutter app的。 正常情况只需要半个小时就可以看到app。

中文资料官网：https://flutterchina.club/get-started/install/

英文原资料官网：https://flutter.io/get-started/install/

安装环境

sdk下载链接：https://storage.googleapis.com/flutter_infra/releases/beta/macos/flutter_macos_v0.5.1-beta.zip

如果你是墙内用户，估计要翻墙才能下载到sdk。

Flutter开发环境主要由两部分构成，一个是sdk，跟Android的sdk和 Java环境一样需要配置环境变量，另外一部分是IDEA/Android Studio的Flutter插件。 上面下载完sdk后解压缩，放到你习惯的位置，然后配置环境变量,以笔者mac环境为例

windows环境配置跟JAVA_HOME配置一样，放到 PATH 就可以。安装完sdk后可以用 flutter doctor检查依赖关系， 如果正常的话 flutter doctor会输出类似下面的结果

安装插件

Android Studio的flutter插件也很简单，需要两个依赖，一个是 Dart 语言插件，一个是 Flutter插件。 · 连续按3次shift然后搜 plugins，或者在 Preferences > Plugins(Mac) / File>Settings>Plugins(Win) 中打开插件配置 · 搜索 Dart 和 flutter 安装两个插件后按提示重启Studio就行。

第一个Flutter app

一切正常的话，在重启后的File选项中可以看到新建Flutter项目的选项，选上它之后跟新建普通Android app一样就行。 这里新建的Flutter HelloWorld 工程很简单，demo上的数字会随着按钮的点击自增。 main.dart 是主入口，代码比较简单，有看过之前小编关于 Flutter的介绍的文章应该能看明白。

class MyApp extends StatelessWidget
 
{// This widget is the root of your application.
  @override Widget build(BuildContext  context )
 {
    return new MaterialApp
( title:
 'Flutter Demo',
 theme:new ThemeData(primarySwatch:Colors.blue,),
home:new MyHomePage(title:'Flutter Demo Home Page'),);
  }
}
`

到此就完成第一个Flutter app了。目前Flutter相关的资料中英文都有，而且相当容易上手。 有兴趣的可以加群互相学习。

有兴趣交流学习的可以加入我们Android技术探讨的交流群哦：818520403 备注一下简书哦！群内有朋友们分享的各路面试经以及Android开发进阶等资料哦。

image