Flutter窗口管理插件bitsdojo_window_modify1的使用
Flutter窗口管理插件bitsdojo_window_modify1
的使用
概述
bitsdojo_window
是一个用于自定义和操作 Flutter 桌面应用程序窗口的插件。它支持 Windows、macOS 和 Linux 平台。
功能特点:
- 自定义窗口框架(移除标准的 Windows/macOS/Linux 标题栏和按钮)
- 启动时隐藏窗口
- 显示/隐藏窗口
- 使用 Flutter 小部件移动窗口
- 最小化/最大化/还原/关闭窗口
- 设置窗口大小、最小尺寸和最大尺寸
- 设置窗口位置
- 设置窗口在屏幕上的对齐方式(居中/左上/右上/左下/右下)
- 设置窗口标题
开始使用
1. 安装插件
在 pubspec.yaml
文件中添加以下依赖项:
dependencies:
bitsdojo_window: ^0.3.1
然后运行 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
文件。 - 在导入
FlutterMacOS
后添加以下一行代码:
import bitsdojo_window_macos
- 将
class MainFlutterWindow: NSWindow
修改为class MainFlutterWindow: BitsdojoWindow
。 - 在
awakeFromNib()
方法之前添加以下方法:
override func bitsdojo_window_configure() -> UInt {
return 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
文件中,添加以下代码到 main
函数中:
void main() {
runApp(const MyApp());
// 配置窗口
doWhenWindowReady(() {
const initialSize = Size(600, 450);
appWindow.minSize = initialSize;
appWindow.size = initialSize;
appWindow.alignment = Alignment.center;
appWindow.show();
});
}
示例代码
以下是一个完整的示例代码,展示如何使用 bitsdojo_window
插件创建一个带有自定义标题栏的窗口:
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 = "自定义窗口";
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),
],
);
}
}
更多关于Flutter窗口管理插件bitsdojo_window_modify1的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html
更多关于Flutter窗口管理插件bitsdojo_window_modify1的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
bitsdojo_window_modify1
是一个 Flutter 插件,用于在桌面应用程序中自定义窗口管理。它是 bitsdojo_window
的一个修改版本,提供了更多的灵活性和功能。以下是如何使用 bitsdojo_window_modify1
的基本指南。
1. 添加依赖
首先,你需要在 pubspec.yaml
文件中添加 bitsdojo_window_modify1
插件的依赖:
dependencies:
flutter:
sdk: flutter
bitsdojo_window_modify1: ^1.0.0 # 请确保使用最新版本
然后运行 flutter pub get
来安装依赖。
2. 初始化插件
在你的 main.dart
文件中,导入插件并初始化它:
import 'package:flutter/material.dart';
import 'package:bitsdojo_window_modify1/bitsdojo_window_modify1.dart';
void main() {
runApp(MyApp());
doWhenWindowReady(() {
final initialSize = Size(800, 600);
appWindow.minSize = initialSize;
appWindow.size = initialSize;
appWindow.alignment = Alignment.center;
appWindow.show();
});
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(),
);
}
}
3. 自定义窗口样式
你可以使用 bitsdojo_window_modify1
提供的 API 来自定义窗口的样式,例如设置窗口的标题栏、边框、最小化和最大化按钮等。
import 'package:flutter/material.dart';
import 'package:bitsdojo_window_modify1/bitsdojo_window_modify1.dart';
class MyHomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: [
WindowTitleBarBox(
child: Row(
children: [
Expanded(
child: MoveWindow(),
),
MinimizeWindowButton(),
MaximizeWindowButton(),
CloseWindowButton(),
],
),
),
Expanded(
child: Center(
child: Text('Hello, Bitsdojo Window!'),
),
),
],
),
);
}
}
4. 处理窗口事件
你可以监听和处理窗口的各种事件,例如窗口大小变化、最小化、最大化等。
import 'package:flutter/material.dart';
import 'package:bitsdojo_window_modify1/bitsdojo_window_modify1.dart';
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
void initState() {
super.initState();
appWindow.onWindowResized = _onWindowResized;
}
void _onWindowResized() {
print('Window resized to: ${appWindow.size}');
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: [
WindowTitleBarBox(
child: Row(
children: [
Expanded(
child: MoveWindow(),
),
MinimizeWindowButton(),
MaximizeWindowButton(),
CloseWindowButton(),
],
),
),
Expanded(
child: Center(
child: Text('Hello, Bitsdojo Window!'),
),
),
],
),
);
}
}
5. 其他功能
bitsdojo_window_modify1
还提供了其他一些功能,例如设置窗口的透明度、设置窗口的图标等。你可以查阅插件的文档来了解更多细节。
6. 运行应用
完成上述步骤后,你可以运行你的 Flutter 桌面应用程序,并看到自定义的窗口样式和功能。
flutter run