Flutter开发-为项目添加Desktop桌面平台支持
前言
我们都知道Flutter 的目标是：Run in any screen！就目前已经在iOS,Android和Web端都做到了很好的支持。而目前对桌面端的支持，还没有正式发布。从目前的官网文档上看，Flutter已经支持了macOS,Linux和Windows平台，但目前的这部分功能还是在dev分支上,处于alpha阶段，依然没有正式发布。本篇文章我们就使用Fultter-dev分支SDK尝试创建桌面端项目。
官方描述：
Warning: Alpha! This page covers desktop support, which is available as alpha-quality features in the Flutter dev channel. Support still has notable feature gaps, including accessibility support.
本篇文章，我们就根据官方文档的向导，完成MacOS平台支持。
环境配置
创建一个新的Fultter项目
打开终端,执行如下命令
flutter channel dev
flutter upgrade
flutter config --enable-<platform>-desktop
这里的<platform>指macos或linux,这里我们是macos
flutter config --enable-macos-desktop
检测--enable-macos-desktop是否生效：
flutter devices
2 connected devices:
iPhone 8 (mobile) • 31E81583-69D8-460B-90A1-14BC313D65AC • ios • com.apple.CoreSimulator.SimRuntime.iOS-13-4
(simulator)
macOS (desktop) • macos • darwin-x64 • Mac OS X 10.15.4 19E266
这里输出了2个链接设备，其中一个为• macos,说明config操作成功。
这里需要注意的是：在以上操作完成之后，重新启动你的IDE,这里我以Android Studio 为例，在选择设备的时候就可以看到一个macOS(desktop):
截屏2020-09-16 下午6.11.28.png
**创建项目并运行
flutter create myapp
此时我们会发现工程目录中多了一个macos文件夹
截屏2020-09-16 下午6.20.13.png
在
MacOS上运行项目
flutter run -d macos
这里同样可以通过IDE的方式运行，这里就不做举例了。
运行结果：
截屏2020-09-16 下午6.25.26.png
此时此刻，熟悉的页面就展示在了面前！
在已有的项目中添加MacOS支持
通过终端进入到项目的根目录，然后执行以下操作
flutter create .
之后会出现如下输出：
Recreating project ....
macos/Runner.xcworkspace/contents.xcworkspacedata (created)
macos/Runner.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist (created)
macos/Runner/Assets.xcassets/AppIcon.appiconset/app_icon_16.png (created)
macos/Runner/Assets.xcassets/AppIcon.appiconset/app_icon_1024.png (created)
macos/Runner/Assets.xcassets/AppIcon.appiconset/app_icon_256.png (created)
macos/Runner/Assets.xcassets/AppIcon.appiconset/app_icon_64.png (created)
macos/Runner/Assets.xcassets/AppIcon.appiconset/app_icon_512.png (created)
macos/Runner/Assets.xcassets/AppIcon.appiconset/app_icon_128.png (created)
macos/Runner/Assets.xcassets/AppIcon.appiconset/Contents.json (created)
macos/Runner/Assets.xcassets/AppIcon.appiconset/app_icon_32.png (created)
macos/Runner/DebugProfile.entitlements (created)
macos/Runner/Base.lproj/MainMenu.xib (created)
macos/Runner/MainFlutterWindow.swift (created)
macos/Runner/Configs/Debug.xcconfig (created)
macos/Runner/Configs/Release.xcconfig (created)
macos/Runner/Configs/Warnings.xcconfig (created)
macos/Runner/Configs/AppInfo.xcconfig (created)
macos/Runner/AppDelegate.swift (created)
macos/Runner/Info.plist (created)
macos/Runner/Release.entitlements (created)
macos/Runner.xcodeproj/project.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist (created)
macos/Runner.xcodeproj/project.pbxproj (created)
macos/Runner.xcodeproj/xcshareddata/xcschemes/Runner.xcscheme (created)
macos/Flutter/Flutter-Debug.xcconfig (created)
macos/Flutter/Flutter-Release.xcconfig (created)
macos/.gitignore (created)
Running "flutter pub get" in flutter_app... 1.8s
Wrote 29 files.
All done!
[✓] Flutter: is fully installed. (Channel dev, 1.22.0-12.0.pre, on Mac OS X 10.15.4 19E266, locale zh-Hans-CN)
[!] Android toolchain - develop for Android devices: is partially installed; more components are available. (Android
SDK version 29.0.2)
[✓] Xcode - develop for iOS and macOS: is fully installed. (Xcode 11.4.1)
[✓] Android Studio: is fully installed. (version 3.4)
[✓] VS Code: is fully installed. (version 1.45.1)
[✓] Connected device: is fully installed. (2 available)
Run "flutter doctor" for information about installing additional components.
In order to run your application, type:
$ cd .
$ flutter run
Your application code is in ./lib/main.dart.
同样的会在根目录新增一个macos文件夹
zeze@localhost flutter_app % ls
README.md build images lib pubspec.lock test
android flutter_app.iml ios macos pubspec.yaml
同样运行项目：
截屏2020-09-16 下午6.37.14.png
再次，熟悉的界面又呈现在了眼前。
关于443错误信息
flutter: Another exception was thrown: SocketException: Connection failed (OS Error: Operation not permitted, errno = 1), address = randomuser.me, port = 443
关于这个错误,请移步苹果开发者中心 App Sandbox和Entitlements查阅，类似于iOS的一些权限白名单，需要进行配置。
总结
非常期待Flutter 对桌面支持的 release发布，早日实现Run in any screen!😺
参考文献：https://flutter.dev/desktop#add-desktop-support-to-an-existing-app
