[插件]菜单UI的自适应图片精灵，该如何解决内容覆盖问题?
我试图实现一个插件，其作用是新建一个窗口，并为这个窗口创建选项和自适应图片，即为其设置背景时，能够自动将背景和窗口的大小适应。为此，我向这个窗口添加了一个图片精灵，其能自动缩放以适应窗口的尺寸，但是，当我实际运行时，她却覆盖了原本窗口的所有内容。
↓比如，我只能看到一张自适应好了的图片，却不能看到任何选项。
https://rpg.blue/data/attachment/forum/202111/26/020311ojck6p4xpg4i1xwb.png
为此，我查询了很多资料，解决方法似乎是将图片精灵在内容之前加载出来，但是我不知道该如何实现……
求求大佬帮助QAQ
↓这个是代码
RUBY 代码
//这个窗口构造，设置了“属性”、“武器”、“装备”、"能力"一共四个选项
//继承窗口
function Window_OriginBase() {
this.initialize(...arguments);
}
Window_OriginBase.prototype = Object.create(Window_Command.prototype);
Window_OriginBase.prototype.constructor = Window_OriginBase;
//设置透明度和边框大小
Window_OriginBase.prototype.initialize = function(rect) {
Window_Command.prototype.initialize.call(this,rect);
this.opacity = 0;
this.padding = 0;
}
//设置选项最大列数
Window_OriginBase.prototype.maxCols = function() {
return 4;
};
//设置选项
Window_OriginBase.prototype.makeCommandList = function() {
if (this.needsCommand("attr")) {
this.addCommand("属性", "attr");
}
if (this.needsCommand("weapon")) {
this.addCommand("武器", "weapon");
}
if (this.needsCommand("equip")) {
this.addCommand("装备", "equip");
}
if (this.needsCommand("ability")) {
this.addCommand("能力", "ability");
}
};
//参考游戏原来的库摘抄的，作用好像是判断在原本游戏里有没有这个选项？
Window_OriginBase.prototype.needsCommand = function(name) {
const table = ["attr", "weapon", "equip", "ability"];
const index = table.indexOf(name);
if (index >= 0) {
return $dataSystem.itemCategories;
}
return true;
};
//对应的场景
function Scene_Origin() {
this.initialize(...arguments);
}
//基本
Scene_Origin.prototype = Object.create(Scene_MenuBase.prototype);
Scene_Origin.prototype.constructor = Scene_Origin;
Scene_Origin.prototype.initialize = function() {
Scene_MenuBase.prototype.initialize.call(this);
ImageManager.loadBitmap("img/pictures/","SaveBg04");
};
//创建场景
Scene_Origin.prototype.create = function() {
Scene_MenuBase.prototype.create.call(this);
this.createCommandWindow();
};
Scene_Origin.prototype.createCommandWindow = function() {
const rect = this.commandWindowRect();
this.win = new Window_OriginBase(rect);
//通过this.drawBg(rect)给窗口添加一个精灵，能够显示图片。
this.drawBg(rect);
//返回按钮
this.win.setHandler("cancel", this.popScene.bind(this));
//添加
this.addWindow(this.win);
};
//尺寸
Scene_Origin.prototype.commandWindowRect = function() {
const ww = Graphics.width*0.45;
const wh = Graphics.height*0.1;
const wx = Graphics.width*0.5;
const wy = Graphics.height*0.8;
return new Rectangle(wx, wy, ww, wh);
};
//设置图片的函数
Scene_Origin.prototype.drawBg = function(rect) {
//新建精灵
const sprite_origin = new Sprite();
sprite_origin.bitmap = ImageManager.loadBitmap("img/pictures/","SaveBg04");
//通过回调确保图片顺利加载
sprite_origin.bitmap.addLoadListener(function(){
//自适应宽高
sprite_origin.scale.x = rect.width/sprite_origin.bitmap.width;
sprite_origin.scale.y = rect.height/sprite_origin.bitmap.height;
}.bind(this));
//添加
this.win.addChild(sprite_origin);
};
本帖来自P1论坛作者sumcat，因Project1站服务器在国外有时候访问缓慢不方便作者交流学习，经联系P1站长fux2同意署名转载一起分享游戏制作经验，共同为国内独立游戏作者共同创造良好交流环境，原文地址：https://rpg.blue/forum.php?mod=viewthread&tid=487878若有侵权，发帖作者可联系底部站长QQ在线咨询功能删除，谢谢。
页:
[1]