一、flutter是google推出的一个跨平台ui框架
1、支持ios和android的release版本已经出了
官方主页:https://flutter.dev/
github:https://github.com/flutter/flutter
2、 mac,linux,windows,Fuchsia操作系统的桌面版也有一个项目支持
目前还在测试阶段
github:https://github.com/google/flutter-desktop-embedding
3、 对于web，google也推出了一个实验性项目:Hummingbird 目前还没有开源
二、flutter为移动平台上的编译
1、下载sdk,并配置ide https://flutterchina.club/get-started/install/
2、编译一个Android平台的apk
3、编译ios平台，您需要安装xcode
然后再打开ios项目中的. xcodeproj文件，编译之后，之后的调试可以在android studio或者vs code里进行。
三、flutter为mac平台编译
1、下载https://github.com/google/flutter-desktop-embedding
2、下载https://github.com/flutter/flutter
3、配置flutter环境变量(flutter和flutter-desktop-embedding要在同一目录)
按照这个操作一下https://github.com/google/flutter-desktop-embedding/tree/master/library
4、添加flutter的china支持的环境变量
PUB_HOSTED_URL=https://pub.flutter-io.cn
FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn并
5、修改flutter\packages\flutter_tools\gradle\flutter.gradle改为1
2
3
4
5
6
7
8
9
10 buildscript {
repositories {
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.2.1'
}
}
6、执行flutter doctor
7、然后用xcode打开flutter-desktop-embedding/example/macos_fde/ExampleEmbedder.xcodeproj运行会自动下载依赖
四、flutter为windows平台编译（目前编译出的可执行文件只支持64位操作系统）
1、需要安装windows7 sp1及以上的64位操作系统(原生镜像安装，不要使用ghost安装)，推荐使用windows10
2、安装.net framework4.7.2 dev
3、安装git
4、安装virtual studio 20171
2
3
4
5
6
7
8选中左边<使用c++的桌面开发>
选中右边<windows8.1 sdk和ucrt sdk>
选中右边<用于x86和x64的virtual c++ MFC>
选中右边<windows 10sdk 10.0.17134.0>
选中左边<virtual studio扩展开发>
选中左边<通用windows平台开发>
选中右边<C++通用windows平台工具>
1 | 点击单个组件 |
5、新建一个文件夹1
2
3cmd进入
git clone https://github.com/flutter/flutter.git
git clone https://github.com/google/flutter-desktop-embedding.git
6、下载ninja并配置环境变量
7、下载gn并配置环境变量
8、安装python并配置环境变量
9、配置flutter环境变量
10、添加flutter的china支持的环境变量1
2PUB_HOSTED_URL=https://pub.flutter-io.cn
FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
11、修改flutter\packages\flutter_tools\gradle\flutter.gradle改为1
2
3
4
5
6
7
8
9
10 buildscript {
repositories {
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.2.1'
}
}
12、执行flutter doctor <下载dart及更新flutter插件>
13、进入flutter-desktop-embedding1
运行tools\run_dart_tool.bat fetch_jsoncpp third_party\jsoncpp\src
14、如果要编译出能在其他windows电脑运行的项目，需要静态编译项目，由于当前工程是依赖glfw(一个opengl的封装库)的，所以我们要静态编译glfw
<1> 下载glfw源码 https://www.glfw.org/
<2> 下载cmake
<3> 用cmake打开glfw源码库，设置目标位置为glfw/build
<4> 先configure 选择optional platform为x64
<5> 再执行generate
<6> 用virtual studio打开build目录的glfw.sln文件
<7> 右键点击解决方案下的GLFW3中的glfw，选择属性
1 | 配置属性 > 常规 > MFC的使用 选择 使用在静态库中使用MFC |
<8> 右键选择glfw然后选择生成
<9> 修改flutter-desktop-embedding\tools\dart_tools\bin\fetch_glfw.dart把main函数里面全部注释掉
<10> 修改flutter-desktop-embedding\build\win\toolchain\BUILD.gn把里面的/MDd改为/MTd(有两个地方哦)
<11> 在flutter-desktop-embedding目录下运行1
2tools\gn_dart gen out
ninja -C out flutter_embedder
<12> 在运行中，只要生成了flutter-desktop-embedding\out\gen\glfw\GLFW文件夹后，就把之前编译好的的文件(build/src/Debug/glfw3.lib)和(include/GLFW/里的文件)拷贝到flutter-desktop-embedding\out\gen\glfw\GLFW中
15、打开flutter-desktop-embedding\example\windows_fde\Example Embedder.sln
16、右键解决方案下的项目，点击属性1
2配置属性 > 常规 > MFC的使用 选择 使用在静态库中使用MFC
c/c++ > 代码生成 > 运行库 选择 多线程调试(/MTd)
17、hosts配置s3.amazonaws.com
18、在flutter-desktop-embedding\example下运行flutter packages get获取依赖包
19、在virtual studio中选择debug，然后点击生成，这个时候就会在flutter-desktop-embedding\example\build\windows_fde\x64\Debug\GLFW Example下生成可执行文件及资源文件，用winrar打包成exe，拷贝到别的电脑上就可以执行运行了