Flutter 桌面支援

桌面支援可以讓你的 Flutter 程式碼編譯成 Windows、macOS 或 Linux 的原生桌面應用。 Flutter 的桌面支援也允許外掛拓展— 你可以使用已經支援了 Windows、macOS 或 Linux 平台的外掛,或者建立你自己的外掛來實現功能。

要求

要能夠編譯桌面應用,你必須 在特定的平台 上編譯應用: 在 Windows 上建立 Windows 應用,在 macOS 上建立 macOS 應用,在 Linux 上建立 Linux 應用。

要建立一個支援桌面的 Flutter 應用,你需要以下的軟體:

Windows 的額外要求

要開發 Windows 桌面程式,除了 Flutter SDK,你還需要做以下準備:

  • Visual Studio 2022Visual Studio 2022 生成工具 在選擇安裝 Visual Studio 時或只安裝生成工具的時候,你需要選擇「使用 C++ 的桌面開發」,包括其所有預設元件,以安裝必要的 C++ 工具鏈和 Windows SDK 的標頭檔案。

macOS 的額外要求

要開發 macOS 桌面程式,除了 Flutter SDK,你還需要做以下準備:

  • 完整安裝版本的 Xcode,不能只是安裝了指令行工具的那種

  • 如果使用外掛,需要安裝 CocoaPods

Linux 的額外要求

要開發 Linux 桌面程式,除了 Flutter SDK,你還需要做以下準備:

安裝 Flutter SDK 和這些依賴,最簡單方式的方式是使用 snapd。更多詳細訊息,可以檢視 安裝 snapd

安裝 snapd 後,你就可以使用 Snap Store 安裝 Flutter,也可以在指令行進行安裝:

$ sudo snap install flutter --classic

如果你在使用的 Linux 發行版上無法使用 snapd,你可以使用下面的指令行:

$ sudo apt-get install clang cmake git ninja-build pkg-config libgtk-3-dev liblzma-dev libstdc++-12-dev

建立一個新專案

你可以透過下列步驟,來建立一個支援桌面的新專案。

設定步驟

你可以執行 flutter doctor 來檢視是否存在未解決的問題。每一個成功的設定都有一個對勾,比如在 Windows 上你可能會看到如下內容:

C:\> flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.0.0, on Microsoft Windows [Version 10.0.19044.1706], locale en-US)
[✓] Chrome - develop for the web
[✓] Visual Studio - develop for Windows (Visual Studio Professional 2022 17.2.0)
[✓] VS Code (version 1.67.2)
[✓] Connected device (3 available)
[✓] HTTP Host Availability

• No issues found!

在 macOS 上,你可能會看到如下內容:

[✓] Xcode - develop for iOS and macOS

Linux 平台,你可能會看到如下內容:

[✓] Linux toolchain - develop for Linux desktop

在執行 flutter doctor 指令時如果發現有不需要支援的平台的問題或者元件缺少報錯等提示,你可以忽略這些警告,或者使用 flutter config 指令來停用這個平台,比如:

$ flutter config --no-enable-ios

其他可用的引數:

  • --no-enable-windows-desktop
  • --no-enable-linux-desktop
  • --no-enable-macos-desktop
  • --no-enable-web
  • --no-enable-android
  • --no-enable-ios

加入了桌面端支援之後,請重啟你的 IDE,然後 IDE 就能檢測到新的裝置了。

建立和執行

建立一個桌面支援的新專案,與在其他平台 建立新的 Flutter 專案 沒什麼不同的地方。

一旦設定好了桌面支援的環境,你可以透過 IDE 或指令行建立和執行桌面程式。

使用 IDE

在你設定好桌面支援的環境後,記得重啟已經在執行的 IDE。

在你的 IDE 中建立新應用時,它會自動建立 iOS、 Android 和應用的桌面版本。從裝置的下拉選項中,選擇 windows (desktop)macOS (desktop)linux (desktop) 然後執行你的應用,就會看到應用在桌面啟動。

使用指令行

想要建立一個包含桌面支援的新應用(除了支援移動和 Web),請執行下面的指令,將 my_app 替換成你專案的名稱:

$ flutter create my_app
$ cd my_app

想要從命令行啟動你的應用,可以在根目錄執行以下指令之一:

C:\> flutter run -d windows
$ flutter run -d macos
$ flutter run -d linux

建立 release 版本的應用

要生成 release 版本,可以執行以下指令之一:

PS C:\> flutter build windows
$ flutter build macos
$ flutter build linux

為已有的應用新增桌面支援

想為已有的 Flutter 專案新增桌面支援,你可以從專案根目錄在控制台執行下面指令:

$ flutter create --platforms=windows,macos,linux .

這將會在你的 Flutter 桌面專案中新增必要的已有檔案和資料夾。如果需要只新增特定平台桌面端的支援,修改 platforms 的值為你想要支援的平台即可。

外掛支援

Flutter 在桌面支援中使用和建立外掛。使用支援桌面端的外掛,可以根據文件 在 Flutter 裡使用 Packages 中描述的內容進行操作。 Flutter 會像在其他平台中一樣的操作,自動將需要的原生平台程式碼加入到你的工程中。

編寫一個外掛

當你開始建立自己的外掛時,你需要記住聯合。聯合是定義幾個不同套件的能力,其中每個套件都針對不同的平台,將它們合併到一個外掛中,這樣方便開發人員使用。比如,Windows 實現的 url_launcher,實際是透過 url_launcher_windows 完成的,但是 Flutter 開發者可以在 pubspec.yaml 中,簡單地新增 url_launcher 套件作為依賴,在建立過程中會基於目標平台引入正確的實現。聯合非常方便,因為具有不同專長的不同團隊,可以為不同的平台建立相應的外掛實現。與原外掛作者協調之後,你可以為 pub.dev 上任何聯合外掛新增新的平台實現。

想要瞭解更多訊息,包括關於已支援的外掛訊息,請參閱以下資源:

Codelab 和 Flutter 文件

建立一個 Flutter 桌面程式
這個 codelab 會引導你透過使用 Flutter,來建立一個整合 GitHub GraphQL API 的桌面應用。

你可以執行下面的桌面應用案例,也可以下載並閱讀原始碼,以瞭解更多關於 Flutter 桌面支援的訊息。

Wonderous 應用 線上訪問原始碼倉庫地址
這是一款使用 Flutter 建立的應用,它擁有極具表現力的使用者介面。 Wonderous 專注於提供可訪問的高質量使用者體驗,同時包含引人入勝的互動體驗以及新穎的動畫效果。如果你想要將 Wonderous 作為桌面應用執行,你可以克隆該專案,並按照 README 中的說明進行體驗。

Flokk 官宣文章原始碼倉庫地址
一款整合了 GitHub 和 Twitter 的谷歌聯絡人管理器應用。可以從你的 Google 賬戶同步資料,匯入聯絡人訊息,並管理它們。

圖片搜尋應用
使用支援桌面端的外掛建立的一個桌面應用案例。