Flutter(二) 第一个 Flutter APP

在需要创建的目录下 名称不能大写

flutter create flutterapp

前提：环境变量一定要提前配置好

命令行 export PATH="$PWD/flutter/bin:$PATH"

基本原理

使用Flutter框架必须要导入flutter/material.dart包，然后在main()函数中调用runApp函数，这样就可以启动一个Flutter应用。访问《Flutter框架基础》了解更多内容。

举个例子：每个 .dart文件必须由以下内容开头import 'package:flutter/material.dart';

import 'package:flutter/material.dart';

void main() => runApp(new MyApp());
//以上语法是dart速写语法，完整形式如下
void main() {
  return runApp(new MyApp());
}

割==============================================

开始看项目

之前通过flutter create flutterapp命令在某一个文件夹下创建了flutterapp的项目
cd 到 flutterapp 文件夹下
ls查看目录下的文件夹

README.md   build       ios     pubspec.lock    test
android     flutterapp.iml  lib     pubspec.yaml

打开ios文件下的项目，运行，开发者信任和账号和boundle id问题就不多说了，运行成功，主要是为了查看真机能否运行。在纯flutter app开发中，修改代码并不需要xcode，但是会用到真机或者模拟器。

下载vs code，具体版本根据官网提示
https://flutterchina.club/get-started/editor/#vscode

安装 VS Code

• VS Code, 安装1.20.1或更高版本.

安装Flutter插件

1. 启动 VS Code
2. 调用 View>Command Palette…
3. 输入 ‘install’, 然后选择 Extensions: Install Extension action
4. 在搜索框输入 flutter , 在搜索结果列表中选择 ‘Flutter’, 然后点击 Install
5. 选择 ‘OK’ 重新启动 VS Code

开始写项目

用VS Code 打开刚才的flutterapp完整项目，将所有文件导入进来

主要看lib目录下的.dart文件

以main.dart为例
抹掉原文件数据,粘贴以下代码

// void main() => runApp(new MyApp());
//main()函数是Dart程序的入口，也就是说，Flutter程序在运行的时候，第一个执行的函数就是main()函数。
void mian() {
  //runApp函数就是Flutter框架的入口，如果不调用runApp函数，那你执行的就是一个Dart控制台应用
  runApp(new MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Welcome to Flutter',
      home: new Scaffold(
        appBar: new AppBar(
          title: new Text('Welcome to Flutter'),
        ),
        body: new Center(
          child: new Text('Hello World'),
        ),
      ),
    );
  }
}

代码详解参考
任意门 https://www.jianshu.com/p/213bfa3d40dd

点击Debug 菜单下的 Start Debugging，第一个app启动