Project1

标题: 游戏窗口大小自适应脚本(解决游戏黑边问题) [打印本页]

作者: 41workroom 时间: 2022-6-30 17:45
标题: 游戏窗口大小自适应脚本(解决游戏黑边问题)
本帖最后由 41workroom 于 2022-7-1 08:44 编辑

参考了
https://www.jianshu.com/p/0bd8b462dac1
https://blog.csdn.net/lixiaonaaa/article/details/121513235

//这里是改变游戏画面的函数
function setScreenSize(screenWidth, screenHeight){
var deltaWidth = screenWidth - window.innerWidth;
var deltaHeight = screenHeight - window.innerHeight;
window.moveBy(- deltaWidth / 2, - deltaHeight / 2);
window.resizeBy(deltaWidth, deltaHeight);
console.log("宽度已被设置为" + deltaWidth);
console.log("高度已被设置为" + deltaWidth);
}
//这里获取网页可见区域宽高
var clientWidth = document.body.clientWidth;
var clientHeight = document.body.clientHeight;
setScreenSize(clientWidth, clientHeight);

复制代码

如果UI变形了的可以参考4楼的代码

作者: 41workroom 时间: 2022-6-30 17:46
本帖最后由 41workroom 于 2022-6-30 17:56 编辑

求评分收藏谢谢了
代码可能还有不足望指正

作者: apple5740 时间: 2022-6-30 19:40
本帖最后由 apple5740 于 2022-6-30 19:48 编辑

哇！感谢楼主！！非常感谢！目前有一些问题。。就是改变画面之后,有些UI也被拉长了。比如战斗界面选择目标敌人的按钮。地图背景的大小也不匹配了,但是战斗的场景就很合适。。
这个两个问题。
问题1：
按钮可能需要自己改。。
问题2：
这个地图场景背景,可以用战斗场景拉升背景的方法吗？
或者有更好的解决办法吗？

作者: 41workroom 时间: 2022-7-1 08:41
本帖最后由 41workroom 于 2022-7-1 08:45 编辑

apple5740 发表于 2022-6-30 19:40
哇！感谢楼主！！非常感谢！目前有一些问题。。就是改变画面之后,有些UI也被拉长了。比如战斗界面选择目标 ...

唔……那就是维持比例不变吧
那这样：

//这里是改变游戏画面的函数
function setScreenSize(screenWidth, screenHeight){
var deltaWidth = screenWidth - window.innerWidth;
var deltaHeight = screenHeight - window.innerHeight;
window.moveBy(- deltaWidth / 2, - deltaHeight / 2);
window.resizeBy(deltaWidth, deltaHeight);
console.log("宽度已被设置为" + deltaWidth);
console.log("高度已被设置为" + deltaWidth);
}
//这里获取网页可见区域宽高
var clientWidth = document.body.clientWidth;
var clientHeight = document.body.clientHeight;
var clientScale = clientWidth / clientHeight;
setScreenSize(window.innerHeigh * clientScale, window.innerHeigh);

复制代码

这样尽量减少了画面的破坏

作者: 41workroom 时间: 2022-7-1 08:48

apple5740 发表于 2022-6-30 19:40
哇！感谢楼主！！非常感谢！目前有一些问题。。就是改变画面之后,有些UI也被拉长了。比如战斗界面选择目标 ...

唔……你好能问一下吗
虽然我写出了那一段但我不知道该怎么在游戏刚开始的时候运行那一段

我试过公共事件，但好像不行……

作者: apple5740 时间: 2022-7-1 13:05
本帖最后由 apple5740 于 2022-7-1 13:38 编辑

41workroom 发表于 2022-7-1 08:48
唔……你好能问一下吗
虽然我写出了那一段但我不知道该怎么在游戏刚开始的时候运行那一段
我 ...

哈！！！首先感谢您的回答,刚好我也遇到您说的这个问题！！
我是想在游戏开始时,给自己的全局变量赋值。。成$dataMyEvents...我加入的json文件的数据,我没好意思在群里问。。因为有好多插件都这样做过。
然后我就研究别人的插件。。也没看懂。。好像它们都是把变量写在插件参数上的。。可是我不想插件有这样的参数,于是就想怎么实现在游戏一开始运行一段代码。。。
方式1：在游戏添加一个事件,游戏开始后自动执行。。
（感觉不好）
方式2：使用自调用写法
(function () {
var x = "Hello!!"; // 我将调用自己
})();
很多插件用的这个方法。。,但是用来赋值全局变量就不行。。
方式3：找一个引擎自带的方法,它在游戏开始时候会调用,然后重写它。。
然后我就找到了 Game_Variables.prototype.initialize 这个方法。。
测试后好像能达到要求。。

作者: apple5740 时间: 2022-7-1 13:21
本帖最后由 apple5740 于 2022-7-1 13:24 编辑

还有就是。。。我出现那个问题。是因为我手动改变了系统2的宽高参数。。导致的
您写的方法,我是作为思路先收藏的,我还没准备好做自适应。。所以也就没放入游戏中。
不过我现在放入游戏中测试了,发现您的两个方法好像都没改变游戏窗口。debug的结果是 :
第一个方法：
宽度已被设置为-16
高度已被设置为-16

第二个方法
宽度已被设置为NaN
高度已被设置为NaN

是不是因为我是没用网页端的缘故。我测试都是本地运行游戏测试的。我听说有些测试是在网页端。。可是我完全不懂网页端是怎么一回事。

作者: 41workroom 时间: 2022-7-1 15:13

apple5740 发表于 2022-7-1 13:21
还有就是。。。我出现那个问题。是因为我手动改变了系统2的宽高参数。。导致的
您写的方法,我是作为思路先 ...

唔……我再研究研究谢谢了

作者: 41workroom 时间: 2022-7-1 18:27
本帖最后由 41workroom 于 2022-7-1 18:29 编辑

apple5740 发表于 2022-7-1 13:21
还有就是。。。我出现那个问题。是因为我手动改变了系统2的宽高参数。。导致的
您写的方法,我是作为思路先 ...

我想起一件事了
在游戏的标题出来之前，画面的大小是不确定的！也就是说一定要在标题加载出来之后再读取与调整

4楼等比例缩放的解决方案可能会出现数值问题（小数过多），是不是需要考虑取整……

作者: 41workroom 时间: 2022-7-1 20:37

apple5740 发表于 2022-7-1 13:21
还有就是。。。我出现那个问题。是因为我手动改变了系统2的宽高参数。。导致的
您写的方法,我是作为思路先 ...

https://rpg.blue/forum.php?mod=viewthread&tid=484391&page=1#pid2910280
这个可以调整对话框

作者: apple5740 时间: 2022-7-2 00:57

41workroom 发表于 2022-7-1 20:37
https://rpg.blue/forum.php?mod=viewthread&tid=484391&page=1#pid2910280
这个可以调整对话框 ...

收到！谢谢拉。看起来又是一个大工程

作者: xie0329 时间: 2022-7-2 17:39
可以可以

作者: 科科怪 时间: 2022-8-23 00:26
不错不错用哪个呢

欢迎光临 Project1 (https://rpg.blue/)