日益努力,而后风生水起|

Flutter桌面端开发——bitsdojo_window插件的使用

bitsdojo_window 是一个用来定制桌面端窗口的插件。

目前拥有以下功能:

  1. 自定义窗口框架——移除了 Windows/macOS/Linux 规范的标题栏和按钮
  2. 启动时隐藏窗口
  3. 显示/隐藏窗口
  4. 使用Flutter组件移动窗口
  5. 最小化/最大化/恢复/关闭窗口
  6. 设置窗口大小,最小尺寸和最大尺寸
  7. 设置窗口位置
  8. 在屏幕上设置窗口对齐方式(中心/左上角/右上角/左下角/右下角)
  9. 设置窗口标题

安装

点击 bitsdojo_window 获取最新版本

pubspec.yaml

dependencies:
  bitsdojo_window: ^last_version

准备

Window

打开 windows\runner\main.cpp 文件,添加以下代码到前面:

#include <bitsdojo_window_windows/bitsdojo_window_plugin.h>
auto bdw = bitsdojo_window_configure(BDW_CUSTOM_FRAME | BDW_HIDE_ON_STARTUP);

macOS

打卡 macos\runner\MainFlutterWindow.swift 文件,把以下代码添加到 import FlutterMacOS后面:

import FlutterMacOS
import bitsdojo_window_macos // Add this line

然后找到这行:

class MainFlutterWindow: NSWindow {

改成:

class MainFlutterWindow: BitsdojoWindow {

NSWindow更改为BitsdojoWindow后,将这些行添加到您更改的行下方:

override func bitsdojo_window_configure() -> UInt {
  return BDW_CUSTOM_FRAME | BDW_HIDE_ON_STARTUP
}

你的代码现在应该是这样:

class MainFlutterWindow: BitsdojoWindow {
    
  override func bitsdojo_window_configure() -> UInt {
    return BDW_CUSTOM_FRAME | BDW_HIDE_ON_STARTUP
  }
    
  override func awakeFromNib() {
    ... //rest of your code

如果您不想使用自定义框架而喜欢标准窗口标题栏和按钮,可以从上面的代码中删除BDW_CUSTOM_FRAME

如果您不想在启动时隐藏窗口,则可以从上面的代码中删除BDW_HIDE_ON_STARTUP

Linux

打开linux\my_application.cc文件,添加以下代码到第一行:

#include <bitsdojo_window_linux/bitsdojo_window_plugin.h>

然后找到这两行:

gtk_window_set_default_size(window, 1280, 720);
gtk_widget_show(GTK_WIDGET(window));

改成如下内容:

auto bdw = bitsdojo_window_from(window);            // <--- add this line
bdw->setCustomFrame(true);                          // <-- add this line
//gtk_window_set_default_size(window, 1280, 720);   // <-- comment this line
gtk_widget_show(GTK_WIDGET(window));

正如您所看到的,我们注释了gtk_window_set_default_size这一行,并在gtk_widget_show(GTK_WIDGET(window))之前添加了两行新代码。

使用

首先在 lib\main.dart中添加以下代码:

void main() {
  runApp(MyApp());

  doWhenWindowReady(() {
    final win = appWindow;
    const initialSize = Size(800, 600);
    win.minSize = initialSize;
    win.size = initialSize;
    win.alignment = Alignment.center;
    win.title = 'Hello World';
    win.show();
  });
}

image

WindowBorder

设置窗口的边框。可以传入4个参数:

  • Key? key:🤫
  • required Widget child:桌面程序的主要内容
  • required Color color:边框的颜色
  • double? width:边框的宽度,默认为1
home: Scaffold(
  body: WindowBorder(
    color: Colors.blue,
    child: const Center(
      child: Text('Hello World'),
    ),
  ),
)

image

WindowTitleBarBox

窗口标题栏。可以传入2个参数:

  • Key? key:🤫
  • Widget? child:标题栏显示的内容

该组件实际上就是一个设置死高度的SizedBox

MoveWindow

可滑动区域。可以传入2个参数:

  • Key? key:🤫
  • Widget? child:移动组件里显示的内容
WindowTitleBarBox(child: MoveWindow(child: Container(color: Colors.white))),

image

MinimizeWindowButton

最小化按钮

MaximizeWindowButton

最大化按钮

CloseWindowButton

关闭按钮

以上3个组件都可以传入4个参数:

  • Key? key:🤫
  • WindowButtonColors? colors:设置按钮不同状态的颜色
  • void Function()? onPressed:设置按钮的点击方法
  • bool? animate:是否启用动画,默认为false
return Row(
  children: [
    MinimizeWindowButton(),
    MaximizeWindowButton(),
    CloseWindowButton(),
  ],
);

image

WindowButtonColors

设置按钮的颜色。可以传入6个参数:

  • Color? normal:普通状态图标背景的颜色
  • Color? mouseOver:鼠标到图标时的背景色
  • Color? mouseDown:鼠标按下按钮时的背景色
  • Color? iconNormal:普通状态下按钮的颜色
  • Color? iconMouseOver:鼠标移动到按钮图标时的图标颜色
  • Color? iconMouseDown:鼠标按下时按钮图标的颜色
final buttonColors = WindowButtonColors(
  normal: Colors.blue.withOpacity(.2),
  iconNormal: Colors.blue,
  mouseOver: Colors.red,
  mouseDown: Colors.green,
  iconMouseOver: Colors.white,
  iconMouseDown: Colors.orange,
);
MaximizeWindowButton(colors: buttonColors),

image

appWindow

属性

titleBarHeight

用来回去标题栏的高度(只读)

title

设置应用标题

alignment

设置应用在桌面的对齐位置

size

设置应用的宽高

minSize

设置应用的最下宽高

isMaximized

检测应用是否是最大状态

position

设置应用的距离左上角的位置

rect

可以使用该属性代替sizeRect.largest可以设置最大化窗口启动

borderSize

获取应用的边框宽度

handle

返回一个int类型的值

isVisible

检测当前应用是否可见状态

maxSize

设置应用的最大宽高

scaleFactor

获取桌面的比例?反正不是应用显示的比例

titleBarButtonSize

获取标题栏按钮的尺寸(只读)

方法

show()

用来显示窗口

maximize()

最大化窗口

close()

关闭窗口

minimize()

最小化窗口

restore()

恢复窗口

maximizeOrRestore()

最大化或恢复窗口

hide()

隐藏窗口

startDragging()

拖动窗口

本文作者:菠萝橙子丶

本文链接:https://www.cnblogs.com/ilgnefz/p/16059059.html

版权声明:本作品采用知识共享署名-非商业性使用-禁止演绎 2.5 中国大陆许可协议进行许可。

posted @   菠萝橙子丶  阅读(4932)  评论(2编辑  收藏  举报
点击右上角即可分享
微信分享提示
评论
收藏
关注
推荐
深色
回顶
收起
  1. 1 Shining For One Thing 赵贝尔
Shining For One Thing - 赵贝尔
00:00 / 00:00
An audio error has occurred.

Shining For One Thing (《一闪一闪亮星星》影视剧歌曲) - 赵贝尔

词:萨吉

曲:金大洲

编曲:金大洲D-Jin

制作人:金大洲D-Jin

吉他/Bass:D-Jin

合声编写/合声:赵贝尔

人声录音/编辑:张德龙@D-Jin Music Studio

混音/母带处理:George Dum

宣传推广:杨慧颖/杨佩

封面设计:HOO

OP/音乐制作出品:D-Jin Music(北京翊辰文化传媒有限公司)

(未经著作权人许可,不得翻唱、翻录或使用)

夏夜的花火

夏夜的花火

因为你在身边而深刻

因为你在身边而深刻

幸运的是我

在宇宙之间听见承诺

在宇宙之间听见承诺

嗨 是我

这一次别再错过

这一次别再错过

喜欢你该由我主动了

喜欢你该由我主动了

星星那么多

星星那么多

有数不尽的浪漫闪烁

注定这一颗

会让你刻在手臂左侧

属于我

星形心率的贴合

幸有你总在守护我

幸有你总在守护我

I fall in love

I fall in love

I see your love

遇见你才发现我在

等你到来

等你到来

Fallen star

The wonder of you

我会永远在你天空

我会永远在你天空

为你闪烁 my love

为你闪烁 my love

Shining for one thing

Shining for one thing

Shining for one thing

Shining for one thing

It's you

It's you

星星那么多

星星那么多

有数不尽的浪漫闪烁

注定这一颗

会让你刻在手臂左侧

属于我

星形心率的贴合

幸有你总在守护我

幸有你总在守护我

I fall in love

I fall in love

I see your love

遇见你才发现我在

等你到来

等你到来

Fallen star

The wonder of you

我会永远在你天空

我会永远在你天空

为你闪烁 my love

为你闪烁 my love

Shining for one thing

Shining for one thing

Shining for one thing

Shining for one thing

It's you

It's you