style(map): 调整信息框Y轴偏移并简化布局代码

1. 将EquipBoxComp和SkillBoxComp的IBOX_OFFSET_Y从60改为80
2. 移除IBoxComp中冗余的布局常量和自适应布局逻辑
This commit is contained in:
panFD
2026-08-03 09:10:37 +08:00
parent 115a50d0be
commit ae540e1232
3 changed files with 5 additions and 55 deletions

View File

@@ -164,8 +164,8 @@ export class EquipBoxComp extends CCComp {
/** 长按时长(秒) */
private static readonly LONG_PRESS_TIME: number = 0.5;
/** IBox 顶部相对图标的 Y 轴偏移(像素,弹窗顶部锚定在该点并向下生长 */
private static readonly IBOX_OFFSET_Y: number = 60;
/** IBox 相对图标的 Y 轴偏移(像素) */
private static readonly IBOX_OFFSET_Y: number = 80;
/** 信息框是否已弹出(区分长按完成与短按取消) */
private info_shown: boolean = false;

View File

@@ -19,7 +19,7 @@
* - SkillSet / FieldSkillSetSkillSet—— 技能/光环静态配置
* - EquipSetfindEquipByUuid—— 装备静态配置
*/
import { _decorator, Label, NodeEventType, RichText, UITransform, Node, v3, Widget } from "cc";
import { _decorator, Label, NodeEventType, RichText } from "cc";
import { ecs } from "../../../../extensions/oops-plugin-framework/assets/libs/ecs/ECS";
import { CCComp } from "../../../../extensions/oops-plugin-framework/assets/module/common/CCComp";
import { SkillSet, SkillOverrides } from "../common/config/SkillSet";
@@ -57,14 +57,6 @@ export class IBoxComp extends CCComp {
@property(RichText)
massage_node: RichText = null!
// ======================== 布局常量 ========================
/** 内容顶部留白(像素) */
private static readonly PADDING_TOP: number = 10;
/** 内容底部留白(像素) */
private static readonly PADDING_BOTTOM: number = 10;
/** 根节点最小高度(像素),防止过矮 */
private static readonly MIN_HEIGHT: number = 60;
/**
* 初始化并渲染弹窗内容。
* @param args 见 IBoxInitArgs
@@ -156,48 +148,6 @@ export class IBoxComp extends CCComp {
if (this.massage_node && this.massage_node.isValid) {
this.massage_node.string = text;
}
// 文本变更后,下一帧 RichText 完成排版再刷新弹窗高度
this.scheduleOnce(() => this.refreshLayout(), 0);
}
/**
* 根据 RichText 实际排版高度自适应弹窗尺寸。
* 弹窗Bg 背景 + 根节点)采用"顶部锚定"模式:
* 顶部固定在图标上方偏移处,内容条数越多向下生长越高,
* 因此展示位置无需随高度补偿。
*/
private refreshLayout() {
if (!this.node || !this.node.isValid) return;
const rootUI = this.node.getComponent(UITransform);
const bgNode = this.node.getChildByName("Bg");
const bgUI = bgNode?.getComponent(UITransform) ?? null;
const richNode = this.massage_node?.node ?? null;
const richUI = richNode?.getComponent(UITransform) ?? null;
if (!rootUI || !bgUI || !richNode || !richUI) return;
// 1. 计算目标高度RichText 排版后的实际高度 + 上下留白
const contentH = richUI.height;
const targetH = Math.max(
IBoxComp.MIN_HEIGHT,
contentH + IBoxComp.PADDING_TOP + IBoxComp.PADDING_BOTTOM
);
// 2. 根节点直接设为顶部锚定0.5, 1锚点 y=0 即弹窗顶边,
// 调用方仍按原逻辑把节点放到"图标上方偏移"处即可。
rootUI.setAnchorPoint(0.5, 1);
rootUI.setContentSize(rootUI.width, targetH);
// 3. Bg 背景同步顶部锚定并撑满根节点Bg 相对根节点 y=0 即为顶边)
// 预制体中 Bg 带有旧版 Widget强制拉伸必须禁用否则会覆盖本处布局
const bgWidget = bgNode!.getComponent(Widget);
if (bgWidget) bgWidget.enabled = false;
bgUI.setAnchorPoint(0.5, 1);
bgUI.setContentSize(bgUI.width, targetH);
bgNode!.setPosition(0, 0, bgNode!.position.z);
// 4. RichText锚点改为顶部锚定贴齐顶部留白处
richUI.setAnchorPoint(0.5, 1);
richNode.setPosition(v3(richNode.position.x, -IBoxComp.PADDING_TOP, richNode.position.z));
}
/**

View File

@@ -164,8 +164,8 @@ export class SkillBoxComp extends CCComp {
/** 长按时长(秒) */
private static readonly LONG_PRESS_TIME: number = 0.5;
/** IBox 顶部相对图标的 Y 轴偏移(像素,弹窗顶部锚定在该点并向下生长 */
private static readonly IBOX_OFFSET_Y: number = 60;
/** IBox 相对图标的 Y 轴偏移(像素) */
private static readonly IBOX_OFFSET_Y: number = 80;
/** 信息框是否已弹出(区分长按完成与短按取消) */
private info_shown: boolean = false;