如何移除Windows平台Flutter应用的默认系统标题栏
Flutter Windows端移除系统默认标题栏操作指南
方法1:使用window_manager依赖包(推荐)
这是目前社区最常用的方案,无需修改原生代码,后续维护成本更低,同时自带窗口控制相关能力。
- 第一步:在项目
pubspec.yaml的dependencies节点下添加依赖window_manager: ^0.3.9 - 第二步:修改main函数,初始化窗口配置,核心是设置隐藏标题栏的属性,参考代码如下:
import 'package:flutter/material.dart'; import 'package:window_manager/window_manager.dart'; void main() async { WidgetsFlutterBinding.ensureInitialized(); await windowManager.ensureInitialized(); const WindowOptions windowConfig = WindowOptions( // *隐藏系统默认标题栏的核心配置* titleBarStyle: TitleBarStyle.hidden, // 可根据需求自定义窗口默认尺寸、居中显示等属性 size: Size(1280, 720), center: true, ); windowManager.waitUntilReadyToShow(windowConfig, () async { await windowManager.show(); await windowManager.focus(); }); runApp(const MyApp()); }
- 第三步:执行
flutter pub get安装依赖后重新运行项目,系统默认标题栏就会消失。
方法2:修改Windows原生代码(无第三方依赖)
如果不想引入额外依赖,可以直接修改Windows端原生配置实现。
- 第一步:打开项目路径下的
windows/runner/win32_window.cpp文件 - 第二步:找到创建窗口时的样式配置项,将原有
WS_OVERLAPPEDWINDOW样式修改为如下内容,去除标题栏相关属性:WS_OVERLAPPEDWINDOW & ~(WS_CAPTION | WS_SYSMENU | WS_THICKFRAME | WS_MINIMIZEBOX | WS_MAXIMIZEBOX) - 第三步:保存修改后重新编译运行项目即可生效。
注意:该方案修改后如果需要实现窗口拖动、大小调整、最小化/关闭等功能,需要自行补充原生交互逻辑,适配成本较高。
自定义标题栏实现补充
隐藏系统标题栏后,你可以自行实现自定义标题栏,配合window_manager包可以快速实现拖动、窗口控制功能,参考示例如下:
// 自定义标题栏组件示例 Container( height: 32, color: const Color(0xFF165DFF), child: Row( children: [ // 可拖动区域 Expanded( child: DragToMoveArea( child: Padding( padding: const EdgeInsets.symmetric(horizontal: 16), child: Text( "自定义标题", style: TextStyle(color: Colors.white, fontSize: 14), ), ), ), ), // 窗口控制按钮 IconButton( icon: const Icon(Icons.minimize, color: Colors.white, size: 16), onPressed: () => windowManager.minimize(), ), IconButton( icon: const Icon(Icons.close, color: Colors.white, size: 16), onPressed: () => windowManager.close(), ), ], ), )
内容的提问来源于stack exchange,提问作者Manan Domadiya
相关产品推荐
相关产品推荐

