游戏界面展示
首先我们用最简单的方式展示游戏主界面:在 Canvas 节点下添加一个名为【Match3UI】的精灵(Sprite) 节点,设置尺寸为 750x1334。设置颜色为红色,调整透明度为 80。(我们已经知道如何添加精灵节点了,这里不复述了)并且这个节点上,我们暂时不挂载 Widget 对齐组件。
羊了个羊本质是一个三消类型的游戏, 因此取名 Match3
上面这个做法,是为了演示,在 iPad 设备情况下,首屏界面和游戏界面尺寸的一个对比情况。
因此运行游戏的时候,我们需要在浏览器中选中模拟器。
这时候,我们发现在 iPad 的屏幕适配出了问题,这不是我预期的情况。
原因是适配策略未生效。
因此这里做了一个不是很优雅的修复。
在 Boost.ts 脚本的 adapterScreen 方法中,最后一行添加
adapterScreen() {
// 保持不变....
return isScreenWidthLarger;
}
然后修改 start 方法中的内容为:
start() {
const WIN_SIZE_W = screen.windowSize.width;
const WIN_SIZE_H = screen.windowSize.height;
let isScreenWidthLarger = this.adapterScreen();
if (isScreenWidthLarger) {
screen.windowSize = new Size(WIN_SIZE_W + 1, WIN_SIZE_H);
screen.windowSize = new Size(WIN_SIZE_W, WIN_SIZE_H);
}
}
重新运行后,发现符合我们的预期,游戏界面确实是高度适配。
下一篇 游戏界面的控制