123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174 |
- import { DEBUG } from "cc/env";
- /**
- * Cocos Creator 工具栏管理器
- * 用于动态控制工具栏的显示和隐藏
- */
- export class ToolbarManager {
- private static _ins: ToolbarManager;
- private _isHidden: boolean = false;
- private _styleElement: HTMLStyleElement | null = null;
- public static get ins(): ToolbarManager {
- return this._ins ?? (this._ins = new ToolbarManager());
- }
- /**
- * 隐藏工具栏
- */
- public hideToolbar(): void {
- if (this._isHidden) return;
- // 创建隐藏样式
- this._styleElement = document.createElement('style');
- this._styleElement.id = 'cocos-toolbar-hide';
- this._styleElement.textContent = `
- /* 隐藏 Cocos Creator 工具栏 */
- .cocos-toolbar,
- .toolbar,
- .cc-toolbar,
- .editor-toolbar,
- [class*="toolbar"],
- [id*="toolbar"],
- [class*="Toolbar"],
- [id*="Toolbar"] {
- display: none !important;
- visibility: hidden !important;
- opacity: 0 !important;
- height: 0 !important;
- overflow: hidden !important;
- }
-
- /* 隐藏可能的工具栏容器 */
- .toolbar-container,
- .toolbar-wrapper,
- .editor-toolbar-container {
- display: none !important;
- }
- `;
-
- document.head.appendChild(this._styleElement);
- this._isHidden = true;
-
- console.log('[ToolbarManager] 工具栏已隐藏');
- }
- /**
- * 显示工具栏
- */
- public showToolbar(): void {
- if (!this._isHidden) return;
- // 移除隐藏样式
- if (this._styleElement) {
- this._styleElement.remove();
- this._styleElement = null;
- }
-
- this._isHidden = false;
- console.log('[ToolbarManager] 工具栏已显示');
- }
- /**
- * 切换工具栏显示状态
- */
- public toggleToolbar(): void {
- if (this._isHidden) {
- this.showToolbar();
- } else {
- this.hideToolbar();
- }
- }
- /**
- * 检查工具栏是否隐藏
- */
- public isToolbarHidden(): boolean {
- return this._isHidden;
- }
- /**
- * 通过 JavaScript 直接操作 DOM 隐藏工具栏
- */
- public hideToolbarByDOM(): void {
- const toolbarSelectors = [
- '.cocos-toolbar',
- '.toolbar',
- '.cc-toolbar',
- '.editor-toolbar',
- '[class*="toolbar"]',
- '[id*="toolbar"]',
- '[class*="Toolbar"]',
- '[id*="Toolbar"]'
- ];
- let hiddenCount = 0;
- toolbarSelectors.forEach(selector => {
- const elements = document.querySelectorAll(selector);
- elements.forEach(el => {
- const element = el as HTMLElement;
- if (element.style.display !== 'none') {
- element.style.display = 'none';
- hiddenCount++;
- }
- });
- });
- console.log(`[ToolbarManager] 通过 DOM 操作隐藏了 ${hiddenCount} 个工具栏元素`);
- }
- /**
- * 通过 JavaScript 直接操作 DOM 显示工具栏
- */
- public showToolbarByDOM(): void {
- const toolbarSelectors = [
- '.cocos-toolbar',
- '.toolbar',
- '.cc-toolbar',
- '.editor-toolbar',
- '[class*="toolbar"]',
- '[id*="toolbar"]',
- '[class*="Toolbar"]',
- '[id*="Toolbar"]'
- ];
- let shownCount = 0;
- toolbarSelectors.forEach(selector => {
- const elements = document.querySelectorAll(selector);
- elements.forEach(el => {
- const element = el as HTMLElement;
- if (element.style.display === 'none') {
- element.style.display = '';
- shownCount++;
- }
- });
- });
- console.log(`[ToolbarManager] 通过 DOM 操作显示了 ${shownCount} 个工具栏元素`);
- }
- /**
- * 初始化工具栏管理器
- */
- public init(): void {
- // 检查是否需要自动隐藏工具栏
- if (localStorage.getItem('hide_cocos_toolbar') === 'true') {
- this.hideToolbar();
- }
-
- console.log('[ToolbarManager] 工具栏管理器已初始化');
- }
- /**
- * 设置工具栏隐藏状态并保存到本地存储
- */
- public setToolbarHidden(hidden: boolean): void {
- localStorage.setItem('hide_cocos_toolbar', hidden.toString());
-
- if (hidden) {
- this.hideToolbar();
- } else {
- this.showToolbar();
- }
- }
- }
|