refactor(missionCard): 重构刷新按钮UI逻辑,新增刷新石消耗支持

1. 新增初始刷新石常量配置
2. 重构多刷新按钮UI更新逻辑为通用方法
3. 调整按钮预制件UI结构,添加刷新石显示节点
4. 重构代码排版与注释,移除废弃引用
This commit is contained in:
panFD
2026-07-30 16:44:38 +08:00
parent 42c63e6482
commit 69b75b72c6
4 changed files with 2497 additions and 1145 deletions

View File

@@ -34,11 +34,11 @@
"_active": true,
"_components": [
{
"__id__": 58
"__id__": 76
}
],
"_prefab": {
"__id__": 60
"__id__": 78
},
"_lpos": {
"__type__": "cc.Vec3",
@@ -608,22 +608,25 @@
},
{
"__id__": 33
},
{
"__id__": 51
}
],
"_active": true,
"_components": [
{
"__id__": 51
"__id__": 69
},
{
"__id__": 53
"__id__": 71
},
{
"__id__": 55
"__id__": 73
}
],
"_prefab": {
"__id__": 57
"__id__": 75
},
"_lpos": {
"__type__": "cc.Vec3",
@@ -817,7 +820,7 @@
},
{
"__type__": "cc.Node",
"_name": "cost",
"_name": "coin",
"_objFlags": 0,
"__editorExtras__": {
"mountedRoot": null
@@ -876,7 +879,7 @@
},
{
"__type__": "cc.Node",
"_name": "gold",
"_name": "icon",
"_objFlags": 0,
"__editorExtras__": {},
"_parent": {
@@ -1248,6 +1251,442 @@
"targetOverrides": null,
"nestedPrefabInstanceRoots": null
},
{
"__type__": "cc.Node",
"_name": "stone",
"_objFlags": 0,
"__editorExtras__": {
"mountedRoot": null
},
"_parent": {
"__id__": 26
},
"_children": [
{
"__id__": 52
},
{
"__id__": 58
}
],
"_active": false,
"_components": [
{
"__id__": 64
},
{
"__id__": 66
}
],
"_prefab": {
"__id__": 68
},
"_lpos": {
"__type__": "cc.Vec3",
"x": 0,
"y": -32.75,
"z": 0
},
"_lrot": {
"__type__": "cc.Quat",
"x": 0,
"y": 0,
"z": 0,
"w": 1
},
"_lscale": {
"__type__": "cc.Vec3",
"x": 1,
"y": 1,
"z": 1
},
"_mobility": 0,
"_layer": 1073741824,
"_euler": {
"__type__": "cc.Vec3",
"x": 0,
"y": 0,
"z": 0
},
"_id": ""
},
{
"__type__": "cc.Node",
"_name": "icon",
"_objFlags": 0,
"__editorExtras__": {},
"_parent": {
"__id__": 51
},
"_children": [],
"_active": true,
"_components": [
{
"__id__": 53
},
{
"__id__": 55
}
],
"_prefab": {
"__id__": 57
},
"_lpos": {
"__type__": "cc.Vec3",
"x": -7.5615234375,
"y": 0,
"z": 0
},
"_lrot": {
"__type__": "cc.Quat",
"x": 0,
"y": 0,
"z": 0,
"w": 1
},
"_lscale": {
"__type__": "cc.Vec3",
"x": 1,
"y": 1,
"z": 1
},
"_mobility": 0,
"_layer": 1073741824,
"_euler": {
"__type__": "cc.Vec3",
"x": 0,
"y": 0,
"z": 0
},
"_id": ""
},
{
"__type__": "cc.UITransform",
"_name": "",
"_objFlags": 0,
"__editorExtras__": {},
"node": {
"__id__": 52
},
"_enabled": true,
"__prefab": {
"__id__": 54
},
"_contentSize": {
"__type__": "cc.Size",
"width": 27,
"height": 27
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_id": ""
},
{
"__type__": "cc.CompPrefabInfo",
"fileId": "31GJSeBupAjL6B0JSMWEDn"
},
{
"__type__": "cc.Sprite",
"_name": "",
"_objFlags": 0,
"__editorExtras__": {},
"node": {
"__id__": 52
},
"_enabled": true,
"__prefab": {
"__id__": 56
},
"_customMaterial": null,
"_srcBlendFactor": 2,
"_dstBlendFactor": 4,
"_color": {
"__type__": "cc.Color",
"r": 255,
"g": 255,
"b": 255,
"a": 255
},
"_spriteFrame": {
"__uuid__": "6165ffc9-a838-4a33-b569-bdbaaab0e6b4@66d28",
"__expectedType__": "cc.SpriteFrame"
},
"_type": 0,
"_fillType": 0,
"_sizeMode": 0,
"_fillCenter": {
"__type__": "cc.Vec2",
"x": 0,
"y": 0
},
"_fillStart": 0,
"_fillRange": 0,
"_isTrimmedMode": true,
"_useGrayscale": false,
"_atlas": {
"__uuid__": "6165ffc9-a838-4a33-b569-bdbaaab0e6b4",
"__expectedType__": "cc.SpriteAtlas"
},
"_id": ""
},
{
"__type__": "cc.CompPrefabInfo",
"fileId": "f0Ah1lXhpLIZry/aPq9YzL"
},
{
"__type__": "cc.PrefabInfo",
"root": {
"__id__": 1
},
"asset": {
"__id__": 0
},
"fileId": "d5mcu1TmRMYpCqlMi96hsO",
"instance": null,
"targetOverrides": null,
"nestedPrefabInstanceRoots": null
},
{
"__type__": "cc.Node",
"_name": "num",
"_objFlags": 0,
"__editorExtras__": {},
"_parent": {
"__id__": 51
},
"_children": [],
"_active": true,
"_components": [
{
"__id__": 59
},
{
"__id__": 61
}
],
"_prefab": {
"__id__": 63
},
"_lpos": {
"__type__": "cc.Vec3",
"x": 13.5,
"y": 0,
"z": 0
},
"_lrot": {
"__type__": "cc.Quat",
"x": 0,
"y": 0,
"z": 0,
"w": 1
},
"_lscale": {
"__type__": "cc.Vec3",
"x": 1,
"y": 1,
"z": 1
},
"_mobility": 0,
"_layer": 1073741824,
"_euler": {
"__type__": "cc.Vec3",
"x": 0,
"y": 0,
"z": 0
},
"_id": ""
},
{
"__type__": "cc.UITransform",
"_name": "",
"_objFlags": 0,
"__editorExtras__": {},
"node": {
"__id__": 58
},
"_enabled": true,
"__prefab": {
"__id__": 60
},
"_contentSize": {
"__type__": "cc.Size",
"width": 15.123046875,
"height": 54.4
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_id": ""
},
{
"__type__": "cc.CompPrefabInfo",
"fileId": "94OK1DwMRAl7qOBrTxG/i4"
},
{
"__type__": "cc.Label",
"_name": "",
"_objFlags": 0,
"__editorExtras__": {},
"node": {
"__id__": 58
},
"_enabled": true,
"__prefab": {
"__id__": 62
},
"_customMaterial": null,
"_srcBlendFactor": 2,
"_dstBlendFactor": 4,
"_color": {
"__type__": "cc.Color",
"r": 255,
"g": 255,
"b": 255,
"a": 255
},
"_string": "2",
"_horizontalAlign": 1,
"_verticalAlign": 1,
"_actualFontSize": 20,
"_fontSize": 20,
"_fontFamily": "Arial",
"_lineHeight": 40,
"_overflow": 0,
"_enableWrapText": true,
"_font": null,
"_isSystemFontUsed": true,
"_spacingX": 0,
"_isItalic": false,
"_isBold": true,
"_isUnderline": false,
"_underlineHeight": 2,
"_cacheMode": 0,
"_enableOutline": true,
"_outlineColor": {
"__type__": "cc.Color",
"r": 0,
"g": 0,
"b": 0,
"a": 255
},
"_outlineWidth": 2,
"_enableShadow": false,
"_shadowColor": {
"__type__": "cc.Color",
"r": 0,
"g": 0,
"b": 0,
"a": 255
},
"_shadowOffset": {
"__type__": "cc.Vec2",
"x": 2,
"y": 2
},
"_shadowBlur": 2,
"_id": ""
},
{
"__type__": "cc.CompPrefabInfo",
"fileId": "38htj7TVBI84FdhXPqZi9Y"
},
{
"__type__": "cc.PrefabInfo",
"root": {
"__id__": 1
},
"asset": {
"__id__": 0
},
"fileId": "5aV+d4uupA3430zZytYs+/",
"instance": null,
"targetOverrides": null,
"nestedPrefabInstanceRoots": null
},
{
"__type__": "cc.UITransform",
"_name": "",
"_objFlags": 0,
"__editorExtras__": {},
"node": {
"__id__": 51
},
"_enabled": true,
"__prefab": {
"__id__": 65
},
"_contentSize": {
"__type__": "cc.Size",
"width": 42.123046875,
"height": 30
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_id": ""
},
{
"__type__": "cc.CompPrefabInfo",
"fileId": "daubq3MHBCvZhVT7CCunA4"
},
{
"__type__": "cc.Layout",
"_name": "",
"_objFlags": 0,
"__editorExtras__": {},
"node": {
"__id__": 51
},
"_enabled": true,
"__prefab": {
"__id__": 67
},
"_resizeMode": 1,
"_layoutType": 1,
"_cellSize": {
"__type__": "cc.Size",
"width": 40,
"height": 40
},
"_startAxis": 0,
"_paddingLeft": 0,
"_paddingRight": 0,
"_paddingTop": 0,
"_paddingBottom": 0,
"_spacingX": 0,
"_spacingY": 0,
"_verticalDirection": 1,
"_horizontalDirection": 0,
"_constraint": 0,
"_constraintNum": 2,
"_affectedByScale": false,
"_isAlign": false,
"_id": ""
},
{
"__type__": "cc.CompPrefabInfo",
"fileId": "867zQklidJAJ9K6dAQWCB6"
},
{
"__type__": "cc.PrefabInfo",
"root": {
"__id__": 1
},
"asset": {
"__id__": 0
},
"fileId": "32ZgIQHstCXYwNDGBH6HPk",
"instance": null,
"targetOverrides": null,
"nestedPrefabInstanceRoots": null
},
{
"__type__": "cc.UITransform",
"_name": "",
@@ -1258,7 +1697,7 @@
},
"_enabled": true,
"__prefab": {
"__id__": 52
"__id__": 70
},
"_contentSize": {
"__type__": "cc.Size",
@@ -1286,14 +1725,14 @@
},
"_enabled": true,
"__prefab": {
"__id__": 54
"__id__": 72
},
"_alignFlags": 45,
"_target": null,
"_left": 0,
"_right": 0,
"_top": 6.737500000000004,
"_bottom": 7.762500000000003,
"_top": 6.737500000000001,
"_bottom": 7.762499999999999,
"_horizontalCenter": 0,
"_verticalCenter": 0,
"_isAbsLeft": true,
@@ -1322,7 +1761,7 @@
},
"_enabled": true,
"__prefab": {
"__id__": 56
"__id__": 74
},
"_resizeMode": 1,
"_layoutType": 2,
@@ -1373,7 +1812,7 @@
},
"_enabled": true,
"__prefab": {
"__id__": 59
"__id__": 77
},
"_contentSize": {
"__type__": "cc.Size",

File diff suppressed because it is too large Load Diff

View File

@@ -49,6 +49,7 @@ export enum FightSet {
REFRESH_COST = 2,
BASE_COST = 5,
INIT_COIN = 7, // 初始金币数
INIT_REFRESH_STONE = 3, // 初始刷新石数量
}
/**

View File

@@ -94,9 +94,6 @@ export class MissionCardComp extends CCComp {
/** 卡牌槽位预制体(动态实例化 3 个) */
@property(Prefab)
cardPrefab: Prefab = null!
/** 抽卡(刷新)按钮节点 */
@property(Node)
cards_chou: Node = null!
@property(Node)
closeCards: Node = null!
@@ -143,35 +140,33 @@ export class MissionCardComp extends CCComp {
shopBoxNode: Node = null!
@property(Prefab)
itemPrefab: Prefab = null!
/** 卡池升级按钮节点(已废弃,保留节点引用防止 editor 报错) */
@property(Node)
cards_up: Node = null!
/** 金币显示节点(含 icon + num 子节点) */
@property(Node)
coins_node: Node = null!
/** 卡池等级显示节点(已废弃,保留节点引用) */
@property(Node)
pool_lv_node: Node = null!
/** 英雄数量显示节点(含 icon + num 子节点) */
@property(Node)
hero_num_node: Node = null!
/** 技能刷新按钮节点 */
@property(Node)
skill_refresh: Node = null!
/** 槽位水平坐标(屏幕 720 三等分,卡片 230列宽 240 */
private readonly slotPosX: number[] = [-240, 0, 240];
/** 装备刷新按钮节点 */
@property(Node)
equip_refresh: Node = null!;
/** 药品刷新按钮节点 */
@property(Node)
shop_refresh: Node = null!;
/** 抽卡(刷新)按钮节点 */
@property(Node)
cards_chou: Node = null!
/** 金币显示节点(含 icon + num 子节点) */
@property(Node)
coins_node: Node = null!
/** 英雄数量显示节点(含 icon + num 子节点) */
@property(Node)
hero_num_node: Node = null!
// ======================== 运行时状态 ========================
/** 槽位水平坐标(屏幕 720 三等分,卡片 230列宽 240 */
private readonly slotPosX: number[] = [-240, 0, 240];
/** 三个槽位对应的 CHeroComp 控制器缓存(有序数组) */
private cardComps: CHeroComp[] = [];
/** 英雄面板 HeroBoxComp 控制器缓存(与场上英雄一一对应,最多 3 个) */
@@ -1712,52 +1707,62 @@ export class MissionCardComp extends CCComp {
}
private updateDrawCostUI() {
// 战斗阶段也允许抽卡nobg 统一按"金币是否足够"判断
if (this.cards_chou) {
const nobg = this.cards_chou.getChildByName("nobg");
if (nobg) {
nobg.active = !this.canDrawCards();
}
const coinNode = this.cards_chou.getChildByName("coin");
const numLabel = coinNode?.getChildByName("num")?.getComponent(Label);
if (numLabel) {
numLabel.string = `${MissionEconomy.getRefreshCost(this.refreshCost)}`;
const stones = MissionEconomy.getRefreshStone();
this.updateOneRefreshBtnUI(this.cards_chou, stones);
this.updateOneRefreshBtnUI(this.equip_refresh, stones);
this.updateOneRefreshBtnUI(this.shop_refresh, stones);
this.updateOneRefreshBtnUI(this.skill_refresh, stones);
}
/**
* 更新单个刷新按钮的费用显示与可用状态。
*
* 统一 UI 结构(按钮节点下):
* - 背景 :按钮底图
* - nobg :置灰遮罩,不可刷新时激活
* - Node/ :费用容器,下含 Label + coin + stone
* - coin/ :金币费用(含 num 子节点 Label刷新石=0 时显示
* - stone/ :刷新石费用(含 num 子节点 Label刷新石>0 时显示
*
* @param btnNode 刷新按钮节点
* @param stones 当前刷新石数量(外部统一读取,避免 4 次重复访问)
*/
private updateOneRefreshBtnUI(btnNode: Node | null, stones: number) {
if (!btnNode || !btnNode.isValid) return;
const useStone = stones > 0;
// 置灰遮罩:有刷新石必定可刷新,否则按金币判断
const nobg = btnNode.getChildByName("nobg");
if (nobg) {
nobg.active = useStone ? false : !this.canDrawCards();
}
// 费用容器:按钮下的 Node 子节点(统一结构:背景 + Node[Label/coin/stone]
const container = btnNode.getChildByName("Node");
if (!container) return;
// 金币费用节点
const coinNode = container.getChildByName("coin");
if (coinNode) {
coinNode.active = !useStone;
if (!useStone) {
const numLabel = coinNode.getChildByName("num")?.getComponent(Label);
if (numLabel) {
numLabel.string = `${MissionEconomy.getRefreshCost(this.refreshCost)}`;
}
}
}
if (this.equip_refresh) {
const nobg = this.equip_refresh.getChildByName("nobg");
if (nobg) {
nobg.active = !this.canDrawCards();
}
const coinNode = this.equip_refresh.getChildByName("coin");
const numLabel = coinNode?.getChildByName("num")?.getComponent(Label);
if (numLabel) {
numLabel.string = `${MissionEconomy.getRefreshCost(this.refreshCost)}`;
}
}
if (this.shop_refresh) {
const nobg = this.shop_refresh.getChildByName("nobg");
if (nobg) {
nobg.active = !this.canDrawCards();
}
const coinNode = this.shop_refresh.getChildByName("coin");
const numLabel = coinNode?.getChildByName("num")?.getComponent(Label);
if (numLabel) {
numLabel.string = `${MissionEconomy.getRefreshCost(this.refreshCost)}`;
}
}
if (this.skill_refresh) {
const nobg = this.skill_refresh.getChildByName("nobg");
if (nobg) {
nobg.active = !this.canDrawCards();
}
const coinNode = this.skill_refresh.getChildByName("coin");
const numLabel = coinNode?.getChildByName("num")?.getComponent(Label);
if (numLabel) {
numLabel.string = `${MissionEconomy.getRefreshCost(this.refreshCost)}`;
// 刷新石费用节点(显示当前持有数量)
const stoneNode = container.getChildByName("stone");
if (stoneNode) {
stoneNode.active = useStone;
if (useStone) {
const numLabel = stoneNode.getChildByName("num")?.getComponent(Label);
if (numLabel) {
numLabel.string = `${stones}`;
}
}
}
}