xionglijia/18xchat
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

页面h5适配

Browse Source
This commit is contained in:
xionglijia
2025-08-15 18:17:12 +08:00
parent 599c98f135
commit 92277f0ff1
9 changed files with 4975 additions and 4580 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/Scripts/Main/Common/Utils.ts
+2 -2
View File
@@ -178,11 +178,11 @@ export default class Utils {
//let windowSize = view.getVisibleSize();
let bgTf = node.getComponent(UITransform);
if (bgTf) {
if (mod == 1 && bgTf.height <= windowSize.height) {
if (mod == 1) {
let scale = windowSize.height / bgTf.height;
bgTf.height = bgTf.height * scale;
bgTf.width = bgTf.width * scale;
} else if (mod == 2 && bgTf.width <= windowSize.width) {
} else if (mod == 2) {
let scale = windowSize.width / bgTf.width;
bgTf.height = bgTf.height * scale;
bgTf.width = bgTf.width * scale;
assets/Scripts/chat18x/ui/components/ChatContentsLayout.ts
+28 -13
View File
@@ -1,15 +1,23 @@
import { _decorator, Component, instantiate, Node, Vec3 } from "cc";
import {
_decorator,
Component,
instantiate,
Node,
UITransform,
Vec3,
} from "cc";
import { DialogManager } from "../../manager/DialogManager";
import { DialogBubble } from "./DialogBubble";
import { Dialog } from "../../data/DialogData";
const { ccclass, property } = _decorator;
const BUTTOM_Y = -955.571;
@ccclass("ChatContentsLayout")
export class ChatContentsLayout extends Component {
manager: DialogManager = null;
@property(Node)
initPos: Node = null;
@property(DialogBubble)
lBubble: DialogBubble = null;
@property(DialogBubble)
@@ -18,9 +26,12 @@ export class ChatContentsLayout extends Component {
bubbles: DialogBubble[] = [];
cachedBubbles: DialogBubble[] = [];
fixMaxWidth: number;
protected start(): void {
this.lBubble.node.active = false;
this.rBubble.node.active = false;
this.fixMaxWidth = this.node.getComponent(UITransform).contentSize.y * 0.6;
}
protected onEnable(): void {
@@ -38,22 +49,22 @@ export class ChatContentsLayout extends Component {
}
}
this.bubbles = [];
this.updateDialogLayout(dialogs);
// 清理多余的缓存气泡，避免内存泄漏
this.cleanupExcessCachedBubbles();
}
private updateDialogLayout(dialogs: Dialog[]) {
let initPosY: number = BUTTOM_Y;
let initPosY: number = this.initPos.position.y;
let pendingUpdates = 0;
const updateNextBubble = (index: number) => {
if (index < 0) {
return;
}
const dialog = dialogs[index];
let newBubble: DialogBubble = null;
@@ -64,7 +75,10 @@ export class ChatContentsLayout extends Component {
if (cached && cached.node) {
// 检查气泡类型是否匹配（通过位置判断左右气泡）
const isRightBubble = cached.node.position.x > 0;
if ((isPlayerBubble && isRightBubble) || (!isPlayerBubble && !isRightBubble)) {
if (
(isPlayerBubble && isRightBubble) ||
(!isPlayerBubble && !isRightBubble)
) {
newBubble = cached;
this.cachedBubbles.splice(j, 1);
break;
@@ -78,27 +92,28 @@ export class ChatContentsLayout extends Component {
? instantiate(this.rBubble.node)
: instantiate(this.lBubble.node);
newBubble = newBubbleNode.getComponent(DialogBubble);
newBubble.init(this.fixMaxWidth);
newBubbleNode.setParent(this.node);
}
newBubble.node.active = true;
let pos = newBubble.node.position;
newBubble.node.position = new Vec3(pos.x, initPosY, pos.z);
pendingUpdates++;
newBubble.updateBubbleContent(dialog.content, (actualHeight: number) => {
initPosY += actualHeight + 20;
pendingUpdates--;
// 当当前气泡更新完成后，处理下一个
if (pendingUpdates === 0) {
updateNextBubble(index - 1);
}
});
this.bubbles.push(newBubble);
};
// 从最后一个对话开始处理（倒序）
updateNextBubble(dialogs.length - 1);
}
assets/Scripts/chat18x/ui/components/DialogBubble.ts
+28 -12
View File
@@ -1,4 +1,12 @@
import { _decorator, Component, Label, Node, Size, UITransform } from "cc";
import {
_decorator,
Component,
Label,
Node,
Overflow,
Size,
UITransform,
} from "cc";
import Tools from "../../utils/tools";
const { ccclass, property } = _decorator;
@@ -11,7 +19,13 @@ export class DialogBubble extends Component {
@property(UITransform)
contentT: UITransform = null;
fixMaxWidth: number;
init(maxWidth: number = 650) {
this.fixMaxWidth = maxWidth;
}
updateBubbleContent(str: string, callback?: (actualHeight: number) => void) {
this.content.overflow = Overflow.NONE;
// 设置文本内容
this.content.string = str;
@@ -22,38 +36,40 @@ export class DialogBubble extends Component {
for (const line of lines) {
let lineWidth = 0;
if (Tools.IsChinese(line)) {
lineWidth = 35 * line.length;
lineWidth = 30 * line.length;
} else {
lineWidth = 21 * line.length;
lineWidth = 18 * line.length;
}
maxWidth = Math.max(maxWidth, lineWidth);
}
if (maxWidth > this.fixMaxWidth)
this.content.overflow = Overflow.RESIZE_HEIGHT;
// 限制最大宽度
const contentWidth = Math.min(maxWidth, 950);
const contentWidth = Math.min(maxWidth, this.fixMaxWidth);
// 设置内容区域宽度，让Label自动计算高度
this.contentT.setContentSize(new Size(contentWidth, 0));
this.bg.setContentSize(new Size(contentWidth + 20, 0));
this.bg.setContentSize(new Size(contentWidth + 17, 0));
// 强制更新Label的渲染数据以获取正确的高度
this.content.updateRenderData(true);
// 等待一帧后获取Label的实际高度
this.scheduleOnce(() => {
const actualHeight =
this.content.node.getComponent(UITransform).contentSize.height;
const actualSize =
this.content.node.getComponent(UITransform).contentSize;
// 更新内容区域的实际大小
this.contentT.setContentSize(new Size(contentWidth, actualHeight));
//this.contentT.setContentSize(new Size(contentWidth, actualHeight));
// 根据内容大小调整背景大小，添加适当的内边距
const bgHeight = actualHeight + 20;
this.bg.setContentSize(new Size(contentWidth + 50, bgHeight));
//const bgHeight = actualHeight + 17;
this.bg.setContentSize(new Size(actualSize.x + 30, actualSize.y + 10));
// 回调通知实际高度
if (callback) {
callback(bgHeight);
callback(actualSize.y);
}
}, 0);
assets/Scripts/chat18x/ui/panels/GirlDetailPanel.ts
+15 -15
View File
@@ -33,8 +33,6 @@ export class GirlDetailPanel extends li_BaseView {
@property(Label)
tags: Label;
@property(Label)
descName: Label;
@property(Label)
descAge: Label;
@property(Label)
@@ -60,9 +58,7 @@ export class GirlDetailPanel extends li_BaseView {
this.refresh(this.id);
Utils.addInnerEL(InnerMsgCode.LanguageChange, this, () => {
this.girlName.string = this.descName.string = LanguageUtils.getText(
this.nameKey
);
this.girlName.string = LanguageUtils.getText(this.nameKey);
let desc = "";
const tags = LanguageUtils.getText(this.tagKey).split("|");
for (let i = 0; i < tags.length; i++) {
@@ -93,7 +89,9 @@ export class GirlDetailPanel extends li_BaseView {
if (parentTransform && videoTransform && videoTransform.height > 0) {
const scale = parentTransform.height / videoTransform.height;
this.avatarVideo.node.setScale(scale, scale, 1);
console.log(`Video scaled to: ${scale}, parent height: ${parentTransform.height}, video height: ${videoTransform.height}`);
console.log(
`Video scaled to: ${scale}, parent height: ${parentTransform.height}, video height: ${videoTransform.height}`
);
return true;
}
return false;
@@ -121,9 +119,7 @@ export class GirlDetailPanel extends li_BaseView {
const data = ConfigManager.tables.TbGirls.get(this.id);
this.category = data.category;
this.nameKey = data.nameKey;
this.girlName.string = this.descName.string = LanguageUtils.getText(
data.nameKey
);
this.girlName.string = LanguageUtils.getText(data.nameKey);
if (dataDetail.pics[0].endsWith("video")) {
ResManager.I.changeBundleVideo(
@@ -131,12 +127,16 @@ export class GirlDetailPanel extends li_BaseView {
dataDetail.pics[0],
"Chat18x"
);
// 添加视频加载完成回调
this.avatarVideo.node.on(VideoPlayer.EventType.READY_TO_PLAY, () => {
this.adjustVideoScale();
}, this);
this.avatarVideo.node.on(
VideoPlayer.EventType.READY_TO_PLAY,
() => {
this.adjustVideoScale();
},
this
);
// 也立即尝试调整（以防已经加载完成）
this.adjustVideoScale();
}
@@ -160,7 +160,7 @@ export class GirlDetailPanel extends li_BaseView {
this.tagKey = data.tagKey;
const tags = LanguageUtils.getText(data.tagKey).split("|");
for (let i = 0; i < tags.length; i++) {
if (i != 0) desc += "\n";
if (i != 0) desc += "|";
desc += tags[i];
}
this.tags.string = desc;