Flutter窗口管理插件bitsdojo_window_modify的使用

bitsdojo_window

一个来自 Flutter 包 的插件，它使得在 Windows、macOS 和 Linux 上自定义和操作您的 Flutter 桌面应用程序窗口变得简单。

观看教程以开始。点击以下图像查看视频：

特性:

- 自定义窗口框架 - 移除标准的 Windows/macOS/Linux 标题栏和按钮
- 启动时隐藏窗口
- 显示/隐藏窗口
- 使用 Flutter 小部件移动窗口
- 最小化/最大化/还原/关闭窗口
- 设置窗口大小、最小尺寸和最大尺寸
- 设置窗口位置
- 设置窗口在屏幕上的对齐方式（中心/左上角/右上角/左下角/右下角）
- 设置窗口标题

开始使用

安装包并将其添加到 pubspec.yaml 文件中：

dependencies:
  bitsdojo_window: ^0.3.0

然后运行 flutter pub get。

对于 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 FlutterMacOS 后添加以下代码：

import bitsdojo_window_macos // 添加此行

class MainFlutterWindow: BitsdojoWindow { // 将 NSWindow 替换为 BitsdojoWindow
    
  override func bitsdojo_window_configure() -> UInt {
    return BDW_CUSTOM_FRAME | BDW_HIDE_ON_STARTUP
  }
  
  override func awakeFromNib() {
    ... // 其余代码保持不变
  }
}

如果您不想使用自定义框架，可以移除 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);            // 添加此行
bdw->setCustomFrame(true);                          // 添加此行
// gtk_window_set_default_size(window, 1280, 720); // 注释掉此行
gtk_widget_show(GTK_WIDGET(window));

Flutter 应用集成

现在进入 lib\main.dart 并在 runApp(MyApp()); 后添加以下代码：

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

  // 添加以下代码
  doWhenWindowReady(() {
    const initialSize = Size(600, 450);
    appWindow.minSize = initialSize;
    appWindow.size = initialSize;
    appWindow.alignment = Alignment.center;
    appWindow.show();
  });
}

这将设置初始窗口大小和最小窗口大小，将窗口居中并显示在屏幕上。

示例代码

以下是一个完整的示例，展示如何创建一个带有自定义标题栏和按钮的窗口：

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

void main() {
  runApp(const MyApp());
  doWhenWindowReady(() {
    final win = appWindow;
    const initialSize = Size(600, 450);
    win.minSize = initialSize;
    win.size = initialSize;
    win.alignment = Alignment.center;
    win.title = "Custom window with Flutter";
    win.show();
  });
}

const borderColor = Color(0xFF805306);

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: WindowBorder(
          color: borderColor,
          width: 1,
          child: Row(
            children: const [LeftSide(), RightSide()],
          ),
        ),
      ),
    );
  }
}

const sidebarColor = Color(0xFFF6A00C);

class LeftSide extends StatelessWidget {
  const LeftSide({Key? key}) : super(key: key);
  [@override](/user/override)
  Widget build(BuildContext context) {
    return SizedBox(
        width: 200,
        child: Container(
            color: sidebarColor,
            child: Column(
              children: [
                WindowTitleBarBox(child: MoveWindow()),
                Expanded(child: Container())
              ],
            )));
  }
}

const backgroundStartColor = Color(0xFFFFD500);
const backgroundEndColor = Color(0xFFF6A00C);

class RightSide extends StatelessWidget {
  const RightSide({Key? key}) : super(key: key);
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Expanded(
      child: Container(
        decoration: const BoxDecoration(
          gradient: LinearGradient(
              begin: Alignment.topCenter,
              end: Alignment.bottomCenter,
              colors: [backgroundStartColor, backgroundEndColor],
              stops: [0.0, 1.0]),
        ),
        child: Column(children: [
          WindowTitleBarBox(
            child: Row(
              children: [Expanded(child: MoveWindow()), const WindowButtons()],
            ),
          )
        ]),
      ),
    );
  }
}

final buttonColors = WindowButtonColors(
    iconNormal: const Color(0xFF805306),
    mouseOver: const Color(0xFFF6A00C),
    mouseDown: const Color(0xFF805306),
    iconMouseOver: const Color(0xFF805306),
    iconMouseDown: const Color(0xFFFFD500));

final closeButtonColors = WindowButtonColors(
    mouseOver: const Color(0xFFD32F2F),
    mouseDown: const Color(0xFFB71C1C),
    iconNormal: const Color(0xFF805306),
    iconMouseOver: Colors.white);

class WindowButtons extends StatefulWidget {
  const WindowButtons({Key? key}) : super(key: key);

  [@override](/user/override)
  _WindowButtonsState createState() => _WindowButtonsState();
}

class _WindowButtonsState extends State<WindowButtons> {
  void maximizeOrRestore() {
    setState(() {
      appWindow.maximizeOrRestore();
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Row(
      children: [
        MinimizeWindowButton(colors: buttonColors),
        appWindow.isMaximized
            ? RestoreWindowButton(
                colors: buttonColors,
                onPressed: maximizeOrRestore,
              )
            : MaximizeWindowButton(
                colors: buttonColors,
                onPressed: maximizeOrRestore,
              ),
        CloseWindowButton(colors: closeButtonColors),
      ],
    );
  }
}