2019-04-26更新
flutter-desktop-embedding半个月前变成了Flutter引擎的一部分,官方开始支持PC平台开发。按照作者本人说法flutter-desktop-embedding项目现在只是构建使用这些库的应用程序的一个示例和测试环境。
简介
本文主要介绍如何使用flutter-desktop-embedding将flutter项目运行在Windows平台上。
注意
- 本文默认用户已经配置好flutter开发环境
- 当前(2019-03)该项目仅推荐尝鲜,许多桌面开发功能尚未提供,且该项目不是谷歌官方支持的。
- 在运行自己项目前,推荐先使用flutter-desktop-embedding下example项目来测试环境,example运行成功后,可以把自己的项目代码粘贴到example项目中,来运行自己的flutter项目。
所需工具下载地址(Windows平台)
- flutter需要更新到最新版本
- 下载flutter-desktop-embedding 将该项目和之前的flutter放置在同一级文件夹下。
<parent dir>
├─ flutter (from https://github.com/flutter/flutter)
└─ flutter-desktop-embedding (from https://github.com/google/flutter-desktop-embedding)
复制代码
- Visual Studio 2017(低于该版本可能出现问题)
- ninja
- gn
Visual Studio 2017安装
- 安装时勾选
- 工作负载-使用C++桌面开发
- 单个组件-用于桌面 C++ [x86 和 x64]的 Windows 10 SDK,此时ide会自动勾选另外两个,记住勾选的sdk版本号,后面会用到
- 安装位置修改(可选)
- 环境变量配置 Visual Studio命令行构建工具,例如vcvars64.bat必须包含在环境变量Path中。该路径一般为
C:\Program Files (x86)\Microsoft Visual Studio\2017\Community\VC\Auxiliary\Build
复制代码
或者
<Visual Studio Install Path>\2017\<Version>\VC\Auxiliary\Build
复制代码
具体配置可参考gn安装。
ninja安装
1.安装包管理工具Chocolatey,可以用cmd也可以用PowerShell,这里使用PoserShell安装。
注意,需要以管理员身份运行PowerShell。 在命令行粘贴一下命令。
Set-ExecutionPolicy Bypass -Scope Process -Force; iex ((New-Object System.Net.WebClient).Downloa
dString('https://chocolatey.org/install.ps1'))
复制代码
安装成功后输入choco即可看到版本信息
2.使用choco安装ninja
choco install ninja --version 1.9.0
复制代码
3. 输入ninja -h,测试是否安装成功
gn安装
将解压后名字叫gn的应用程序所在路径添加到系统变量PATH中
添加完成后,在命令行输入gn help可以看到帮助信息即配置成功。
jsoncpp下载
jsoncpp必须被下载到third_party/jsoncpp\src,可以使用tools/dart_tools/bin/fetch_jsoncpp.dart来简化该步骤。
> tools\run_dart_tool.bat fetch_jsoncpp third_party\jsoncpp\src
复制代码
构建library
$ tools\gn_dart gen out
$ ninja -C out flutter_embedder
复制代码
提示:第二步运行时需要从googleapis下载,经常会报错,出错后Ctrl+C关闭进程,检查"网络"后重新输入第二句指令,继续下载。下载成功后运行情况如下;
用VS2017打开demo
demo所在位置: flutter-desktop-embedding\example\windows_fde 双击GLFW Example.vcxproj,用VS2017打开该文件。 打开后,点击"生成"-"生成解决方案",此时可能会报错
E1696 无法打开源文件"windows.h"
E1696 无法打开源文件"stddef.h"
...
复制代码
在vs右侧有一个解决方案管理器,右击该项目(GLFW Example),选择属性,"配置属性"-"常规"-"Windows SDK版本"选择我们在VS最开始安装时勾选的版本号,点击应用即可。
点击"生成"-"重新生成解决方案",在控制台中可以看到生成的exe路径。
双击生成的exe,运行成功!
运行自己的flutter项目
因为这个example项目已经配置好了平台支持,最简单的方法就是将自己项目的代码、pubspe.yaml、资源等添加到example中,之后在vs中重新生成即可运行。
注意: 因为flutter目前还不支持识别到windows平台,需要在main.dart中添加
import 'package:flutter/foundation.dart'
...
debugDefaultTargetPlatformOverride = TargetPlatform.fuchsia;
复制代码
具体可以参考example中的写法。