当前位置: 首页 > news >正文

Flutter笔记:桌面应用 窗口定制库 bitsdojo_window

Flutter笔记
桌面应用窗口管理库 bitsdojo_window

作者李俊才 (jcLee95):https://blog.csdn.net/qq_28550263
邮箱 :291148484@163.com
本文地址:https://blog.csdn.net/qq_28550263/article/details/134464678


在这里插入图片描述

高级:多窗口管理,请跳转到:《Flutter桌面端应用多窗口管理》,地址:https://jclee95.blog.csdn.net/article/details/134468587))

【简介】本文介绍一个当前 Flutter 桌面应用开发中自定义桌面窗口的模块 bitsdojo_window。 它允许你在 WindowsmacOSLinux 上构建原生桌面应用程序。bitsdojo_window 模块提供了一种简化窗口管理、自定义窗口外观和交互的方法,使开发者能够更轻松地构建具有桌面风格的应用程序。


1. 概述

bitsdojo_window 库为 Flutter 桌面应用开发提供了强大的支持。bitsdojo_window 提供了一种简化的方式来管理和自定义桌面窗口。这个库的主要目标是使开发者能够更轻松地构建具有桌面风格的应用程序。

bitsdojo_window 支持在 WindowsmacOSLinux 上构建原生桌面应用程序。它提供了一系列的 API,使得开发者可以轻松地控制窗口的大小、位置、最小化、最大化、全屏、关闭等操作。此外,它还允许开发者自定义窗口的外观,包括窗口的标题、图标、背景颜色等。

使用 bitsdojo_window,开发者可以专注于应用程序的核心功能,而不需要花费大量的时间和精力在窗口管理上。这使得 Flutter 桌面应用开发变得更加简单和高效。

2. 安装和设置

2.1 添加 bitsdojo_window 依赖

要在 Flutter 项目中使用 bitsdojo_window,首先需要在项目的 pubspec.yaml 文件中添加 bitsdojo_window 的依赖。以下是添加依赖的步骤:

dependencies:flutter:sdk: flutterbitsdojo_window: ^0.1.5

然后在终端中运行下面的命令,以获取 bitsdojo_window 的依赖包:

flutter pub get

或者直接运行add命令以安装其最新的版本:

flutter pub add bitsdojo_window

2.2 初始化 bitsdojo_window

在添加了 bitsdojo_window 的依赖之后,需要在项目中初始化 bitsdojo_window

  1. 在项目的 main.dart 文件中导入 bitsdojo_window 库,如下所示:
import 'package:bitsdojo_window/bitsdojo_window.dart';
  1. main() 函数中调用 doWhenWindowReady() 函数,以确保窗口准备就绪后再进行初始化,如下所示:
void main() {WidgetsFlutterBinding.ensureInitialized();runApp(MyApp());doWhenWindowReady(() {final win = appWindow;final initialSize = Size(600, 450);win.minSize = initialSize;win.size = initialSize;win.alignment = Alignment.center;win.title = "My Flutter App";win.show();});
}

在上述代码中,doWhenWindowReady() 函数会等待窗口准备就绪后再进行初始化。appWindowbitsdojo_window 库提供的一个全局对象,用于访问和控制应用程序的窗口。通过 appWindow 对象,可以设置窗口的最小大小、当前大小、位置、标题等属性,并可以显示窗口。

至此,bitsdojo_window 的安装和设置就完成了。接下来,你就可以使用 bitsdojo_window 来管理和自定义你的 Flutter 桌面应用程序的窗口了。

2.3 配置原生代码

在 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 // Add this lineclass MainFlutterWindow: BitsdojoWindow {override func bitsdojo_window_configure() -> UInt {return BDW_CUSTOM_FRAME | BDW_HIDE_ON_STARTUP
}// rest of your code
}

3. 窗口管理

3.1 控制窗口的大小和位置

使用 bitsdojo_window,你可以轻松地控制窗口的大小和位置。以下是如何进行操作的示例:

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

在上述代码中,minSize 属性用于设置窗口的最小大小,size 属性用于设置窗口的当前大小,alignment 属性用于设置窗口的位置。例如,Alignment.center 会将窗口置于屏幕中心。

3.2 窗口的最小化、最大化、全屏和关闭操作

bitsdojo_window 提供了一系列的函数,用于进行窗口的最小化、最大化、全屏和关闭操作。以下是如何进行操作的示例:

void main() {runApp(MyApp());doWhenWindowReady(() {final win = appWindow;// 最小化窗口win.minimize();// 最大化窗口win.maximize();// 全屏显示窗口win.showFullScreen();// 关闭窗口win.close();});
}

在上述代码中,minimize() 函数用于最小化窗口,maximize() 函数用于最大化窗口,showFullScreen() 函数用于全屏显示窗口,close() 函数用于关闭窗口。

请注意,这些操作通常会在响应用户的某些操作(例如点击按钮)时进行,而不是在 main() 函数中直接进行。

3.3 判断窗口是否已经最大化

可以使用 appWindow.isMaximized 属性来判断窗口是否已经最大化。如果窗口已经最大化,可以使用 RestoreWindowButton 组件来显示一个恢复窗口的按钮;如果窗口没有最大化,可以使用 MaximizeWindowButton 组件来显示一个最大化窗口的按钮。

appWindow.isMaximized? RestoreWindowButton(colors: buttonColors, onPressed: maximizeOrRestore): MaximizeWindowButton(colors: buttonColors, onPressed: maximizeOrRestore)

4. 自定义窗口外观

4.1 自定义窗口的标题和图标

使用 bitsdojo_window,你可以轻松地自定义窗口的标题和图标。以下是如何进行操作的示例:

void main() {runApp(MyApp());doWhenWindowReady(() {final win = appWindow;// 设置窗口标题win.title = "My Custom Title";// 设置窗口图标win.icon = "assets/icon.png";});
}

在上述代码中,title 属性用于设置窗口的标题,icon 属性用于设置窗口的图标。请注意,图标文件应该是项目的资源文件,需要在 pubspec.yaml 文件中进行声明。

4.2 自定义窗口的背景颜色

bitsdojo_window 也允许你自定义窗口的背景颜色。你可以通过 FlutterMaterialAppCupertinoApp 的 theme 属性来设置窗口的背景颜色。以下是如何进行操作的示例:

void main() {runApp(MyApp());
}class MyApp extends StatelessWidget {Widget build(BuildContext context) {return MaterialApp(theme: ThemeData(// 设置窗口的背景颜色primarySwatch: Colors.blue,),home: MyHomePage(),);}
}

在上述代码中,primarySwatch 属性用于设置窗口的背景颜色。你可以选择任何你喜欢的颜色。

通过这些设置,你可以根据你的需求和喜好来自定义你的 Flutter 桌面应用程序的窗口外观。

4.3 自定义窗口按钮的颜色

可以使用 WindowButtonColors 类来设置窗口按钮的颜色。例如,可以设置最小化、最大化和关闭按钮的颜色。

final buttonColors = WindowButtonColors(normal: Colors.blue.withOpacity(.2),iconNormal: Colors.blue,mouseOver: Colors.red,mouseDown: Colors.green,iconMouseOver: Colors.white,iconMouseDown: Colors.orange,
);

然后,可以使用这个 buttonColors 对象来设置按钮的颜色:

MinimizeWindowButton(colors: buttonColors)
MaximizeWindowButton(colors: buttonColors)

5. 高级功能

5.1 窗口的拖拽操作

bitsdojo_window 提供了一种简单的方式来实现窗口的拖拽操作。你可以使用 MoveWindow 组件来包裹你希望用于拖拽窗口的部分。例如:

class MyApp extends StatelessWidget {Widget build(BuildContext context) {return MaterialApp(home: Scaffold(appBar: AppBar(title: MoveWindow(child: Text('My Custom Title'),),),body: MyHomePage(),),);}
}

在上述代码中,MoveWindow 组件包裹了标题文本,这意味着用户可以通过拖拽标题文本来移动窗口。

5.2 窗口的缩放操作

bitsdojo_window 也提供了一种简单的方式来实现窗口的缩放操作。你可以使用 ResizeWindow 组件来包裹你希望用于缩放窗口的部分,并指定缩放的方向。以下是如何进行操作的示例:

class MyApp extends StatelessWidget {Widget build(BuildContext context) {return MaterialApp(home: Scaffold(body: Stack(children: [MyHomePage(),Positioned(right: 0,bottom: 0,child: ResizeWindow(width: 10,height: 10,edge: WindowEdge.bottomRight,),),],),),);}
}

在上述代码中,ResizeWindow 组件被放置在窗口的右下角,用户可以通过拖拽这个部分来缩放窗口。edge 属性用于指定缩放的方向,WindowEdge.bottomRight 表示从右下角进行缩放。

通过这些高级功能,你可以提供更丰富的交互体验,使你的 Flutter 桌面应用程序更加易用和友好。

相关文章:

  • 生成对抗网络Generative Adversarial Network,GAN
  • 索引三星结构
  • Jmeter 如何监控目标服务的系统资源
  • 04-快速掌握Redis,了解Redis中常见的结构类型及其应用场景
  • Python+Selenium WebUI自动化框架 -- 基础操作封装
  • YOLOv5 配置C2模块构造新模型
  • 飞天使-django之数据库简介
  • 网页开发如何实现简易页面跳动/跳转,html课堂练习/作业,页面ABC的相互跳转
  • CDN加速在目前网络安全里的重要性
  • C#的MessagePack(unity)--02
  • 【MySQL】数据类型
  • 阿里云CentOS主机开启ipv6
  • Spring Boot - devtools 热部署
  • 苍穹外卖项目笔记(2)
  • hive数据库delete删除部分数据/删除分区内的数据
  • 【划重点】MySQL技术内幕:InnoDB存储引擎
  • 03Go 类型总结
  • HTTP请求重发
  • Javascript 原型链
  • 规范化安全开发 KOA 手脚架
  • 前端之Sass/Scss实战笔记
  • 如何合理的规划jvm性能调优
  • 网络应用优化——时延与带宽
  • 我从编程教室毕业
  • 06-01 点餐小程序前台界面搭建
  • 你对linux中grep命令知道多少?
  • ​MPV,汽车产品里一个特殊品类的进化过程
  • # .NET Framework中使用命名管道进行进程间通信
  • (3)nginx 配置(nginx.conf)
  • (env: Windows,mp,1.06.2308310; lib: 3.2.4) uniapp微信小程序
  • (ZT)北大教授朱青生给学生的一封信:大学,更是一个科学的保证
  • (带教程)商业版SEO关键词按天计费系统:关键词排名优化、代理服务、手机自适应及搭建教程
  • (二)Pytorch快速搭建神经网络模型实现气温预测回归(代码+详细注解)
  • (附源码)ssm高校实验室 毕业设计 800008
  • (附源码)ssm码农论坛 毕业设计 231126
  • (九)c52学习之旅-定时器
  • (篇九)MySQL常用内置函数
  • (七)Knockout 创建自定义绑定
  • (一一四)第九章编程练习
  • (转)iOS字体
  • (转载)PyTorch代码规范最佳实践和样式指南
  • .Mobi域名介绍
  • .Net Core/.Net6/.Net8 ,启动配置/Program.cs 配置
  • .net on S60 ---- Net60 1.1发布 支持VS2008以及新的特性
  • .Net Remoting(分离服务程序实现) - Part.3
  • .NET WebClient 类下载部分文件会错误?可能是解压缩的锅
  • .net 发送邮件
  • .netcore如何运行环境安装到Linux服务器
  • .net分布式压力测试工具(Beetle.DT)
  • .Net通用分页类(存储过程分页版,可以选择页码的显示样式,且有中英选择)
  • /dev/sda2 is mounted; will not make a filesystem here!
  • /etc/sudoers (root权限管理)
  • [android] 切换界面的通用处理
  • [ASP]青辰网络考试管理系统NES X3.5
  • [C/C++] C/C++中数字与字符串之间的转换