
Google在最近的I / O开发者大会上正式发布了Flutter3.0 stable,Flutter 3 完成了从以移动端为中心到多平台框架的路线图,提供了对 macOS 和 Linux 桌面应用的支持,改进了对 Firebase 的集成,增加了新的生产力功能和性能改进特性,此外还提供了对 Apple Silicon 的支持。
自认为自己也算半个PC应用程序开发者,抱着学习的心态,体验了一把flutter版的windows应用程序开发,个人体验后整体感觉入手友好,相比Electron应用更原生化一点。下面记录下过程。
- 首先配置flutter3开发环境,照着官方教程傻瓜式安装即可。
注意在国内网络环境下需要进行一些额外的环境配置:在中国网络环境下使用 Flutter | Flutter 中文文档 | Flutter 中文开发者网站
-
其次,阅读Flutter 桌面支持文档。
Flutter 桌面支持 | Flutter 中文文档 | Flutter 中文开发者网站
可以看到flutter 2.1开始,已经较为稳定的支持windows平台了,3.0稳定版更是覆盖了当下主流的PC操作系统。
如果要构建特定平台的桌面程序,可以参看特定平台的额外要求。
这里举例Windows。 -
根据Windows的额外要求文档,可以看到,我们需要给电脑安装Visual Studio 2022,并在安装选项中选择「使用 C++ 的桌面开发」。
这点的配置和Electron应用开发环境配置不太一样,Electron只有在需要调用一些原生链接库时,才需要电脑支持VisulaStudio环境。
不过VS安装过程也已经简化到下一步下一步程度了。过程没遇到什么问题。
-准备好windows开发环境后,还需要让flutter支持创建windows模板项目
# 使用下面命令打开平台支持
> flutter config --enable-windows-desktop
# 使用下面命令关闭某个平台支持
> flutter config --no-enable-windows
上面命令即可打开flutter windows开发之路,对应的将windows改成macos、linux也可以打开对应开发配置,不过同一操作系统只能支持同系统应用开发。
- 检查是否已经支持windows环境
> flutter devices
可以看到,已经显示windows设备了。
C:\Users\zhujm>flutter devices
Flutter assets will be downloaded from https://storage.flutter-io.cn. Make sure you trust this source!
3 connected devices:
Windows (desktop) • windows • windows-x64 • Microsoft Windows [版本 10.0.19044.1706]
Chrome (web) • chrome • web-javascript • Google Chrome 101.0.4951.67
Edge (web) • edge • web-javascript • Microsoft Edge 101.0.1210.39
-创建一个flutter项目
> flutter create myapp
> cd myapp
-
分析下项目结构目录
image.png
相对于移动端项目,在根目录下多了PC平台的文件夹,windows目录下,有windows运行所需的一些环境配置文件和依赖库。且windows目录大小为200MB。
打开lib/main.dart,还是经典的计数器示例代码。 -
在windows平台运行工程
第一次在自己电脑上运行flutter pc项目,记得打开windows的开发者模式,否则会报错
Please enable Developer Mode in your system settings.
,打开方式见这里:flutter windows开发报错Please enable Developer Mode in your system settings.
> flutter run -d windows
运行效果

在编译约30s后,程序界面便运行出来了,支持热重载,默认横屏效果,如果是移动端迁移项目估计要做横屏适配了。
在第一次运行flutter pub add时,命令行有报错
Bad UTF-8 encoding (U+FFFD; REPLACEMENT CHARACTER) found while decoding string
,如果有小伙伴遇到这个问题,可以参看flutter 运行windows项目时报错 Bad UTF-8 encoding (U+FFFD; REPLACEMENT CHARACTER)
-
根据应用开发三步走战略,接下来还需要研究下打包过程,根据以往的pc开发经验,pc打包还是比较复杂的。
一番打包折腾,最终打出了一个misx安装包,并且完美在windows电脑上运行起来。
具体打包过程:flutter windows项目打包初探 - 简书 (jianshu.com) -
安装目录分析
根目录
data目录
可以看到,flutter的业务逻辑相关代码,被封装成了app.so和一些dll文件
- 总结
整体fulutter 面向windows应用开发的流程比较友好,简洁,学习成本低,目前的生态强大,社区也很活跃,基础的应用开发应该只需要熟悉dart语言即可,类似于Electron只需要熟悉Js语言。
优于Electron的地方,就个人初步体验来看,首先可能是安装包的体积问题,这个Electron的硬伤在Flutter上基本不存在了,Flutter的示例demo打出的安装包仅仅十几兆,相比于Electron示例demo打出的七八十兆安装包...,其次,可能是安全性方面,flutter的业务代码在打包后都被封装成链接库的形式,反编译需要有一定的技术基础,相比于electron生成的asar文件,可靠许多。
网友评论