flutter 如何使用bitsdojo_window插件

在Flutter中如何使用bitsdojo_window插件自定义桌面应用的窗口样式？我按照官方文档添加了依赖并进行了基本配置，但窗口的标题栏、边框和最小化/最大化按钮仍然显示默认样式。能否提供一个完整的示例代码，说明如何正确设置窗口透明背景、自定义标题栏和禁用系统默认装饰？另外，这个插件在Windows和macOS上的实现方式是否有差异？

2 回复

使用 bitsdojo_window 插件步骤：

  1. 添加依赖
    在 pubspec.yaml 的 dependencies 中添加：

    bitsdojo_window: ^0.1.2

  2. 导入包
    在 main.dart 顶部添加：

    import 'package:bitsdojo_window/bitsdojo_window.dart';

  3. 初始化窗口
    在 main() 函数中调用：

    void main() {
  runApp(MyApp());
  doWhenWindowReady(() {
    final win = appWindow;
    win.size = Size(600, 400);
    win.alignment = Alignment.center;
    win.show();
  });
}

  4. 自定义窗口标题栏
    使用 WindowBorder 和 MoveWindow 组件：

    WindowBorder(
  color: Colors.grey,
  child: MoveWindow(
    child: YourTitleBarWidget(),
  ),
)

  5. 窗口控制按钮
    使用 WindowButton 组件实现最小化、最大化、关闭：

    MinimizeWindowButton(),
MaximizeWindowButton(),
CloseWindowButton(),

注意：仅支持 Windows 和 macOS 平台。

更多关于flutter 如何使用bitsdojo_window插件的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在 Flutter 中使用 bitsdojo_window 插件可以自定义桌面应用窗口（支持 Windows 和 macOS）。以下是详细步骤和示例代码：

1. 添加依赖

在 pubspec.yaml 中添加依赖：

dependencies:
  bitsdojo_window: ^0.1.1

2. 平台配置

Windows

在 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 bitsdojo_window_macos
override func bitsdojo_window_configure() -> UInt {
  return BDW_CUSTOM_FRAME
}

3. Flutter 代码示例

在 main.dart 中初始化并自定义窗口：

import 'package:flutter/material.dart';
import 'package:bitsdojo_window/bitsdojo_window.dart';

void main() {
  runApp(MyApp());
  // 必须在 runApp 后调用
  doWhenWindowReady(() {
    final initialSize = Size(600, 450);
    appWindow.minSize = initialSize;
    appWindow.size = initialSize;
    appWindow.alignment = Alignment.center;
    appWindow.show();
  });
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: WindowBorder(
          color: Colors.grey,
          width: 1,
          child: Column(
            children: [
              WindowTitleBarBox(
                child: Row(
                  children: [
                    Expanded(child: MoveWindow()),
                    WindowButtons(),
                  ],
                ),
              ),
              Expanded(child: Container(color: Colors.white)),
            ],
          ),
        ),
      ),
    );
  }
}

// 自定义窗口按钮（关闭、最小化）
class WindowButtons extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Row(
      children: [
        MinimizeWindowButton(colors: WindowButtonColors(iconNormal: Colors.black)),
        CloseWindowButton(colors: WindowButtonColors(iconNormal: Colors.black)),
      ],
    );
  }
}

4. 常用功能

  • 移动窗口：使用 MoveWindow 组件。
  • 窗口按钮：内置 MinimizeWindowButton、MaximizeWindowButton、CloseWindowButton。
  • 窗口样式：通过 appWindow 设置大小、位置、标题等。

注意事项

  • 仅适用于 Windows 和 macOS。
  • 首次运行前执行 flutter pub get 和 flutter clean（如有问题）。

通过以上步骤即可快速集成自定义窗口功能。

回到顶部