Files
18xchat/assets/Scripts/chat18x/manager/NavigationManager.ts
T
xionglijia 7722ccf694 ui模块优化 全部navigationmanager管理
实现pastgirllistpanel逻辑
完善图集
2025-09-21 12:05:34 +08:00

582 lines
16 KiB
TypeScript

import { ViewManager } from "db://assets/Scripts/Main/Manager/ViewManager";
import { UITransitionHelper } from "../utils/UITransitionHelper";
import GameRootUI from "../../Main/Common/GameRootUI";
import { Node, sys } from "cc";
import li_EventManager from "../../Main/Common/li_EventManager";
import { InnerMsgCode } from "../../Main/Config/InnerMsgCode";
import { ThemePanel } from "../ui/panels/ThemePanel";
import { GirlListPanel } from "../ui/panels/GirlListPanel";
import li_BaseView from "../../Main/Common/li_BaseView";
/**
* 页面过渡动画类型枚举
*/
export enum PageTransitionType {
NONE = "none",
SLIDE_LEFT = "slide_left",
SLIDE_RIGHT = "slide_right",
}
/**
* NavigationPanel面板类型枚举
*/
export enum PanelType {
THEME = "ThemePanel",
GIRL_DETAIL = "GirlDetailPanel",
PAST_GIRL_LIST = "PastGirlListPanel",
PERSONAL = "PersonalPanel",
}
/**
* 页面过渡动画配置接口
*/
export interface PageTransitionConfig {
incomingTransition: PageTransitionType;
outgoingTransition: PageTransitionType;
duration?: number;
simultaneous?: boolean;
}
/**
* 导航管理器
*
* 负责管理游戏中的页面导航和路由,将导航逻辑从业务逻辑中分离出来
* 统一管理NavigationPanel和其他面板的切换
*
* @author AI Chat System
* @version 1.0.0
*/
export class NavigationManager {
private static _instance: NavigationManager;
// NavigationPanel相关属性
private navigationPanel: any = null; // NavigationPanel实例引用
private currentActivePanelType: PanelType = PanelType.PAST_GIRL_LIST;
private currentActivePanel: Node = null; // 初始化为null
private panelCache: Map<PanelType, Node> = new Map(); // 面板缓存
// 选中的角色相关信息
private selectedGirlId: number = 10002; // 当前选中的角色ID
private selectedCategoryId: number = -1; // 当前选中的主题ID
private static LastSelectGirlID = "LastSelectGirlID";
/**
* 获取NavigationManager的单例实例
*
* @returns {NavigationManager} 导航管理器实例
* @static
*/
public static get Instance(): NavigationManager {
if (!this._instance) {
this._instance = new NavigationManager();
//初始化默认选的girl
let cacheGirlId = sys.localStorage.getItem(this.LastSelectGirlID);
if (!cacheGirlId) {
cacheGirlId = 10002;
sys.localStorage.setItem(this.LastSelectGirlID, cacheGirlId);
}
this._instance.selectedGirlId = Number(cacheGirlId);
let cacheCategoryId = sys.localStorage.getItem("LastSelectCategoryId");
if (!cacheCategoryId) {
cacheCategoryId = 0;
sys.localStorage.setItem("LastSelectCategoryId", cacheCategoryId);
}
this._instance.selectedCategoryId = cacheCategoryId;
}
return this._instance;
}
private constructor() {
// 初始化事件监听
this.initEventListeners();
}
/**
* 初始化事件监听
*/
private initEventListeners(): void {
//
}
/**
* 注册NavigationPanel实例
* @param panel NavigationPanel实例
*/
public registerNavigationPanel(panel: any): void {
this.navigationPanel = panel;
console.log("[NavigationManager] NavigationPanel registered");
}
/**
* 统一的面板切换方法
* @param panelType 目标面板类型
*/
public switchToPanel(panelType: PanelType, force: boolean = false): Node {
if (!panelType) {
console.error("[NavigationManager] switchToPanel: panelType is invalid");
return null;
}
if (this.currentActivePanelType === panelType && !force) {
console.log(`[NavigationManager] Already on ${panelType}, skipping switch`);
return this.currentActivePanel;
}
if (!this.navigationPanel) {
console.warn(
"[NavigationManager] NavigationPanel not registered, fallback to direct ViewManager call"
);
//this.fallbackSwitchPanel(panelType);
return null;
}
// 切换面板前先关闭所有弹窗
this.closeAllPopups();
// 通知NavigationPanel显示加载状态
this.navigationPanel.showLoading?.();
// 计算动画方向
const currentIndex = this.getPanelIndex(this.currentActivePanelType);
const targetIndex = this.getPanelIndex(panelType);
const isMovingRight = currentIndex < targetIndex;
const hideDirection = isMovingRight ? "left" : "right";
const showDirection = isMovingRight ? "right" : "left";
// 隐藏当前面板(包括子页面)
if (!this.currentActivePanel || !this.currentActivePanel.isValid) {
return;
}
this.hidePanelWithAnimation(this.currentActivePanel, hideDirection);
// 加载并显示目标面板
this.loadOrGetPanel(panelType, (panel: Node) => {
// 清理当前面板的subPanel(在hidePanelWithAnimation中已经清理,这里不需要重复)
this.currentActivePanelType = panelType;
// 更新NavigationPanel按钮状态
this.navigationPanel.updateButtonStates?.(panelType);
// 显示面板
this.showPanelWithAnimation(panel, showDirection, () => {
this.currentActivePanel = panel;
this.navigationPanel.hideLoading?.();
});
});
}
private subPanelDic: Map<Node, Node[]> = new Map();
private subPanelMapping: Map<Node, PanelType> = new Map();
// 弹窗管理相关属性
private popupPanels: Set<Node> = new Set(); // 管理所有打开的弹窗
/**
* 统一的subPanel清理方法
* @param basePanel 主面板节点
* @param destroyPanels 是否销毁面板,默认为true
*/
private clearSubPanels(basePanel: Node, destroyPanels: boolean = true): void {
if (!basePanel || !basePanel.isValid) {
return;
}
const subPanels = this.subPanelDic.get(basePanel);
if (!subPanels || subPanels.length === 0) {
return;
}
// 清理所有子面板
for (let i = subPanels.length - 1; i >= 0; i--) {
const subPanel = subPanels[i];
if (subPanel && subPanel.isValid) {
// 清理subPanelMapping
this.subPanelMapping.delete(subPanel);
if (destroyPanels) {
const baseView = subPanel.getComponent(li_BaseView);
if (baseView) {
baseView.close();
} else {
subPanel.destroy();
}
}
}
}
// 清理subPanelDic
this.subPanelDic.delete(basePanel);
}
public openSubPanel(panelName: string, basePanel: Node, data: any = null) {
if (!panelName) {
console.error("[NavigationManager] openSubPanel: panelName is empty");
return;
}
if (!basePanel || !basePanel.isValid) {
console.error("[NavigationManager] openSubPanel: basePanel is invalid");
return;
}
const callback = (n: Node) => {
if (!n || !n.isValid) {
console.error("[NavigationManager] openSubPanel: created panel is invalid");
return;
}
if (!this.subPanelDic.has(basePanel)) {
this.subPanelDic.set(basePanel, []);
}
const subPanels = this.subPanelDic.get(basePanel);
subPanels.push(n);
const basePanelType = this.getPanelType(basePanel);
if (basePanelType) {
this.subPanelMapping.set(n, basePanelType);
} else {
console.warn(`[NavigationManager] 无法确定basePanel类型: ${basePanel.name}`);
}
n.setParent(basePanel, true);
};
ViewManager.I.openBundlesView(panelName, data, callback);
}
/**
* 打开弹窗面板
* @param panelName 弹窗面板名称
* @param data 传递的数据
* @param callback 可选的回调函数
*/
public openPopupPanel(panelName: string, data: any = null, callback?: Function): void {
if (!panelName) {
console.error("[NavigationManager] openPopupPanel: panelName is empty");
return;
}
const popupCallback = (panel: Node) => {
if (!panel || !panel.isValid) {
console.error("[NavigationManager] openPopupPanel: created panel is invalid");
return;
}
// 将弹窗添加到管理集合中
this.popupPanels.add(panel);
console.log(`[NavigationManager] Popup panel opened: ${panelName}, total popups: ${this.popupPanels.size}`);
if (callback) {
callback(panel);
}
};
ViewManager.I.openBundlesPopupView(panelName, data, popupCallback);
}
/**
* 关闭弹窗面板
* @param panel 要关闭的弹窗节点
*/
public closePopupPanel(panel: Node): void {
if (!panel || !panel.isValid) {
console.warn("[NavigationManager] closePopupPanel: panel is invalid");
return;
}
// 从弹窗管理集合中移除
if (this.popupPanels.has(panel)) {
this.popupPanels.delete(panel);
console.log(`[NavigationManager] Popup panel closed: ${panel.name}, total popups: ${this.popupPanels.size}`);
}
// 关闭面板
try {
const baseView = panel.getComponent(li_BaseView);
if (baseView) {
baseView.close();
} else {
panel.destroy();
}
} catch (error) {
console.error("[NavigationManager] closePopupPanel error:", error);
}
}
/**
* 关闭所有弹窗
*/
private closeAllPopups(): void {
if (this.popupPanels.size === 0) {
return;
}
console.log(`[NavigationManager] Closing all popups, count: ${this.popupPanels.size}`);
// 复制Set以避免在迭代过程中修改
const popupPanelsToClose = Array.from(this.popupPanels);
for (const panel of popupPanelsToClose) {
if (panel && panel.isValid) {
this.closePopupPanel(panel);
}
}
// 确保清空集合
this.popupPanels.clear();
}
public closeSubPanel(panel: Node | li_BaseView) {
if (!panel) {
console.warn("[NavigationManager] closeSubPanel: panel is null or undefined");
return;
}
let panelNode: Node;
if (panel instanceof Node) {
panelNode = panel;
} else {
panelNode = panel.node;
}
if (!panelNode || !panelNode.isValid) {
console.warn("[NavigationManager] closeSubPanel: panelNode is invalid");
return;
}
// 从subPanelMapping和subPanelDic中移除
if (this.subPanelMapping.has(panelNode)) {
const baseType = this.subPanelMapping.get(panelNode);
const baseNode = this.panelCache.get(baseType);
if (baseNode && this.subPanelDic.has(baseNode)) {
const subPanels = this.subPanelDic.get(baseNode);
const index = subPanels.indexOf(panelNode);
if (index !== -1) {
subPanels.splice(index, 1);
// 如果subPanels为空,删除整个条目
if (subPanels.length === 0) {
this.subPanelDic.delete(baseNode);
}
} else {
console.warn(`[NavigationManager] ${panelNode.name} 不在子页面列表中`);
}
}
this.subPanelMapping.delete(panelNode);
}
// 销毁或关闭panel
try {
if (panel instanceof Node) {
panel.destroy();
} else {
panel.close();
}
} catch (error) {
console.error("[NavigationManager] closeSubPanel error:", error);
}
}
/**
* 获取面板索引(用于动画方向计算)
*/
private getPanelIndex(panelType: PanelType): number {
switch (panelType) {
case PanelType.THEME:
return 0;
case PanelType.GIRL_DETAIL:
return 1;
case PanelType.PAST_GIRL_LIST:
return 2;
case PanelType.PERSONAL:
return 3;
default:
return 0;
}
}
private getPanelType(node: Node): PanelType {
if (!node || !node.isValid) {
console.warn("[NavigationManager] getPanelType: node is invalid");
return null;
}
switch (node.name) {
case "ThemePanel":
return PanelType.THEME;
case "GirlDetailPanel":
return PanelType.GIRL_DETAIL;
case "PastGirlListPanel":
return PanelType.PAST_GIRL_LIST;
case "PersonalPanel":
return PanelType.PERSONAL;
default:
console.warn(`[NavigationManager] Unknown panel type for node: ${node.name}`);
return null;
}
}
/**
* 获取面板名称
*/
private getPanelName(panelType: PanelType): string {
return panelType as string;
}
/**
* 获取面板数据
*/
private getPanelData(panelType: PanelType): any {
switch (panelType) {
case PanelType.GIRL_DETAIL:
return this.selectedGirlId; // 使用当前选中的角色ID
default:
return null;
}
}
/**
* 加载或获取面板
*/
private loadOrGetPanel(
panelType: PanelType,
callback: (panel: Node) => void
) {
// 检查缓存
if (this.panelCache.has(panelType)) {
const cachedPanel = this.panelCache.get(panelType);
if (cachedPanel && cachedPanel.isValid) {
// 确保缓存panel的subPanel状态正确,清理可能残留的subPanel引用
this.clearSubPanels(cachedPanel, false); // 不销毁panel,只清理引用
// 特殊处理:主题面板刷新(避免重复调用Show)
if (panelType === PanelType.THEME) {
const themePanel = cachedPanel.getComponent(ThemePanel);
if (themePanel) {
// 不在这里调用Show(),因为ThemePanel已经有加载状态保护
// 只在必要时调用onHide()确保子页面状态正确
if (typeof themePanel.onHide === "function") {
console.log("[NavigationManager] 确保主题面板子页面状态正确");
themePanel.onHide();
}
}
}
callback(cachedPanel);
return;
} else {
this.panelCache.delete(panelType);
}
}
// 加载新面板
const panelName = this.getPanelName(panelType);
const openData = this.getPanelData(panelType);
ViewManager.I.openBundlesView(panelName, openData, (panel: Node) => {
if (panel && panel.isValid) {
this.panelCache.set(panelType, panel);
callback(panel);
}
});
}
/**
* 隐藏面板动画
*/
private hidePanelWithAnimation(
panel: Node,
direction: "left" | "right",
callback?: Function
) {
if (!panel || !panel.isValid || !panel.active) {
callback && callback();
return;
}
const animationCallback = () => {
panel.active = false;
// 使用统一的subPanel清理方法
this.clearSubPanels(panel, true);
callback && callback();
};
if (direction === "left") {
UITransitionHelper.slideOutToLeft(panel, 0.3, animationCallback);
} else {
UITransitionHelper.slideOutToRight(panel, 0.3, animationCallback);
}
}
/**
* 显示面板动画
*/
private showPanelWithAnimation(
panel: Node,
direction: "left" | "right",
callback?: Function
) {
if (!panel || !panel.isValid) {
callback && callback();
return;
}
panel.active = true;
if (direction === "right") {
UITransitionHelper.slideInFromRight(panel, 0.3, () => {
callback && callback();
});
} else {
UITransitionHelper.slideInFromLeft(panel, 0.3, () => {
callback && callback();
});
}
}
/**
* 获取当前激活的面板类型
*/
public getCurrentActivePanel(): PanelType {
return this.currentActivePanelType;
}
/**
* 设置选中的角色ID
* @param girlId 角色ID
*/
public setSelectedGirlId(girlId: number): void {
this.selectedGirlId = girlId;
sys.localStorage.setItem(NavigationManager.LastSelectGirlID, girlId);
console.log("[NavigationManager] Selected girl ID set to:", girlId);
}
/**
* 获取当前选中的角色ID
* @returns 当前选中的角色ID
*/
public getSelectedGirlId(): number {
return this.selectedGirlId;
}
/**
* 设置选中的主题ID
* @param themeId 主题ID
*/
public setSelectedCategoryId(themeId: number): void {
this.selectedCategoryId = themeId;
console.log("[NavigationManager] Selected theme ID set to:", themeId);
}
/**
* 获取当前选中的主题ID
* @returns 当前选中的主题ID
*/
public getSelectedCategoryId(): number {
return this.selectedCategoryId;
}
}