Flutter 第一个应用

首先需要IDE Android Studio 和 Vs Code

1. 安装并打开Android Studio，在设置中的Plugins中搜索安装Flutter和Dart插件
   Android Studio > Preferens... > Plugins 中搜索安装Flutter和Dart插件，安装成功后，重启Studio
   

   image.png

2. 使用Android Studio新建Flutter项目

   
   image.png
   image.png
   image.png
   image.png
   image.png
   

   Creating Flutter Project的过程十分的漫长，请耐心等待。如果超过5分钟，根据个人经验，可能页面卡死，其实flutter项目已经创建好了，可以到项目路径下查看。确定就直接强杀AS，然后重新打开，open项目

3. 直接运行！

   
   image.png
   

   运行Android模拟器会卡在Running Gradle task 'assembleDebug， 原因是因为Android模拟器需要使用Gradle， 而Gradle的Maven仓库在国外, 因此需要使用阿里云的镜像地址。修改镜像地址如下：

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' }

第一步修改Flutter项目中android/build.gradle文件

buildscript {
    repositories {
        //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' }
    }
​
    dependencies {
        classpath 'com.android.tools.build:gradle:3.1.2'
    }
}
allprojects {
    repositories {
        //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' }
    }
}

第二步找到flutter环境目录packages/flutter_tools/gradle/flutter.gradle文件

buildscript {
    repositories {
//        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' }
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:3.5.0'
    }
}

VS Code 配置

安装Flutter和Dart插件，命令面板输入 doctor 选择 Flutter: Run Flutter Doctor 查看输出信息。

image.png