feat(天赋系统): 实现天赋选择功能并完善卡片交互逻辑
添加天赋选择事件触发机制，在战斗开始时触发天赋选择界面 重构MissionCardComp类，实现天赋卡片的随机生成、显示和选择功能 为卡片添加选中状态标记和交互处理 更新prefab资源以支持新的天赋选择界面
This commit is contained in:
walkpan
@@ -1,73 +1,169 @@
|
||||
import { _decorator, Label, Node } 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 { oops } from "../../../../extensions/oops-plugin-framework/assets/core/Oops";
|
||||
import { GameEvent } from "../common/config/GameEvent";
|
||||
import { talConf, ItalConf } from "../common/config/TalSet";
|
||||
|
||||
const { ccclass, property } = _decorator;
|
||||
|
||||
/** 视图层对象 */
|
||||
@ccclass('ModuleViewComp')
|
||||
@ecs.register('ModuleView', false)
|
||||
export class ModuleViewComp extends CCComp {
|
||||
@ccclass('MissionCardComp')
|
||||
@ecs.register('MissionCard', false)
|
||||
export class MissionCardComp extends CCComp {
|
||||
/** 视图层逻辑代码分离演示 */
|
||||
@property(Node)
|
||||
card1:Node = null
|
||||
card1:Node = null!
|
||||
@property(Node)
|
||||
card2:Node = null
|
||||
card2:Node = null!
|
||||
@property(Node)
|
||||
card3:Node = null
|
||||
card3:Node = null!
|
||||
@property(Node)
|
||||
card4:Node = null
|
||||
card4:Node = null!
|
||||
|
||||
card1_data:ItalConf = null!
|
||||
card2_data:ItalConf = null!
|
||||
card3_data:ItalConf = null!
|
||||
card4_data:ItalConf = null!
|
||||
|
||||
onLoad() {
|
||||
oops.message.on(GameEvent.TalentSelect, this.onTalentSelect, this);
|
||||
}
|
||||
|
||||
onDestroy() {
|
||||
oops.message.off(GameEvent.TalentSelect, this.onTalentSelect, this);
|
||||
this.ent.destroy();
|
||||
}
|
||||
|
||||
card1_data:any = {}
|
||||
card2_data:any = {}
|
||||
card3_data:any = {}
|
||||
card4_data:any = {}
|
||||
start() {
|
||||
this.card1.active=true
|
||||
this.card2.active=true
|
||||
this.card3.active=true
|
||||
this.card4.active=true
|
||||
// 初始隐藏或显示逻辑
|
||||
this.node.active = false;
|
||||
this.resetCardStates();
|
||||
}
|
||||
|
||||
private resetCardStates() {
|
||||
const cards = [this.card1, this.card2, this.card3, this.card4];
|
||||
cards.forEach(card => {
|
||||
if (card) {
|
||||
const selected = card.getChildByName("selected");
|
||||
if (selected) selected.active = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// 是否已经选择了天赋
|
||||
private hasSelected: boolean = false;
|
||||
|
||||
private onTalentSelect(event: string, args: any) {
|
||||
this.node.active = true;
|
||||
this.hasSelected = false; // 重置选择状态
|
||||
this.resetCardStates(); // 每次刷新前重置卡片状态
|
||||
this.refCards();
|
||||
}
|
||||
|
||||
refCards(){
|
||||
// 随机获取4个不一样的天赋
|
||||
const allTalents = Object.values(talConf);
|
||||
const result: ItalConf[] = [];
|
||||
const temp = [...allTalents];
|
||||
|
||||
// 简单的随机抽取算法
|
||||
for (let i = 0; i < 4 && temp.length > 0; i++) {
|
||||
const index = Math.floor(Math.random() * temp.length);
|
||||
result.push(temp[index]);
|
||||
temp.splice(index, 1);
|
||||
}
|
||||
|
||||
// 更新卡片
|
||||
if (result.length > 0) this.updateCardData(1, result[0]);
|
||||
if (result.length > 1) this.updateCardData(2, result[1]);
|
||||
if (result.length > 2) this.updateCardData(3, result[2]);
|
||||
if (result.length > 3) this.updateCardData(4, result[3]);
|
||||
}
|
||||
updateCardInfo(card:Node,data:any){
|
||||
|
||||
updateCardInfo(card:Node, data:ItalConf){
|
||||
if(!card) return
|
||||
card.active = true;
|
||||
// 隐藏选中状态
|
||||
const selected = card.getChildByName("selected");
|
||||
if(selected) selected.active = false;
|
||||
|
||||
let name = card.getChildByName("name")
|
||||
if(name){
|
||||
name.getComponent(Label).string = data.name
|
||||
name.getComponent(Label)!.string = data.name
|
||||
}
|
||||
let info = card.getChildByName("info").getChildByName("Label")
|
||||
let info = card.getChildByName("info")?.getChildByName("Label")
|
||||
if(info){
|
||||
info.getComponent(Label).string = data.info
|
||||
info.getComponent(Label)!.string = data.desc
|
||||
}
|
||||
}
|
||||
updateCardData(index:number,data:any){
|
||||
|
||||
updateCardData(index:number, data:ItalConf){
|
||||
switch (index) {
|
||||
case 1:
|
||||
this.card1_data = data
|
||||
this.updateCardInfo(this.card1, data);
|
||||
break;
|
||||
case 2:
|
||||
this.card2_data = data
|
||||
this.updateCardInfo(this.card2, data);
|
||||
break;
|
||||
case 3:
|
||||
this.card3_data = data
|
||||
this.updateCardInfo(this.card3, data);
|
||||
break;
|
||||
case 4:
|
||||
this.card4_data = data
|
||||
this.updateCardInfo(this.card4, data);
|
||||
break;
|
||||
}
|
||||
}
|
||||
selectCard(index:number){
|
||||
|
||||
|
||||
selectCard(e:any,index:string){
|
||||
console.log("selectCard",index)
|
||||
let _index = parseInt(index);
|
||||
// 如果已经选择过，则不再处理
|
||||
if(this.hasSelected) return;
|
||||
|
||||
let selectedTalent: ItalConf | null = null;
|
||||
let selectedCardNode: Node | null = null;
|
||||
|
||||
switch (_index) {
|
||||
case 1:
|
||||
selectedTalent = this.card1_data;
|
||||
selectedCardNode = this.card1;
|
||||
break;
|
||||
case 2:
|
||||
selectedTalent = this.card2_data;
|
||||
selectedCardNode = this.card2;
|
||||
break;
|
||||
case 3:
|
||||
selectedTalent = this.card3_data;
|
||||
selectedCardNode = this.card3;
|
||||
break;
|
||||
case 4:
|
||||
selectedTalent = this.card4_data;
|
||||
selectedCardNode = this.card4;
|
||||
break;
|
||||
}
|
||||
|
||||
if (selectedTalent && selectedCardNode) {
|
||||
this.hasSelected = true;
|
||||
console.log("选择天赋:", selectedTalent.name);
|
||||
|
||||
// 显示当前选中的 selected 节点
|
||||
const selected = selectedCardNode.getChildByName("selected");
|
||||
if(selected) selected.active = true;
|
||||
|
||||
// 发送事件
|
||||
oops.message.dispatchEvent(GameEvent.UseTalentCard, selectedTalent.uuid);
|
||||
|
||||
// 延迟关闭界面，让玩家看到选中效果
|
||||
// this.scheduleOnce(() => {
|
||||
// this.node.active = false;
|
||||
// }, 0.5);
|
||||
}
|
||||
}
|
||||
/** 全局消息逻辑处理 */
|
||||
// private onHandler(event: string, args: any) {
|
||||
// switch (event) {
|
||||
// case ModuleEvent.Cmd:
|
||||
// break;
|
||||
// }
|
||||
// }
|
||||
|
||||
/** 视图对象通过 ecs.Entity.remove(ModuleViewComp) 删除组件是触发组件处理自定义释放逻辑 */
|
||||
reset() {
|
||||
|
||||
@@ -147,6 +147,7 @@ export class MissionComp extends CCComp {
|
||||
to_fight(){
|
||||
smc.mission.in_fight=true
|
||||
oops.message.dispatchEvent(GameEvent.FightStart) //GameSetMonComp 监听刷怪
|
||||
oops.message.dispatchEvent(GameEvent.TalentSelect)
|
||||
}
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user