Flutter 让桌面应用的开发更便捷

2022-04-11 18:37:02 浏览数 (1)

Flutter2稳定版的发布,除了web的支持外,还有对于桌面端的支持可以将Flutter源代码编译为本机Windows,macOS或Linux桌面应用程序。

为了更轻松地尝试对Flutter的桌面支持,官方在稳定频道上发布了Flutter桌面Beta的snapshot。这意味着您可以轻松地尝试桌面支持,而无需切换到Flutter beta通道。不过,稳定通道中包含的snapshot在下一个Flutter稳定发行版之前不会更新。如果想要最新版本的桌面支持,还是建议切换到Flutter beta频道。

更新Flutter

首先安装或升级到最新的版本,也可以通过FVM安装多个flutter SDK并切换

推荐使用fvm安装和管理,没有安装的可以参考:FVM 愉快的切换 Flutter 版本,强烈推荐!

这边已经安装好了fvm,上面图中可以看到本机安装有哪些flutter版本。 通过下面命令,安装beta版本

代码语言:javascript复制
fvm install beta

全局或项目内切换版本

代码语言:javascript复制
fvm use beta --force

因本机配置了fvm管理版本,所以默认在在flutter相关命令前添加上fvm ,如果你不是用fvm管理版本的,下面命令带有fvm,你可以去掉。

配置桌面平台

flutter config --enable-<platform>-desktop,通过该命令,配置启用你所需要的平台,其中 <platform> 是 windows, macos, 或者 linux。

代码语言:javascript复制
flutter config --enable-windows-desktop
flutter config --enable-macos-desktop
flutter config --enable-linux-desktop

对于编译桌面应用程序,需要注意,在Windows上构建Windows应用程序,在macOS上构建macOS应用程序以及在Linux上构建Linux应用程序。可以参考不同平台的要求:https://flutter.dev/desktop

这边用mac电脑来构建macos桌面应用。

执行命令

代码语言:javascript复制
fvm flutter config --enable-macos-desktop

为确保已启用,通过下面命令查看可用的设备

代码语言:javascript复制
fvm flutter devices

如图,当你看到macos设备,说明已经配置好了。启用桌面支持后,重新启动IDE。

查看flutter检测本机环境依赖

代码语言:javascript复制
flutter doctor

依赖ok后,可以开始创建项目了。

创建桌面项目

我们拉个新建个项目 mac_demo,使用用 Flutter beta 进行 macos桌面应用 开发:

代码语言:javascript复制
mkdir mac_demo
cd mac_demo
fvm use beta --force 
fvm flutter create .

依次执行上面的命令,你会看到项目目录内有macos文件夹。

如果你在上面命令中出现"xxx" is not a valid Dart package name.报错,意思你要换个名字,可以参考官网对于name的说明:https://dart.dev/tools/pub/pubspec#name

运行macos桌面应用

运行项目

代码语言:javascript复制
fvm flutter run -d macos

项目正常跑起来了,后面你就可以开始添砖加瓦,开发自己想要的桌面应用了。

现有项目实现桌面支持

要将桌面支持添加到现有的Flutter项目中,cd到项目根目录,依次运行

代码语言:javascript复制
fvm use beta --force
fvm flutter create .
fvm flutter create --platforms=windows,macos,linux .

在此之前,切换到beta版本,如果没有安装,通过命令fvm install beta安装

并运行项目

代码语言:javascript复制
fvm flutter run -d macos

windows和linux桌面应用也类似。参考连接:https://flutter.dev/desktop

0 人点赞