工作需要,因客户端有部分页面要使用flutter编写,需要QA了解一下flutter相关知识,因此,做了flutter调研,包含安装,基础知识与demo编写,第一部分是安装与环境配置。

——

在mac上实现flutter的从安装到运行,以下基于Android Studio,xcode相关设置后续补充

1、首先,国内访问flutter有时会有限制,以防万一,使用镜像

将以下环境变量添加到用户环境变量里
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

2、官网下载flutter安装包

https://flutter.dev/docs/development/tools/sdk/releases?tab=macos#macos
选择稳定版Stable channel,下载后解压到你想安装的目录里,如:
cd ~/development
unzip ~/Downloads/flutter_macos_v0.5.1-beta.zip
临时添加到flutter到path中
export PATH=`pwd`/flutter/bin:$PATH

3、终端执行 flutter doctor

(提示command not fount 的话:1不在flutter文件夹所在目录下2未设置PATH环境变量)
根据指示查看当前是否有缺失
安卓需要安装androif Studio,IOS需要安装xcode
如果提示Android licenses 不被信任或者unkown,按照提示执行
flutter doctor –android-licenses ;然后对提示回复y
(如果licenses提示有问题的话,这一步必须要通过必须要执行,否则会导致后面程序无法执行)

 

4、IDE添加插件

Preferences-plugins添加Flutter和Dart插件

 

5、如果没有安装gradle需要安装gradle

 

安装连接 http://www.androiddevtools.cn/ 
在Android开发工具中,可以下载gradle。然后在电脑Application目录中,找到Android Studio.app右键查看包文件,找到Content/gradle目录将刚刚下载解压后的gradle文件copy到该目录中。
之后在终端输入 vi ~/.zshrc,打开后输入:
GRADLE_HOME=/Applications/Android\ Studio.app/Contents/gradle/gradle-4.1;
export GRADLE_HOME
export PATH=PATH: :GRADLE_HOME/bin
注意:配置中Android Studio.app中要加一个 \ 转义,不然也会报错
保存退出后输入:source ~/.zshrc 使配置生效
然后在终端输入 gradle -version检查是否安装成功


6、创建Flutter应用

选择 File>New Flutter Project 。
选择 Flutter application 作为 project 类型, 然后点击 Next。
输入项目名称 (如 myapp),然后点击 Next。
点击 Finish。
等待Android Studio安装SDK并创建项目。

mac连接手机成功后,点击debug,正常来说就能看到启动的应用程序了

7、FAQ

然而实际上并不一定能正常。。。

1)如果运行失败提示,
Finished with error: Please review your Gradle project setup in the android/ folder.
可能性1,翻墙
第一步:修改掉项目下的android目录下的build.gradle文件,把google() 和 jcenter()这两行去掉。改为阿里的链接。

 

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

第二步:修改Flutter SDK包下的flutter.gradle文件,这个目录要根据你的SDK存放的位置有所变化
flutter.gradle文件中repositories中是google() 和 jcenter(),
repositories{
google()
gcenter()
}
把google() 和 jcenter()这两行注释掉,改为阿里的链接。

buildscript {
repositories {
//jcenter()
//maven {
// url 'https://dl.google.com/dl/android/maven2'
//}
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'
}
}

可能性2:如果更改后还是提示这个错误,检查下是否下载并成功安装gradle,没有的话重新安装下

 

2)执行时,如果一直卡在Flutter Resolving dependencies…
项目下的android目录下的build.gradle文件以及Flutter SDK包下的flutter.gradle文件
classpath ‘com.android.tools.build:gradle:3.0.1’
最后的版本号和gradle的版本号要一致否则无法运行,大概在这个位置
C:\Program Files\Android\Android Studio\gradle\m2repository\com\android\tools\build\gradle

 

3)
Minimum supported Gradle version is 5.1.1. Current version is 4.10.2. If using the gradle wrapper, try editing the distributionUrl in /Users/wenfangzhu/AndroidStudioProjects/flutter_app/android/gradle/wrapper/gradle-wrapper.properties to gradle-5.1.1-all.zip
这个提示是所指示的位置的配置不对,应该改成5.1.1

 

版权声明:本文为zhuwf原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://www.cnblogs.com/zhuwf/p/12390089.html