Flutter入门 从安装到运行(Windows)

Flutter安装

1. 下载Flutter解压包

   点我下载 然后解压到目录中 作者的目录是 D:\flutter

2. 配置环境变量

     PUB_HOSTED_URL=https://pub.flutter-io.cn
     FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
     PATH 新增 D:\\flutter\bin   # 换成你的解压目录 记得用;号分开
   复制代码

3. 安装依赖项 打开cmd/powershell 输入

    flutter doctor    
   复制代码

   稍等片刻 会出现如下显示

    继续输入命令:
    
    flutter doctor --android-licenses  # 出现提示 一直输入y
   复制代码

4. IDEA/Android Studio 安装插件

   • Flutter插件： 支持Flutter开发工作流 (运行、调试、热重载等).
   • Dart插件： 提供代码分析 (输入代码时进行验证、代码补全等).

5. 手机连接电脑 手机连接上电脑 打开开发者模式 开启USB调试 & 允许USB安装应用

运行第一个Flutter项目(IDEA)

1. 新创建个Flutter项目 选择好刚开始解压的flutter目录

   项目名称:hello_flutter
   新建完成

2. 修改gradle配置(gradle国内访问不了) D:\flutter\packages\flutter_tools\gradle\flutter.gradle 把google() 和 jcenter() 注释掉。下面添加

    maven { url 'https://maven.aliyun.com/repository/google' }
    maven { url 'https://maven.aliyun.com/repository/jcenter' }
    maven { url 'http://maven.aliyun.com/nexus/content/groups/public' }
   复制代码

   再打开当前项目文件夹/android/build.gradle文件 把google() 和 jcenter() 注释掉。(此文件下有两处都需要替换 buildscript下和allprojects下)下面添加

           maven { url 'https://maven.aliyun.com/repository/google' }
           maven { url 'https://maven.aliyun.com/repository/jcenter' }
           maven { url 'http://maven.aliyun.com/nexus/content/groups/public' }   
   复制代码

3. 修改gradle下载地址 下载gradle-4.10.2-all.zip 找到项目中的android->gradle->wrapper->: 把解压包放到此目录下 不要解压 修改同级目录下的文件:gradle-wrapper.properties 把distributionUrl修改为:

    distributionUrl=gradle-4.10.2-all.zip
   复制代码

4. 修改启动参数 (白屏问题)

5. 启动项目 点击右上角 启动按钮 出现如图

   此时手机上会弹出是否安装应用 安装应用后打开即可 效果图如下

   完成