521603a899
一些检测仍在等待运行
Docs Build / build-and-deploy (push) Waiting to run
- 移除 ConfigManager 配置管理器类 - 移除 GameManager 全局单例管理器类 - 移除 NetworkManager 网络连接管理器类 - 移除 CharacterData 和 ItemData 数据模型类 - 移除 BagScene、BattleScene、LobbyScene 等场景脚本 - 移除 EncounterBubble 和 EventFeedPanel UI组件脚本 - 更新代理邀请文档中的服务器连接方式 - 更新同步状态表格中的代理任务分配信息 - 添加 MiMo 任务完成总结和审查修复记录
302 行
10 KiB
TypeScript
302 行
10 KiB
TypeScript
import { _decorator, Component, Node, Label, Sprite, Color, UITransform, Size, Layout, Widget } from 'cc';
|
||
import { UITheme } from '../common/UITheme';
|
||
import { UIBase } from '../common/UIBase';
|
||
|
||
const { ccclass, property } = _decorator;
|
||
|
||
/**
|
||
* 主界面 - 吐纳（修炼）界面
|
||
* 基于江湖截图：顶部角色信息栏 + 修炼区域 + 底部导航
|
||
*/
|
||
@ccclass('MainScreen')
|
||
export class MainScreen extends UIBase {
|
||
|
||
@property(Node) topBar: Node = null!;
|
||
@property(Node) characterArea: Node = null!;
|
||
@property(Node) cultivationArea: Node = null!;
|
||
@property(Node) newsArea: Node = null!;
|
||
@property(Node) bottomNav: Node = null!;
|
||
|
||
start() {
|
||
this.initTopBar();
|
||
this.initCharacterArea();
|
||
this.initCultivationArea();
|
||
this.initNewsArea();
|
||
this.initBottomNav();
|
||
}
|
||
|
||
/**
|
||
* 顶部信息栏
|
||
* 包含：角色头像、身家财产、江湖名望、内力/悟性
|
||
*/
|
||
private initTopBar() {
|
||
if (!this.topBar) return;
|
||
|
||
const topBarLayout = this.topBar.addComponent(Layout);
|
||
topBarLayout.type = Layout.Type.VERTICAL;
|
||
topBarLayout.resizeMode = Layout.ResizeMode.CONTAINER;
|
||
|
||
// 资源栏
|
||
const resourceBar = this.createResourceBar();
|
||
resourceBar.setParent(this.topBar);
|
||
|
||
// 角色信息
|
||
const charInfo = this.createCharacterInfo();
|
||
charInfo.setParent(this.topBar);
|
||
|
||
// 内力/悟性
|
||
const statsBar = this.createStatsBar();
|
||
statsBar.setParent(this.topBar);
|
||
}
|
||
|
||
private createResourceBar(): Node {
|
||
const node = new Node('ResourceBar');
|
||
const transform = node.addComponent(UITransform);
|
||
transform.setContentSize(new Size(720, 80));
|
||
node.setParent(this.topBar);
|
||
|
||
// 身家财产标签
|
||
const wealthLabel = new Node('WealthLabel');
|
||
const label = wealthLabel.addComponent(Label);
|
||
label.string = '身家财产';
|
||
label.fontSize = UITheme.FONT_SIZE.SM;
|
||
label.color = this.hexToColor(UITheme.COLORS.TEXT_NORMAL);
|
||
wealthLabel.setParent(node);
|
||
|
||
// 铜钱图标+数值
|
||
const copperNode = new Node('Copper');
|
||
const copperLabel = copperNode.addComponent(Label);
|
||
copperLabel.string = '🪙 389953';
|
||
copperLabel.fontSize = UITheme.FONT_SIZE.MD;
|
||
copperLabel.color = this.hexToColor(UITheme.COLORS.GOLD_PRIMARY);
|
||
copperNode.setParent(node);
|
||
|
||
// 灵石图标+数值
|
||
const stoneNode = new Node('SpiritStone');
|
||
const stoneLabel = stoneNode.addComponent(Label);
|
||
stoneLabel.string = '💎 0';
|
||
stoneLabel.fontSize = UITheme.FONT_SIZE.MD;
|
||
stoneLabel.color = this.hexToColor(UITheme.COLORS.TEXT_BLUE);
|
||
stoneNode.setParent(node);
|
||
|
||
return node;
|
||
}
|
||
|
||
private createCharacterInfo(): Node {
|
||
const node = new Node('CharacterInfo');
|
||
const transform = node.addComponent(UITransform);
|
||
transform.setContentSize(new Size(720, 100));
|
||
node.setParent(this.topBar);
|
||
|
||
// 角色名
|
||
const nameLabel = new Node('Name');
|
||
const label = nameLabel.addComponent(Label);
|
||
label.string = '角色名';
|
||
label.fontSize = UITheme.FONT_SIZE.LG;
|
||
label.color = this.hexToColor(UITheme.COLORS.TEXT_GOLD);
|
||
nameLabel.setParent(node);
|
||
|
||
// 称号
|
||
const titleNode = new Node('Title');
|
||
const titleLabel = titleNode.addComponent(Label);
|
||
titleLabel.string = '锐不可挡';
|
||
titleLabel.fontSize = UITheme.FONT_SIZE.SM;
|
||
titleLabel.color = this.hexToColor(UITheme.COLORS.TEXT_ORANGE);
|
||
titleNode.setParent(node);
|
||
|
||
// 江湖名望
|
||
const fameNode = new Node('Fame');
|
||
const fameLabel = fameNode.addComponent(Label);
|
||
fameLabel.string = '江湖名望：独孤求败 | 3387598';
|
||
fameLabel.fontSize = UITheme.FONT_SIZE.SM;
|
||
fameLabel.color = this.hexToColor(UITheme.COLORS.TEXT_NORMAL);
|
||
fameNode.setParent(node);
|
||
|
||
return node;
|
||
}
|
||
|
||
private createStatsBar(): Node {
|
||
const node = new Node('StatsBar');
|
||
const transform = node.addComponent(UITransform);
|
||
transform.setContentSize(new Size(720, 60));
|
||
node.setParent(this.topBar);
|
||
|
||
const neiLiLabel = new Node('NeiLi');
|
||
const label = neiLiLabel.addComponent(Label);
|
||
label.string = '内力：65,075,153,913';
|
||
label.fontSize = UITheme.FONT_SIZE.SM;
|
||
label.color = this.hexToColor(UITheme.COLORS.TEXT_WHITE);
|
||
neiLiLabel.setParent(node);
|
||
|
||
const wuXingLabel = new Node('WuXing');
|
||
const wuXing = wuXingLabel.addComponent(Label);
|
||
wuXing.string = '悟性：26,459,801';
|
||
wuXing.fontSize = UITheme.FONT_SIZE.SM;
|
||
wuXing.color = this.hexToColor(UITheme.COLORS.TEXT_GREEN);
|
||
wuXingLabel.setParent(node);
|
||
|
||
return node;
|
||
}
|
||
|
||
/**
|
||
* 角色展示区域
|
||
* 包含：角色立绘/头像 + 火焰特效
|
||
*/
|
||
private initCharacterArea() {
|
||
if (!this.characterArea) return;
|
||
|
||
const transform = this.characterArea.getComponent(UITransform) || this.characterArea.addComponent(UITransform);
|
||
transform.setContentSize(new Size(720, 400));
|
||
}
|
||
|
||
/**
|
||
* 修炼区域
|
||
* 包含：经脉信息、修炼按钮、丹田、外练/内练
|
||
*/
|
||
private initCultivationArea() {
|
||
if (!this.cultivationArea) return;
|
||
|
||
const layout = this.cultivationArea.addComponent(Layout);
|
||
layout.type = Layout.Type.VERTICAL;
|
||
layout.resizeMode = Layout.ResizeMode.CONTAINER;
|
||
|
||
// 经脉信息
|
||
const meridianInfo = this.createMeridianInfo();
|
||
meridianInfo.setParent(this.cultivationArea);
|
||
|
||
// 修炼按钮区
|
||
const cultivationBtns = this.createCultivationButtons();
|
||
cultivationBtns.setParent(this.cultivationArea);
|
||
}
|
||
|
||
private createMeridianInfo(): Node {
|
||
const node = new Node('MeridianInfo');
|
||
const transform = node.addComponent(UITransform);
|
||
transform.setContentSize(new Size(680, 120));
|
||
node.setParent(this.cultivationArea);
|
||
|
||
const titleLabel = new Node('Title');
|
||
const label = titleLabel.addComponent(Label);
|
||
label.string = '督脉';
|
||
label.fontSize = UITheme.FONT_SIZE.MD;
|
||
label.color = this.hexToColor(UITheme.COLORS.TEXT_GOLD);
|
||
titleLabel.setParent(node);
|
||
|
||
const detailLabel = new Node('Detail');
|
||
const detail = detailLabel.addComponent(Label);
|
||
detail.string = '神庭穴 | 逆行十七阶三层';
|
||
detail.fontSize = UITheme.FONT_SIZE.SM;
|
||
detail.color = this.hexToColor(UITheme.COLORS.TEXT_WHITE);
|
||
detailLabel.setParent(node);
|
||
|
||
return node;
|
||
}
|
||
|
||
private createCultivationButtons(): Node {
|
||
const node = new Node('CultivationButtons');
|
||
const transform = node.addComponent(UITransform);
|
||
transform.setContentSize(new Size(680, 200));
|
||
node.setParent(this.cultivationArea);
|
||
|
||
// 丹田按钮
|
||
const danTianBtn = this.createButton(node, '丹 田', {
|
||
width: 160, height: 50,
|
||
bgColor: UITheme.COLORS.BG_CARD,
|
||
textColor: UITheme.COLORS.TEXT_GOLD,
|
||
});
|
||
|
||
// 江湖历练按钮
|
||
const lianLiBtn = this.createButton(node, '江湖历练', {
|
||
width: 160, height: 50,
|
||
bgColor: UITheme.COLORS.BG_CARD,
|
||
textColor: UITheme.COLORS.TEXT_GOLD,
|
||
});
|
||
|
||
// 外练按钮
|
||
const waiLianBtn = this.createButton(node, '外 练', {
|
||
width: 160, height: 50,
|
||
bgColor: UITheme.COLORS.BG_CARD,
|
||
textColor: UITheme.COLORS.TEXT_GOLD,
|
||
});
|
||
|
||
// 内练中按钮
|
||
const neiLianBtn = this.createButton(node, '内练中', {
|
||
width: 160, height: 50,
|
||
bgColor: UITheme.COLORS.BG_CARD,
|
||
textColor: UITheme.COLORS.TEXT_GREEN,
|
||
});
|
||
|
||
return node;
|
||
}
|
||
|
||
/**
|
||
* 江湖见闻录区域
|
||
* 显示游戏世界动态消息
|
||
*/
|
||
private initNewsArea() {
|
||
if (!this.newsArea) return;
|
||
|
||
const transform = this.newsArea.getComponent(UITransform) || this.newsArea.addComponent(UITransform);
|
||
transform.setContentSize(new Size(720, 300));
|
||
|
||
const titleLabel = new Node('Title');
|
||
const label = titleLabel.addComponent(Label);
|
||
label.string = '江湖见闻录';
|
||
label.fontSize = UITheme.FONT_SIZE.MD;
|
||
label.color = this.hexToColor(UITheme.COLORS.TEXT_GOLD);
|
||
titleLabel.setParent(this.newsArea);
|
||
|
||
// 新闻内容列表
|
||
const contentNode = new Node('Content');
|
||
const contentLabel = contentNode.addComponent(Label);
|
||
contentLabel.string = '百晓生：江湖动态将在这里显示...';
|
||
contentLabel.fontSize = UITheme.FONT_SIZE.SM;
|
||
contentLabel.color = this.hexToColor(UITheme.COLORS.TEXT_NORMAL);
|
||
contentLabel.overflow = Label.Overflow.CLAMP;
|
||
contentNode.setParent(this.newsArea);
|
||
}
|
||
|
||
/**
|
||
* 底部导航栏
|
||
* 吐纳 | 门派 | 武学 | 江湖 | 游历
|
||
*/
|
||
private initBottomNav() {
|
||
if (!this.bottomNav) return;
|
||
|
||
const transform = this.bottomNav.getComponent(UITransform) || this.bottomNav.addComponent(UITransform);
|
||
transform.setContentSize(new Size(720, 120));
|
||
|
||
const tabs = [
|
||
{ name: '吐纳', icon: '🧘', active: true },
|
||
{ name: '门派', icon: '🏯', active: false },
|
||
{ name: '武学', icon: '⚔️', active: false },
|
||
{ name: '江湖', icon: '🗺️', active: false },
|
||
{ name: '游历', icon: '🚶', active: false },
|
||
];
|
||
|
||
tabs.forEach((tab, index) => {
|
||
const tabNode = new Node(`Tab_${tab.name}`);
|
||
const transform = tabNode.addComponent(UITransform);
|
||
transform.setContentSize(new Size(144, 120));
|
||
tabNode.setParent(this.bottomNav);
|
||
|
||
// 图标
|
||
const iconNode = new Node('Icon');
|
||
const iconLabel = iconNode.addComponent(Label);
|
||
iconLabel.string = tab.icon;
|
||
iconLabel.fontSize = UITheme.FONT_SIZE.XL;
|
||
iconNode.setParent(tabNode);
|
||
|
||
// 文字
|
||
const textNode = new Node('Text');
|
||
const textLabel = textNode.addComponent(Label);
|
||
textLabel.string = tab.name;
|
||
textLabel.fontSize = UITheme.FONT_SIZE.XS;
|
||
textLabel.color = tab.active
|
||
? this.hexToColor(UITheme.COLORS.TEXT_GOLD)
|
||
: this.hexToColor(UITheme.COLORS.TEXT_DIM);
|
||
textNode.setParent(tabNode);
|
||
});
|
||
}
|
||
}
|
