This commit is contained in:
2025-09-21 14:28:17 +08:00
parent 11e8e516b7
commit d823fa9083
16 changed files with 635 additions and 701 deletions
@@ -127,14 +127,20 @@ export class NavigationManager {
* 统一的面板切换方法
* @param panelType 目标面板类型
*/
public switchToPanel(panelType: PanelType, force: boolean = false): Node {
public switchToPanel(
panelType: PanelType,
force: boolean = false,
callback: Function = null
): 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`);
console.log(
`[NavigationManager] Already on ${panelType}, skipping switch`
);
return this.currentActivePanel;
}
@@ -161,10 +167,9 @@ export class NavigationManager {
const showDirection = isMovingRight ? "right" : "left";
// 隐藏当前面板(包括子页面)
if (!this.currentActivePanel || !this.currentActivePanel.isValid) {
return;
if (this.currentActivePanel && this.currentActivePanel.isValid) {
this.hidePanelWithAnimation(this.currentActivePanel, hideDirection);
}
this.hidePanelWithAnimation(this.currentActivePanel, hideDirection);
// 加载并显示目标面板
this.loadOrGetPanel(panelType, (panel: Node) => {
@@ -179,13 +184,15 @@ export class NavigationManager {
this.showPanelWithAnimation(panel, showDirection, () => {
this.currentActivePanel = panel;
this.navigationPanel.hideLoading?.();
if (callback instanceof Function) callback(panel);
});
});
}
private subPanelDic: Map<Node, Node[]> = new Map();
private subPanelMapping: Map<Node, PanelType> = new Map();
private subPanelAnimationConfigs: Map<Node, SubPanelAnimationConfig> = new Map();
private subPanelAnimationConfigs: Map<Node, SubPanelAnimationConfig> =
new Map();
// 弹窗管理相关属性
private popupPanels: Set<Node> = new Set(); // 管理所有打开的弹窗
@@ -193,6 +200,75 @@ export class NavigationManager {
// 动画锁,防止动画中重复操作
private isAnimating: boolean = false;
/**
* 带动画的子面板清理方法
* @param basePanel 主面板节点
* @param callback 所有动画完成后的回调
*/
private clearSubPanelsWithAnimation(
basePanel: Node,
callback?: Function
): void {
if (!basePanel || !basePanel.isValid) {
callback && callback();
return;
}
const subPanels = this.subPanelDic.get(basePanel);
if (!subPanels || subPanels.length === 0) {
callback && callback();
return;
}
let completedCount = 0;
const totalCount = subPanels.length;
// 完成动画的回调
const onAnimationComplete = () => {
completedCount++;
if (completedCount >= totalCount) {
// 清理subPanelDic
this.subPanelDic.delete(basePanel);
callback && callback();
}
};
// 同时播放所有子面板的关闭动画
for (let i = subPanels.length - 1; i >= 0; i--) {
const subPanel = subPanels[i];
if (subPanel && subPanel.isValid) {
// 获取动画配置
let config = this.subPanelAnimationConfigs.get(subPanel);
if (!config) {
config = {
openAnimation: PageTransitionType.SCALE,
closeAnimation: PageTransitionType.SCALE,
duration: 0.2,
};
}
// 播放关闭动画
this.playSubPanelCloseAnimation(subPanel, config, () => {
// 清理映射
this.subPanelMapping.delete(subPanel);
this.subPanelAnimationConfigs.delete(subPanel);
// 销毁节点
const baseView = subPanel.getComponent(li_BaseView);
if (baseView) {
baseView.close();
} else {
subPanel.destroy();
}
onAnimationComplete();
});
} else {
onAnimationComplete();
}
}
}
/**
* 统一的subPanel清理方法
* @param basePanel 主面板节点
@@ -252,13 +328,15 @@ export class NavigationManager {
const defaultConfig: SubPanelAnimationConfig = {
openAnimation: PageTransitionType.SCALE,
closeAnimation: PageTransitionType.SCALE,
duration: 0.3
duration: 0.3,
};
const config = animationConfig || defaultConfig;
const callback = (n: Node) => {
if (!n || !n.isValid) {
console.error("[NavigationManager] openSubPanel: created panel is invalid");
console.error(
"[NavigationManager] openSubPanel: created panel is invalid"
);
return;
}
@@ -273,10 +351,11 @@ export class NavigationManager {
if (basePanelType) {
this.subPanelMapping.set(n, basePanelType);
} else {
console.warn(`[NavigationManager] 无法确定basePanel类型: ${basePanel.name}`);
console.warn(
`[NavigationManager] 无法确定basePanel类型: ${basePanel.name}`
);
}
// 存储动画配置
this.subPanelAnimationConfigs.set(n, config);
@@ -299,12 +378,16 @@ export class NavigationManager {
force: boolean = false
): Node {
if (!panelType) {
console.error("[NavigationManager] switchToPanelWithTransition: panelType is invalid");
console.error(
"[NavigationManager] switchToPanelWithTransition: panelType is invalid"
);
return null;
}
if (this.currentActivePanelType === panelType && !force) {
console.log(`[NavigationManager] Already on ${panelType}, skipping switch`);
console.log(
`[NavigationManager] Already on ${panelType}, skipping switch`
);
return this.currentActivePanel;
}
@@ -322,8 +405,12 @@ export class NavigationManager {
this.navigationPanel.showLoading?.();
// 获取动画方向
const hideDirection = this.getDirectionFromTransitionType(transitionConfig.outgoingTransition);
const showDirection = this.getDirectionFromTransitionType(transitionConfig.incomingTransition);
const hideDirection = this.getDirectionFromTransitionType(
transitionConfig.outgoingTransition
);
const showDirection = this.getDirectionFromTransitionType(
transitionConfig.incomingTransition
);
// 隐藏当前面板(包括子页面)
if (this.currentActivePanel && this.currentActivePanel.isValid) {
@@ -350,7 +437,9 @@ export class NavigationManager {
/**
* 将过渡类型转换为方向字符串
*/
private getDirectionFromTransitionType(transitionType: PageTransitionType): "left" | "right" | "up" | "down" {
private getDirectionFromTransitionType(
transitionType: PageTransitionType
): "left" | "right" | "up" | "down" {
switch (transitionType) {
case PageTransitionType.SLIDE_LEFT:
return "left";
@@ -368,7 +457,10 @@ export class NavigationManager {
/**
* 执行子面板打开动画
*/
private playSubPanelOpenAnimation(panel: Node, config: SubPanelAnimationConfig): void {
private playSubPanelOpenAnimation(
panel: Node,
config: SubPanelAnimationConfig
): void {
if (!panel || !panel.isValid) {
return;
}
@@ -447,7 +539,11 @@ export class NavigationManager {
* @param data 传递的数据
* @param callback 可选的回调函数
*/
public openPopupPanel(panelName: string, data: any = null, callback?: Function): void {
public openPopupPanel(
panelName: string,
data: any = null,
callback?: Function
): void {
if (!panelName) {
console.error("[NavigationManager] openPopupPanel: panelName is empty");
return;
@@ -455,13 +551,17 @@ export class NavigationManager {
const popupCallback = (panel: Node) => {
if (!panel || !panel.isValid) {
console.error("[NavigationManager] openPopupPanel: created panel is invalid");
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}`);
console.log(
`[NavigationManager] Popup panel opened: ${panelName}, total popups: ${this.popupPanels.size}`
);
if (callback) {
callback(panel);
@@ -484,7 +584,9 @@ export class NavigationManager {
// 从弹窗管理集合中移除
if (this.popupPanels.has(panel)) {
this.popupPanels.delete(panel);
console.log(`[NavigationManager] Popup panel closed: ${panel.name}, total popups: ${this.popupPanels.size}`);
console.log(
`[NavigationManager] Popup panel closed: ${panel.name}, total popups: ${this.popupPanels.size}`
);
}
// 关闭面板
@@ -508,7 +610,9 @@ export class NavigationManager {
return;
}
console.log(`[NavigationManager] Closing all popups, count: ${this.popupPanels.size}`);
console.log(
`[NavigationManager] Closing all popups, count: ${this.popupPanels.size}`
);
// 复制Set以避免在迭代过程中修改
const popupPanelsToClose = Array.from(this.popupPanels);
@@ -522,9 +626,14 @@ export class NavigationManager {
// 确保清空集合
this.popupPanels.clear();
}
public closeSubPanel(panel: Node | li_BaseView, animationConfig?: SubPanelAnimationConfig) {
public closeSubPanel(
panel: Node | li_BaseView,
animationConfig?: SubPanelAnimationConfig
) {
if (!panel) {
console.warn("[NavigationManager] closeSubPanel: panel is null or undefined");
console.warn(
"[NavigationManager] closeSubPanel: panel is null or undefined"
);
return;
}
@@ -549,7 +658,7 @@ export class NavigationManager {
config = {
openAnimation: PageTransitionType.SCALE,
closeAnimation: PageTransitionType.SCALE,
duration: 0.3
duration: 0.3,
};
}
@@ -590,7 +699,9 @@ export class NavigationManager {
this.subPanelDic.delete(baseNode);
}
} else {
console.warn(`[NavigationManager] ${panelNode.name} 不在子页面列表中`);
console.warn(
`[NavigationManager] ${panelNode.name} 不在子页面列表中`
);
}
}
@@ -636,7 +747,9 @@ export class NavigationManager {
case "PersonalPanel":
return PanelType.PERSONAL;
default:
console.warn(`[NavigationManager] Unknown panel type for node: ${node.name}`);
console.warn(
`[NavigationManager] Unknown panel type for node: ${node.name}`
);
return null;
}
}
@@ -713,18 +826,22 @@ export class NavigationManager {
direction: "left" | "right" | "up" | "down",
callback?: Function
) {
if (!panel || !panel.isValid || !panel.active) {
if (!panel || !panel.isValid) {
callback && callback();
return;
}
// 同时开始子面板的关闭动画
this.clearSubPanelsWithAnimation(panel);
if (!panel.active) panel.active = true;
const animationCallback = () => {
panel.active = false;
// 使用统一的subPanel清理方法
this.clearSubPanels(panel, true);
callback && callback();
};
// 主面板动画
switch (direction) {
case "left":
UITransitionHelper.slideOutToLeft(panel, 0.3, animationCallback);