import { AppKernel } from '@scripts/app/AppKernel'; import { INoticeData } from '@scripts/store/mainStore/data'; import { formatMaskNickName, formatSCNum } from '@scripts/utils/Helper'; import { _decorator, Component, Input, input, instantiate, KeyCode, Label, Node, NodePool, tween, Tween, UITransform, Vec3 } from 'cc'; const { ccclass, property } = _decorator; const MIN_MESSAGE_GAP = 50; const SCROLL_SPEED = 120; interface INoticeNode { label: Label, trans: UITransform, } @ccclass('HomeNotices') export class HomeNotices extends Component { @property(Node) itemNode: Node = null; @property(UITransform) content: UITransform = null; private readonly pool = new NodePool('HomeNotices'); private readonly activeItems: Node[] = []; private readonly noticeNodes = new WeakMap(); protected onLoad(): void { if (this.itemNode) this.itemNode.active = false; this.node.active = false; // input.on(Input.EventType.KEY_DOWN, (event) => { // if (event.keyCode === KeyCode.KEY_W) { // let data: INoticeData = { // nickName: `User${Math.floor(Math.random() * 8999 + 1000)}`, // value: Math.random() * 10000 // } // const mainStore = AppKernel.stores.mainStore; // mainStore['_noticesList'].push(data); // this.startNotify(); // } // }) } protected onDestroy(): void { for (let index = 0; index < this.activeItems.length; index += 1) { Tween.stopAllByTarget(this.activeItems[index]); } this.activeItems.length = 0; } startNotify(): void { if (this.activeItems.length > 0) { const last = this.activeItems[this.activeItems.length - 1]; if (last.x >= this.content.width) return; } const mainStore = AppKernel.stores.mainStore; const data = mainStore.getNoticeData(); if (!data) { // 队列已空且没有正在移动的消息时,隐藏整个公告区域。 if (this.activeItems.length === 0) this.node.active = false; return; } this.node.active = true; this.onNotify(data); } onNotify(data: INoticeData): void { if (!this.itemNode || !this.content) return; const msg = `${formatMaskNickName(data.nickName)} won SC ${formatSCNum(data.value)}`; const item = this.pool.get() || instantiate(this.itemNode); const noticeNode = this.getNoticeNode(item); const lblNotices = noticeNode.label; const itemTransform = noticeNode.trans; Tween.stopAllByTarget(item); item.setParent(this.content.node); item.active = true; lblNotices.string = msg; lblNotices.updateRenderData(true); const itemWidth = itemTransform.width * Math.abs(item.scale.x); if (itemWidth <= 0) { this.recycle(item); return; } const startX = this.getStartX(this.content.width); const endX = -itemWidth; item.setPosition(startX, 0, item.position.z); this.activeItems.push(item); tween(item) .to((startX - endX) / SCROLL_SPEED, { position: new Vec3(endX, 0, item.position.z), }, { easing: 'linear' }) .call(() => { this.recycle(item); this.startNotify(); }) .start(); } private getNoticeNode(item: Node) { let notices = this.noticeNodes.get(item); if (!notices) { notices = { label: item.getComponent(Label), trans: item.getComponent(UITransform), } this.noticeNodes.set(item, notices); } return notices; } private getStartX(contentWidth: number): number { let startX = contentWidth; for (let index = 0; index < this.activeItems.length; index += 1) { const item = this.activeItems[index]; if (!item.isValid) continue; const transform = this.noticeNodes.get(item)?.trans; if (!transform) continue; const rightX = item.position.x + transform.width * Math.abs(item.scale.x); startX = Math.max(startX, rightX + MIN_MESSAGE_GAP); } return startX; } private recycle(item: Node): void { Tween.stopAllByTarget(item); const index = this.activeItems.indexOf(item); if (index !== -1) this.activeItems.splice(index, 1); if (!item.isValid) return; item.active = false; item.removeFromParent(); this.pool.put(item); } }