介绍 Flutter 桌面应用 NativeShell

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-XZ0gsAyY-1623201948424)(https://ducafecat.tech/2021/06/09/translation/introducing-nativeshell/2021-06-09-08-59-44.png)]

猫哥说

看到这张图片,我就感觉脖子酸。。。我这样摆过,虽然看起来很 cool,然后你的脖子要上下调整,这比左右调整费事。

今天推荐阅读的是关于 Flutter 桌面开发,下面有原文、代码 Git 链接。

开始前我想起 React Native 说过的一句话 《用同样的方法在多端开发》,这句话很玄妙又很正确,就是说不是让你同一套代码同时能编译成 ios android web windows linux …,只是代码的高度复用,所以有的同学在做多端架构时就要注意拆包了。

比如 你的业务代码、API、Entity、功能函数 很多情况下是复用的。但是各个平台的底层、交互体验是个性化。

不要被在 ios android 两端平滑兼容所欺骗。

今天介绍 NativeShell 这个桌面程序,这个程序演示了 多窗口、模式对话框、拖拽、菜单、工具栏、文件操作、系统 API 调用的例子,如果你正在做研究,这是一个很好参考。

老铁记得 转发 ,猫哥会呈现更多 Flutter 好文~~~~

微信群 ducafecat

原文

https://matejknopp.com/post/introducing-nativeshell/

视频

代码

https://github.com/nativeshell/app_template

参考

  • http://airflow.app/
  • https://airflow.app/remote-app/
  • https://github.com/nativeshell/examples/blob/main/src/file_open_dialog.rs#L18
  • https://github.com/nativeshell/examples/blob/main/lib/pages/drag_drop.dart
  • https://github.com/nativeshell/nativeshell/blob/main/nativeshell/src/shell/platform/win32/drag_com.rs

正文

自从我第一次看到 Turbo Vision,我就对桌面应用程序感兴趣。DOS 中那些文本模式可调整大小的窗口对我来说就像魔术一样。它激发了人们对用户界面框架的兴趣,这种框架在 20 多年后依然很强大。

在过去十年左右的时间里,人们的注意力主要转移到了网络和移动设备上,这并没有让我感到特别高兴。所以我觉得是时候从阴影中爬出来,离开我的舒适区,试着把一些聚光灯带回它应该在的地方。到桌面上去!😃

Flutter 之路

我最后一个处理的桌面应用程序是(现在仍然是) Airflow。它是 Qt 和大量平台特定代码的混合体。如果我自己这么说的话,我对最终的结果非常满意,但是开发人员的经验和整体生产力还有很多需要改进的地方。

http://airflow.app/

大约两年前,我需要一个适用于 iOS 和安卓系统的气流应用程序。经过几个原型后,决定做出,我去 Flutter。我确实喜欢认为我有自己的 UI 开发经验,毕竟,我在不同的平台上使用过十几个 GUI 框架,所以现在没有什么能让我感到惊讶的了,对吧?错了。他们所有人中最大的惊喜就是和 Flutter 一起工作的感觉是多么的好。在我的一生中,从来没有,一次也没有,建立用户界面这么有意义。

https://airflow.app/remote-app/

如果我能用这种方式构建桌面应用程序,岂不是很神奇?当然,这是可能的,但现实是一个严酷的情妇,在那个时候桌面嵌入仍然处于婴儿期。那就回到 Qt 吧。但这个念头一直在我脑海中挥之不去。

一两年过去了,很多事情发生了变化。还有很多工作要做,但是桌面嵌入已经成熟了很多,而且 Flutter on desktop 已经开始成为一个可行的选择。

Flutter desktop 嵌入

现在你可能会问:

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Flutter 桌面程序的快捷键绑定可以通过 Flutter 的 `ShortcutManager` 类来实现。下面是一个示例代码: ```dart import 'package:flutter/foundation.dart'; import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; void main() { WidgetsFlutterBinding.ensureInitialized(); if (kIsWeb || Platform.isLinux || Platform.isMacOS || Platform.isWindows) { SystemChrome.setPreferredOrientations([DeviceOrientation.landscapeLeft]); ShortcutManager.instance.enableShortcuts(); } runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', home: MyHomePage(), ); } } class MyHomePage extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text('Flutter Demo'), ), body: Center( child: Text('Hello, World!'), ), ); } } class ShortcutManager { ShortcutManager._(); static final instance = ShortcutManager._(); void enableShortcuts() { SystemChannels.keyEvent.setMessageHandler((RawKeyEvent event) { if (event is RawKeyDownEvent) { if (event.isControlPressed && event.logicalKey == LogicalKeyboardKey.keyA) { // 处理 Ctrl+A 快捷键 return Future.value(true); } else if (event.isControlPressed && event.logicalKey == LogicalKeyboardKey.keyB) { // 处理 Ctrl+B 快捷键 return Future.value(true); } } return Future.value(false); }); } } ``` 在上面的代码中,我们在 `ShortcutManager` 类中实现了 `enableShortcuts` 方法用于启用快捷键绑定。在 `enableShortcuts` 方法中,我们使用 `SystemChannels.keyEvent.setMessageHandler` 方法监听所有键盘事件,然后根据按下的键盘按键来处理相应的快捷键。例如,当用户按下 `Ctrl+A` 快捷键时,我们可以执行一些相应的操作。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值