lawless/client/assets/scripts/ui/screens/CombatScreen.ts
徐勤民 521603a899
一些检测仍在等待运行
Docs Build / build-and-deploy (push) Waiting to run
refactor(client): 删除游戏核心管理器和场景脚本
- 移除 ConfigManager 配置管理器类
- 移除 GameManager 全局单例管理器类
- 移除 NetworkManager 网络连接管理器类
- 移除 CharacterData 和 ItemData 数据模型类
- 移除 BagScene、BattleScene、LobbyScene 等场景脚本
- 移除 EncounterBubble 和 EventFeedPanel UI组件脚本
- 更新代理邀请文档中的服务器连接方式
- 更新同步状态表格中的代理任务分配信息
- 添加 MiMo 任务完成总结和审查修复记录
2026-07-03 21:34:51 +08:00

249 行
8.8 KiB
TypeScript

此文件含有模棱两可的 Unicode 字符

此文件含有可能会与其他字符混淆的 Unicode 字符。 如果您是想特意这样的,可以安全地忽略该警告。 使用 Escape 按钮显示他们。

import { _decorator, Component, Node, Label, Sprite, Color, UITransform, Size, Layout, ScrollView } from 'cc';
import { UITheme } from '../common/UITheme';
import { UIBase } from '../common/UIBase';
const { ccclass, property } = _decorator;
/**
* 战斗界面
* 基于江湖截图ATB即时制战斗 + 文字战报
* 顶部:战斗目标 + 血条
* 中部:双方角色展示
* 底部:战报日志 + 结束战斗按钮
*/
@ccclass('CombatScreen')
export class CombatScreen extends UIBase {
@property(Node) combatHeader: Node = null!;
@property(Node) characterDisplay: Node = null!;
@property(Node) battleLog: Node = null!;
@property(Node) combatFooter: Node = null!;
start() {
this.initCombatHeader();
this.initCharacterDisplay();
this.initBattleLog();
this.initCombatFooter();
}
/**
* 战斗头部
* 正在讨伐 + 目标名称 + 目标血条
*/
private initCombatHeader() {
if (!this.combatHeader) return;
const transform = this.combatHeader.getComponent(UITransform) || this.combatHeader.addComponent(UITransform);
transform.setContentSize(new Size(720, 120));
// 讨伐提示
const tipNode = new Node('Tip');
const tipLabel = tipNode.addComponent(Label);
tipLabel.string = '正在讨伐';
tipLabel.fontSize = UITheme.FONT_SIZE.MD;
tipLabel.color = this.hexToColor(UITheme.COLORS.TEXT_NORMAL);
tipNode.setParent(this.combatHeader);
// 目标名称
const targetNode = new Node('Target');
const targetLabel = targetNode.addComponent(Label);
targetLabel.string = '胡威';
targetLabel.fontSize = UITheme.FONT_SIZE.LG;
targetLabel.color = this.hexToColor(UITheme.COLORS.TEXT_RED);
targetNode.setParent(this.combatHeader);
// 目标血条
const hpBar = this.createBar(this.combatHeader, {
width: 500, height: 20,
fillColor: UITheme.COLORS.HP_BAR,
bgColor: UITheme.COLORS.HP_BAR_BG,
value: 85,
maxValue: 100,
});
// 剩余血量
const hpLabel = new Node('HP');
const hp = hpLabel.addComponent(Label);
hp.string = 'x997';
hp.fontSize = UITheme.FONT_SIZE.SM;
hp.color = this.hexToColor(UITheme.COLORS.TEXT_RED);
hpLabel.setParent(this.combatHeader);
}
/**
* 角色展示区
* 己方角色 + 敌方角色
*/
private initCharacterDisplay() {
if (!this.characterDisplay) return;
const transform = this.characterDisplay.getComponent(UITransform) || this.characterDisplay.addComponent(UITransform);
transform.setContentSize(new Size(720, 300));
// 己方角色
const playerNode = new Node('Player');
const playerTransform = playerNode.addComponent(UITransform);
playerTransform.setContentSize(new Size(200, 280));
playerNode.setParent(this.characterDisplay);
// 己方头像
const playerAvatar = new Node('Avatar');
const playerAvatarLabel = playerAvatar.addComponent(Label);
playerAvatarLabel.string = '🧙';
playerAvatarLabel.fontSize = 80;
playerAvatar.setParent(playerNode);
// 己方名称
const playerName = new Node('Name');
const playerNameLabel = playerName.addComponent(Label);
playerNameLabel.string = '角色名';
playerNameLabel.fontSize = UITheme.FONT_SIZE.SM;
playerNameLabel.color = this.hexToColor(UITheme.COLORS.TEXT_GREEN);
playerName.setParent(playerNode);
// 己方血条
const playerHp = this.createBar(playerNode, {
width: 180, height: 16,
fillColor: UITheme.COLORS.HP_BAR,
bgColor: UITheme.COLORS.HP_BAR_BG,
value: 70,
maxValue: 100,
});
// 敌方角色
const enemyNode = new Node('Enemy');
const enemyTransform = enemyNode.addComponent(UITransform);
enemyTransform.setContentSize(new Size(200, 280));
enemyNode.setParent(this.characterDisplay);
// 敌方头像
const enemyAvatar = new Node('Avatar');
const enemyAvatarLabel = enemyAvatar.addComponent(Label);
enemyAvatarLabel.string = '👹';
enemyAvatarLabel.fontSize = 80;
enemyAvatar.setParent(enemyNode);
// 敌方名称
const enemyName = new Node('Name');
const enemyNameLabel = enemyName.addComponent(Label);
enemyNameLabel.string = '胡威';
enemyNameLabel.fontSize = UITheme.FONT_SIZE.SM;
enemyNameLabel.color = this.hexToColor(UITheme.COLORS.TEXT_RED);
enemyName.setParent(enemyNode);
// 敌方血条
const enemyHp = this.createBar(enemyNode, {
width: 180, height: 16,
fillColor: UITheme.COLORS.HP_BAR,
bgColor: UITheme.COLORS.HP_BAR_BG,
value: 85,
maxValue: 100,
});
// 战斗技能展示
const skillNode = new Node('Skill');
const skillLabel = skillNode.addComponent(Label);
skillLabel.string = '蛟龙游离剑';
skillLabel.fontSize = UITheme.FONT_SIZE.MD;
skillLabel.color = this.hexToColor(UITheme.COLORS.TEXT_BLUE);
skillNode.setParent(this.characterDisplay);
}
/**
* 战报日志区
* 滚动文本区域,显示战斗过程
*/
private initBattleLog() {
if (!this.battleLog) return;
const transform = this.battleLog.getComponent(UITransform) || this.battleLog.addComponent(UITransform);
transform.setContentSize(new Size(720, 400));
// 战报内容
const logContent = new Node('LogContent');
const logLabel = logContent.addComponent(Label);
logLabel.string = `【第1回合】
你稍作运功舞出伐喃狂舞剑,顷刻间身形仿佛消失在风沙之中,接着白光一闪,未等胡威反应,已被打掉了312057点气血。
你使出这招伐喃狂舞剑后,步伐更加灵活,在接下来的2回合内闪避和识破获得了提升
胡威身上的多处伤口造成了51953点气血损伤。
【第2回合】
你不紧不慢的使出蛟龙游离剑,身似蛟龙般闪过,胡威来不及反应损失了155730点气血。
你使出这招蛟龙游离剑后越战越勇,剑法威力在接下来的三回合内显著增加。`;
logLabel.fontSize = UITheme.FONT_SIZE.SM;
logLabel.color = this.hexToColor(UITheme.COLORS.TEXT_NORMAL);
logLabel.overflow = Label.Overflow.CLAMP;
logLabel.lineHeight = 28;
logContent.setParent(this.battleLog);
// 战斗事件高亮
const eventNode = new Node('Event');
const eventLabel = eventNode.addComponent(Label);
eventLabel.string = '【第4回合】';
eventLabel.fontSize = UITheme.FONT_SIZE.MD;
eventLabel.color = this.hexToColor(UITheme.COLORS.TEXT_GOLD);
eventNode.setParent(this.battleLog);
}
/**
* 战斗底部
* 结束战斗按钮
*/
private initCombatFooter() {
if (!this.combatFooter) return;
const transform = this.combatFooter.getComponent(UITransform) || this.combatFooter.addComponent(UITransform);
transform.setContentSize(new Size(720, 80));
const endBtn = this.createButton(this.combatFooter, '结束战斗', {
width: 200, height: 50,
bgColor: UITheme.COLORS.BG_CARD,
textColor: UITheme.COLORS.TEXT_GOLD,
});
}
/**
* 添加战斗日志条目
*/
addLogEntry(text: string, type: 'normal' | 'damage' | 'heal' | 'skill' | 'event' = 'normal') {
if (!this.battleLog) return;
const colorMap = {
normal: UITheme.COLORS.TEXT_NORMAL,
damage: UITheme.COLORS.TEXT_RED,
heal: UITheme.COLORS.TEXT_GREEN,
skill: UITheme.COLORS.TEXT_BLUE,
event: UITheme.COLORS.TEXT_GOLD,
};
const entryNode = new Node('LogEntry');
const label = entryNode.addComponent(Label);
label.string = text;
label.fontSize = UITheme.FONT_SIZE.SM;
label.color = this.hexToColor(colorMap[type]);
label.lineHeight = 28;
entryNode.setParent(this.battleLog);
}
/**
* 更新敌方血条
*/
updateEnemyHP(current: number, max: number) {
// 实现血条动画更新
}
/**
* 显示伤害数字
*/
showDamageNumber(value: number, isCrit: boolean = false) {
const node = new Node('Damage');
const label = node.addComponent(Label);
label.string = `-${value}`;
label.fontSize = isCrit ? UITheme.FONT_SIZE.XL : UITheme.FONT_SIZE.LG;
label.color = isCrit
? this.hexToColor(UITheme.COLORS.TEXT_ORANGE)
: this.hexToColor(UITheme.COLORS.TEXT_RED);
node.setParent(this.characterDisplay);
}
}