Zenn
🐭

flutterでmacosアプリを作成してみた

2021/03/06に公開
Flutter
macOS
デスクトップアプリ
tech

summary

flutter 2.0がリリースされ、デスクトップアプリもstableになったようです。
デスクトップアプリ(macos)を作成してみました。
Flutter2.0で新しくなったこと

flutter install

$ git clone https://github.com/flutter/flutter
$ export PATH="$PATH:[PATH_TO_FLUTTER_GIT_DIRECTORY]/flutter/bin"
$ flutter doctor

アプリ作成

デスクトップ版作成用

$ flutter config --enable-macos-desktop

アプリ作成
ios/android/webのログは省略

$ flutter create myapp
Creating project myapp...
  myapp/test/widget_test.dart (created)
  myapp/myapp.iml (created)
  myapp/.gitignore (created)
  myapp/.metadata (created)
  myapp/macos/Runner.xcworkspace/contents.xcworkspacedata (created)
  myapp/macos/Runner.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist (created)
  myapp/macos/Runner/Assets.xcassets/AppIcon.appiconset/app_icon_16.png
  (created)
  myapp/macos/Runner/Assets.xcassets/AppIcon.appiconset/app_icon_1024.png
  (created)
  myapp/macos/Runner/Assets.xcassets/AppIcon.appiconset/app_icon_256.png
  (created)
  myapp/macos/Runner/Assets.xcassets/AppIcon.appiconset/app_icon_64.png
  (created)
  myapp/macos/Runner/Assets.xcassets/AppIcon.appiconset/app_icon_512.png
  (created)
  myapp/macos/Runner/Assets.xcassets/AppIcon.appiconset/app_icon_128.png
  (created)
  myapp/macos/Runner/Assets.xcassets/AppIcon.appiconset/Contents.json (created)
  myapp/macos/Runner/Assets.xcassets/AppIcon.appiconset/app_icon_32.png
  (created)
  myapp/macos/Runner/DebugProfile.entitlements (created)
  myapp/macos/Runner/Base.lproj/MainMenu.xib (created)
  myapp/macos/Runner/MainFlutterWindow.swift (created)
  myapp/macos/Runner/Configs/Debug.xcconfig (created)
  myapp/macos/Runner/Configs/Release.xcconfig (created)
  myapp/macos/Runner/Configs/Warnings.xcconfig (created)
  myapp/macos/Runner/Configs/AppInfo.xcconfig (created)
  myapp/macos/Runner/AppDelegate.swift (created)
  myapp/macos/Runner/Info.plist (created)
  myapp/macos/Runner/Release.entitlements (created)
  myapp/macos/Runner.xcodeproj/project.xcworkspace/xcshareddata/IDEWorkspaceChec
  ks.plist (created)
  myapp/macos/Runner.xcodeproj/project.pbxproj (created)
  myapp/macos/Runner.xcodeproj/xcshareddata/xcschemes/Runner.xcscheme (created)
  myapp/macos/Flutter/Flutter-Debug.xcconfig (created)
  myapp/macos/Flutter/Flutter-Release.xcconfig (created)
  myapp/macos/.gitignore (created)

アプリ実行

$ flutter run -d macos
Downloading darwin-x64/FlutterMacOS.framework tools...              5.2s
Downloading darwin-x64-profile/FlutterMacOS.framework tools...      1,352ms
Downloading darwin-x64-profile tools...                            885ms
Downloading darwin-x64-release/FlutterMacOS.framework tools...      1,262ms
Downloading darwin-x64-release tools...                          1,045ms
Launching lib/main.dart on macOS in debug mode...
2021-03-06 11:04:03.541 xcodebuild[41061:4906318] [MT] PluginLoading: Required plug-in compatibility UUID 2F1A5FFF-BFEB-4498-B2AC-1296A7454F81 for plug-in at path '~/Library/Application Support/Developer/Shared/Xcode/Plug-ins/VVDocumenter-Xcode.xcplugin' not present in DVTPlugInCompatibilityUUIDs
2021-03-06 11:04:03.543 xcodebuild[41061:4906318] [MT] PluginLoading: Required plug-in compatibility UUID 2F1A5FFF-BFEB-4498-B2AC-1296A7454F81 for plug-in at path '~/Library/Application Support/Developer/Shared/Xcode/Plug-ins/Alcatraz.xcplugin' not present in DVTPlugInCompatibilityUUIDs
note: Using new build system
note: Building targets in parallel
note: Planning build
note: Constructing build description
Building macOS application...
Syncing files to device macOS...                                   528ms

Flutter run key commands.
r Hot reload. 🔥🔥🔥
R Hot restart.
h Repeat this help message.
d Detach (terminate "flutter run" but leave application running).
c Clear the screen
q Quit (terminate the application on the device).

Running with unsound null safety
For more information see https://dart.dev/null-safety/unsound-null-safety

An Observatory debugger and profiler on macOS is available at:
http://127.0.0.1:49268/afgo1ANQVts=/
The Flutter DevTools debugger and profiler on macOS is available at:
http://127.0.0.1:9101?uri=http%3A%2F%2F127.0.0.1%3A49268%2Fafgo1ANQVts%3D%2F
Application finished.

開発者ツール

http://127.0.0.1:49268/afgo1ANQVts=/

http://127.0.0.1:9101?uri=http%3A%2F%2F127.0.0.1%3A49268%2Fafgo1ANQVts%3D%2F

ソースコード

FlutterViewController

import Cocoa
import FlutterMacOS

class MainFlutterWindow: NSWindow {
  override func awakeFromNib() {
    let flutterViewController = FlutterViewController.init()
    let windowFrame = self.frame
    self.contentViewController = flutterViewController
    self.setFrame(windowFrame, display: true)

    RegisterGeneratedPlugins(registry: flutterViewController)

    super.awakeFromNib()
  }
}

リソース(xlib)

まとめ

開発環境が充実しています。
マルチプラットフォーム(デスクトップ)アプリを作る選択肢になると思います。

Discussion