84 lines
1.8 KiB
JavaScript
84 lines
1.8 KiB
JavaScript
|
|
/**
|
||
|
|
* 场景基类
|
||
|
|
*/
|
||
|
|
export default class BaseScene {
|
||
|
|
constructor(main, params = {}) {
|
||
|
|
this.main = main;
|
||
|
|
this.params = params;
|
||
|
|
this.screenWidth = main.screenWidth;
|
||
|
|
this.screenHeight = main.screenHeight;
|
||
|
|
this.scrollVelocity = 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
// 初始化
|
||
|
|
init() {}
|
||
|
|
|
||
|
|
// 更新逻辑
|
||
|
|
update() {}
|
||
|
|
|
||
|
|
// 渲染
|
||
|
|
render(ctx) {}
|
||
|
|
|
||
|
|
// 触摸开始
|
||
|
|
onTouchStart(e) {}
|
||
|
|
|
||
|
|
// 触摸移动
|
||
|
|
onTouchMove(e) {}
|
||
|
|
|
||
|
|
// 触摸结束
|
||
|
|
onTouchEnd(e) {}
|
||
|
|
|
||
|
|
// 销毁
|
||
|
|
destroy() {}
|
||
|
|
|
||
|
|
// 绘制圆角矩形
|
||
|
|
roundRect(ctx, x, y, width, height, radius) {
|
||
|
|
ctx.beginPath();
|
||
|
|
ctx.moveTo(x + radius, y);
|
||
|
|
ctx.lineTo(x + width - radius, y);
|
||
|
|
ctx.quadraticCurveTo(x + width, y, x + width, y + radius);
|
||
|
|
ctx.lineTo(x + width, y + height - radius);
|
||
|
|
ctx.quadraticCurveTo(x + width, y + height, x + width - radius, y + height);
|
||
|
|
ctx.lineTo(x + radius, y + height);
|
||
|
|
ctx.quadraticCurveTo(x, y + height, x, y + height - radius);
|
||
|
|
ctx.lineTo(x, y + radius);
|
||
|
|
ctx.quadraticCurveTo(x, y, x + radius, y);
|
||
|
|
ctx.closePath();
|
||
|
|
}
|
||
|
|
|
||
|
|
// 绘制多行文本
|
||
|
|
wrapText(ctx, text, x, y, maxWidth, lineHeight) {
|
||
|
|
const lines = [];
|
||
|
|
let currentLine = '';
|
||
|
|
|
||
|
|
for (let i = 0; i < text.length; i++) {
|
||
|
|
const char = text[i];
|
||
|
|
if (char === '\n') {
|
||
|
|
lines.push(currentLine);
|
||
|
|
currentLine = '';
|
||
|
|
continue;
|
||
|
|
}
|
||
|
|
|
||
|
|
const testLine = currentLine + char;
|
||
|
|
const metrics = ctx.measureText(testLine);
|
||
|
|
|
||
|
|
if (metrics.width > maxWidth && currentLine.length > 0) {
|
||
|
|
lines.push(currentLine);
|
||
|
|
currentLine = char;
|
||
|
|
} else {
|
||
|
|
currentLine = testLine;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
if (currentLine.length > 0) {
|
||
|
|
lines.push(currentLine);
|
||
|
|
}
|
||
|
|
|
||
|
|
lines.forEach((line, index) => {
|
||
|
|
ctx.fillText(line, x, y + index * lineHeight);
|
||
|
|
});
|
||
|
|
|
||
|
|
return lines.length;
|
||
|
|
}
|
||
|
|
}
|