草庐IT

Flutter PC开发体验

jiaming_ 2023-03-28 原文

前言

Flutter 3 完成了从以移动端为中心到多平台框架的路线图,提供了对 windows、macOS 和 Linux 桌面应用的支持,改进了很多支持,增加了新的生产力功能和性能改进特性等等。

好奇心驱使,抱着学习的心态,体验了下flutter版的桌面应用程序开发,在此分享下体验过程,以及一些遇到的坑。

本文涉及的开发内容主要在windows 10平台进行。

安装Flutter环境

注意在国内网络环境下需要进行一些额外的环境配置:>>在中国网络环境下使用 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 for Flutter 配置

  • 准备好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项目
> flutter create myapp
> cd myapp
  • 分析下项目目录结构
    image.png

    相对于移动端项目,在根目录下多了PC平台的文件夹,windows目录下,有windows运行所需的一些环境配置文件和依赖库。且windows目录大小为200MB。
    打开lib/main.dart,还是经典的计数器示例代码,没有额外的PC端适配代码。

运行Flutter for Windows

  • 在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

运行效果:


image.png

在编译约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文件

总结

  • 优势
    整体flutter 面向windows应用开发的流程比较友好,简洁,学习成本低,目前的生态强大,社区也很活跃,基础的应用开发应该只需要熟悉dart语言即可,类似于Electron只需要熟悉Js语言。

  • 劣势
    不足之处是原生方面的第三方插件目前较少,原生功能方面生态还有待完善。

  • 对比于Electron
    优于Electron的地方,就个人初步体验来看,首先可能是安装包的体积问题,这个Electron的硬伤在Flutter上基本不存在,Flutter的示例demo打出的安装包仅仅十几兆,相比于Electron示例demo打出的七八十兆安装包...,其次,可能是安全性方面,flutter的业务代码在打包后都被封装成链接库的形式,反编译需要有一定的技术基础,相比于electron生成的asar文件,可靠许多。
    另外,Flutter的一套代码几乎cover全平台也是Electron无法比拟的。

以上是个人的体验总结,欢迎大家评论区交流指正?。

PS:之前有使用Electron开发了一款Apk安装软件,已成为自己日常办公利器,欢迎移步阅读:使用Electron开发一款Apk安装器应用

有关Flutter PC开发体验的更多相关文章

  1. ruby - 使用 C 扩展开发 ruby​​gem 时,如何使用 Rspec 在本地进行测试? - 2

    我正在编写一个包含C扩展的gem。通常当我写一个gem时,我会遵循TDD的过程,我会写一个失败的规范,然后处理代码直到它通过,等等......在“ext/mygem/mygem.c”中我的C扩展和在gemspec的“扩展”中配置的有效extconf.rb,如何运行我的规范并仍然加载我的C扩展?当我更改C代码时,我需要采取哪些步骤来重新编译代码?这可能是个愚蠢的问题,但是从我的gem的开发源代码树中输入“bundleinstall”不会构建任何native扩展。当我手动运行rubyext/mygem/extconf.rb时,我确实得到了一个Makefile(在整个项目的根目录中),然后当

  2. Ruby Sinatra 配置用于生产和开发 - 2

    我已经在Sinatra上创建了应用程序,它代表了一个简单的API。我想在生产和开发上进行部署。我想在部署时选择,是开发还是生产,一些方法的逻辑应该改变,这取决于部署类型。是否有任何想法,如何完成以及解决此问题的一些示例。例子:我有代码get'/api/test'doreturn"Itisdev"end但是在部署到生产环境之后我想在运行/api/test之后看到ItisPROD如何实现? 最佳答案 根据SinatraDocumentation:EnvironmentscanbesetthroughtheRACK_ENVenvironm

  3. ruby - 是否可以覆盖 gemfile 进行本地开发? - 2

    我们的git存储库中目前有一个Gemfile。但是,有一个gem我只在我的环境中本地使用(我的团队不使用它)。为了使用它,我必须将它添加到我们的Gemfile中,但每次我checkout到我们的master/dev主分支时,由于与跟踪的gemfile冲突,我必须删除它。我想要的是类似Gemfile.local的东西,它将继承从Gemfile导入的gems,但也允许在那里导入新的gems以供使用只有我的机器。此文件将在.gitignore中被忽略。这可能吗? 最佳答案 设置BUNDLE_GEMFILE环境变量:BUNDLE_GEMFI

  4. ruby - 在 Windows 机器上使用 Ruby 进行开发是否会适得其反? - 2

    这似乎非常适得其反,因为太多的gem会在window上破裂。我一直在处理很多mysql和ruby​​-mysqlgem问题(gem本身发生段错误,一个名为UnixSocket的类显然在Windows机器上不能正常工作,等等)。我只是在浪费时间吗?我应该转向不同的脚本语言吗? 最佳答案 我在Windows上使用Ruby的经验很少,但是当我开始使用Ruby时,我是在Windows上,我的总体印象是它不是Windows原生系统。因此,在主要使用Windows多年之后,开始使用Ruby促使我切换回原来的系统Unix,这次是Linux。Rub

  5. ruby-on-rails - 在 Rails 开发环境中为 .ogv 文件设置 Mime 类型 - 2

    我正在玩HTML5视频并且在ERB中有以下片段:mp4视频从在我的开发环境中运行的服务器很好地流式传输到chrome。然而firefox显示带有海报图像的视频播放器,但带有一个大X。问题似乎是mongrel不确定ogv扩展的mime类型,并且只返回text/plain,如curl所示:$curl-Ihttp://0.0.0.0:3000/pr6.ogvHTTP/1.1200OKConnection:closeDate:Mon,19Apr201012:33:50GMTLast-Modified:Sun,18Apr201012:46:07GMTContent-Type:text/plain

  6. 世界前沿3D开发引擎HOOPS全面讲解——集3D数据读取、3D图形渲染、3D数据发布于一体的全新3D应用开发工具 - 2

    无论您是想搭建桌面端、WEB端或者移动端APP应用,HOOPSPlatform组件都可以为您提供弹性的3D集成架构,同时,由工业领域3D技术专家组成的HOOPS技术团队也能为您提供技术支持服务。如果您的客户期望有一种在多个平台(桌面/WEB/APP,而且某些客户端是“瘦”客户端)快速、方便地将数据接入到3D应用系统的解决方案,并且当访问数据时,在各个平台上的性能和用户体验保持一致,HOOPSPlatform将帮助您完成。利用HOOPSPlatform,您可以开发在任何环境下的3D基础应用架构。HOOPSPlatform可以帮您打造3D创新型产品,HOOPSSDK包含的技术有:快速且准确的CAD

  7. 【鸿蒙应用开发系列】- 获取系统设备信息以及版本API兼容调用方式 - 2

    在应用开发中,有时候我们需要获取系统的设备信息,用于数据上报和行为分析。那在鸿蒙系统中,我们应该怎么去获取设备的系统信息呢,比如说获取手机的系统版本号、手机的制造商、手机型号等数据。1、获取方式这里分为两种情况,一种是设备信息的获取,一种是系统信息的获取。1.1、获取设备信息获取设备信息,鸿蒙的SDK包为我们提供了DeviceInfo类,通过该类的一些静态方法,可以获取设备信息,DeviceInfo类的包路径为:ohos.system.DeviceInfo.具体的方法如下:ModifierandTypeMethodDescriptionstatic StringgetAbiList​()Obt

  8. 微信小程序开发入门与实战(Behaviors使用) - 2

    @作者:SYFStrive @博客首页:HomePage📜:微信小程序📌:个人社区(欢迎大佬们加入)👉:社区链接🔗📌:觉得文章不错可以点点关注👉:专栏连接🔗💃:感谢支持,学累了可以先看小段由小胖给大家带来的街舞👉微信小程序(🔥)目录自定义组件-behaviors    1、什么是behaviors    2、behaviors的工作方式    3、创建behavior    4、导入并使用behavior    5、behavior中所有可用的节点    6、同名字段的覆盖和组合规则总结最后自定义组件-behaviors    1、什么是behaviorsbehaviors是小程序中,用于实现

  9. ruby-on-rails - environment.rb 中设置的常量在开发模式中消失 - 2

    了解Rails缓存如何工作的人可以真正帮助我。这是嵌套在Rails::Initializer.runblock中的代码:config.after_initializedoSomeClass.const_set'SOME_CONST','SOME_VAL'end现在,如果我运行script/server并发出请求,一切都很好。然而,在我的Rails应用程序的第二个请求中,一切都因单元化常量错误而变得糟糕。在生产模式下,我可以成功发出第二个请求,这意味着常量仍然存在。我已通过将以上内容更改为以下内容来解决问题:config.after_initializedorequire'some_cl

  10. ruby - Rails 开发服务器、PDFKit 和多线程 - 2

    我有一个使用PDFKit呈现网页的pdf版本的Rails应用程序。我使用Thin作为开发服务器。问题是当我处于开发模式时。当我使用“bundleexecrailss”启动我的服务器并尝试呈现任何PDF时,整个过程会陷入僵局,因为当您呈现PDF时,会向服务器请求一些额外的资源,如图像和css,看起来只有一个线程.如何配置Rails开发服务器以运行多个工作线程?非常感谢。 最佳答案 我找到的最简单的解决方案是unicorn.geminstallunicorn创建一个unicorn.conf:worker_processes3然后使用它:

随机推荐