Project1

标题: [教程]RMMV脚本教程——菜单美化（三）（完结） [打印本页]

---

作者: xjzsq    时间: 2019-7-17 00:49
标题: [教程]RMMV脚本教程——菜单美化（三）（完结）


前两期教程的传送门

RMMV脚本教程——菜单美化（一）
RMMV脚本教程——菜单美化（二）

写在前面

时隔不到一年半，高考完的我终于决定继续研究MV的脚本，然后写教程啦…
之前的教程（下面参考资料有文章链接）发布在Project1（原6R）论坛上，之前的坑还是会慢慢填完的，现在再开个新坑！
这次来美化一下菜单！
首先放一下先行图：

注意事项

• 本教程的灵感来自于【渣作品】RGSS3教程（二） 菜单的美化【2013.8.2-16:40完结】，不如说是该教程直接翻译成的MV版本。
• 因为作者特别的菜，所以教程中难免会有一些小（致命）的错误，请大家原谅，另外请大家不吝赐教。
• 教程中会用到的参考资料：
  
  
  • RMMV的中文F1文档：http://miaowm5.github.io/RMMV-F1/
  • 汪汪大佬的RMMV原生脚本注释的中文翻译：https://github.com/wangwangxingao/RMMV/tree/master/%E6%B3%A8%E9%87%8A
  • 我之前未写完烂尾的教程：[教程]RMMV脚本教程（一），[教程]RMMV脚本教程（二）
  • RMVA的F1帮助文档汉化版：https://rpg.blue/thread-369922-1-1.html
    其中F1和翻译都可以在github上下载到，大家珂以先下载，方便查看。
    
    
• 本教程同步发布于Project1论坛和我的博客青い記憶：RMMV脚本教程——菜单美化（三）
  
  

正文

上期教程，我们写好了人物行走图选项的部分，下面就实现中间显示人物的信息，并且信息会随着选项的位置改变的效果。
还记得我在之前写烂尾的教程（在注意事项第三条3那里）里面如何描绘人物信息的吗？(回去看了看，貌似只写到了描绘人物名字的部分)
我们这次为了代码简单一些，就不描边了。
因为随选项而使人物信息变化比较难，所以我们就先把index==0的角色信息描绘出来，像描绘角色行走图一样，我们需要新建一个函数，把所有关于描绘角色信息的代码都写在这个函数里，仿照drawItemImage，新函数就叫做drawItemActorStatus，具体方法也参照drawItemImage来写：

1. Window_MenuStatus.prototype.drawItemActorStatus = function(){
   
2.     var index = 0;
   
3.     var actor = $gameParty.members()[index];
   
4.     var rect = this.itemRect(index);
   
5. }

复制代码

这里，rect的y和height并不能满足要求，因此，这里珂以参照itemRect函数自己写一个返回rect方法，这里叫做itemRectForStatus，也是将itemRect中的内容复制过来，再做进一步修改。新定义的这个函数有什么不同呢？首先是他和人物的index无关了，所以这个函数就没有参数了；其次是他的rect.y应该先加上一个选项的高度，而rect.heigtht应该为原来基础上的5（this.numVisibleRows() - 2）倍，按照上面说的写出以下函数：

1. Window_MenuStatus.prototype.itemRectForStatus = function(){
   
2.     var rect = new Rectangle();
   
3.     var maxCols = this.maxCols();
   
4.     rect.width = this.itemWidth() * maxCols;
   
5.     rect.height = this.itemHeight();
   
6.     rect.x = 0 ;
   
7.     rect.y = rect.height - this._scrollY;
   
8.     rect.height *= ( this.numVisibleRows() - 2 );
   
9.     return rect;
   
10. };

复制代码

之后，将drawItemActorStatus中的itemRect函数改为itemRectForStatus。
要描绘人物的脸图，使用的方法是drawActorFace，参数珂以对照着Window_MenuStatus的drawItemImage函数里面的drawActorFace的参数来填，也就是下面这样：

1. this.drawActorFace(actor, rect.x, rect.y);

复制代码

先运行下测试一下看看是否正常显示吧，不过在测试之前，我们需要将drawItemActorStatus函数先写到Window_MenuStatus的drawItem函数里面，也就是在里面加上：

1. this.drawItemActorStatus();

复制代码

之后运行看下结果吧！
如果在菜单中显示了第一个人物的脸图，那你就写对了。
在这以后，我们就来描绘剩下的东西。
首先是在脸图上面描绘人物名字，使用的是drawActorName函数，定义在Window_Base中，参数珂以去看定义，这里需要说明的是，有些参数珂以不填，比如看到drawActorName函数的定义：

1. /**绘制角色名称 */
   
2. Window_Base.prototype.drawActorName = function(actor, x, y, width) {
   
3.     width = width || 168;
   
4.     this.changeTextColor(this.hpColor(actor));
   
5.     this.drawText(actor.name(), x, y, width);
   
6. };

复制代码

其中width = width || 168; 就表示width是一个可填可不填的参数，就算不填，也会自动给补上，这里我们是想在脸图上方描绘名字，而脸图的宽度是144（珂以去脸图目录下的文件那里看宽度/4就是这个数字），而按照默认宽度，珂能会出现绘制到脸图外面的情况，因此我们填上这个参数。
也就是：

1. this.drawActorName(actor, rect.x, rect.y, 144);

复制代码

同样，在Window_Base中，我们珂以搜索到绘制角色等级、职业、昵称、HP、MP的函数，因为图像的宽度是144，因此描绘这些的时候，x都需要在原来的基础上加145；等级这一行，珂以先算出( rect.width - 144 ) / 3的结果为_valWidth，然后描绘职业和昵称的时候，分别在x那里加上一个或两个_valWidth；另外，在MV中每行字的高度是36，描绘的每个项目都要加上宽度，第一行是_valWidth，后面都是rect.width - 144。珂以写出以下代码：

1.     var _valWidth= ( rect.width - 144 ) / 3;
   
2.     this.drawActorLevel(actor, rect.x + 145, rect.y , _valWidth);
   
3.     this.drawActorClass(actor, rect.x + 145 + _valWidth, rect.y, _valWidth);
   
4.     this.drawActorNickname(actor, rect.x + 145 + _valWidth * 2, rect.y, _valWidth);
   
5.     this.drawActorHp(actor, rect.x + 145, rect.y + 36, rect.width - 144);
   
6.     this.drawActorMp(actor, rect.x + 145, rect.y + 72, rect.width - 144);

复制代码

MV默认工程里面，人物是没有昵称的，我们需要去数据库里加上昵称，然后运行测试下效果。
…是不是发现等级那里有点不对劲…
数字离着Lv符号太远了…
那我们就重新定义下等级的函数，同样是从Window_Base中复制过来，然后把数字往左放一点（也就是把drawText的x值改小一点，这里改成了x + 48，因为上面的等级符号宽度是48）：

1. Window_MenuStatus.prototype.drawActorLevel = function(actor, x, y) {
   
2.     this.changeTextColor(this.systemColor());
   
3.     this.drawText(TextManager.levelA, x, y, 48);
   
4.     this.resetTextColor();
   
5.     this.drawText(actor.level, x + 48, y, 36, 'right');
   
6. };

复制代码

运行下看结果：

下面就开始写经验条了，因为MV脚本没有自带描绘经验条的函数，这就需要我们自己来写…
仿照HP条来写经验条吧。
我们先在Window_Base中找到描绘HP条的方法：

1. Window_Base.prototype.drawActorHp = function(actor, x, y, width) {
   
2.     width = width || 186;
   
3.     var color1 = this.hpGaugeColor1();
   
4.     var color2 = this.hpGaugeColor2();
   
5.     this.drawGauge(x, y, width, actor.hpRate(), color1, color2);
   
6.     this.changeTextColor(this.systemColor());
   
7.     this.drawText(TextManager.hpA, x, y, 44);
   
8.     this.drawCurrentAndMax(actor.hp, actor.mhp, x, y, width, this.hpColor(actor), this.normalColor());
   
9. };

复制代码

第一行，是默认的宽度，这个不管。
之后两行是两个颜色，为了区别于HP条，经验条就用TP条的颜色吧。
第四行就是描绘HP条了，这里actor.hpRate()看起来控制了HP条有颜色部分的长度，我们应该把这个改成exp的，这个MV也没有自带，也需要自己写…同样找到这个的定义，但是根据actor来看，这应该是actor的属性，而actor应该是Game开头的代码里面定义的，但是我们不知道具体是在哪个类里面定义的，因此去游戏工程的脚本目录下的rpg_objects.js中搜索：

1. Game_BattlerBase.prototype.hpRate = function() {
   
2.     return this.hp / this.mhp;
   
3. };

复制代码

发现是在Game_BattlerBase里面定义的，于是仿照这个函数在相同的类中定义expRate，当前的经验和下个等级所需的经验，这里直接给出来，为this.currentExp()和this.nextLevelExp()，写出以下函数：

1. Game_BattlerBase.prototype.expRate = function () {
   
2.     return this.currentExp() / this.nextLevelExp();
   
3. };

复制代码

现在就珂以写drawActorExp函数了！还需要做的修改有单位改为expA，下面的数值改为当前经验和下等级经验，以及颜色改为tpColor ：

1. Window_MenuStatus.prototype.drawActorExp = function(actor, x, y, width) {
   
2.     width = width || 186;
   
3.     var color1 = this.tpGaugeColor1();
   
4.     var color2 = this.tpGaugeColor2();
   
5.     this.drawGauge(x, y, width, actor.expRate(), color1, color2);
   
6.     this.changeTextColor(this.systemColor());
   
7.     this.drawText(TextManager.expA, x, y, 44);
   
8.     this.drawCurrentAndMax(actor.currentExp(), actor.nextLevelExp(), x, y, width, this.tpColor(actor), this.normalColor());
   
9. };

复制代码

最后在drawItemActorStatus中加上描绘exp的函数：

1. this.drawActorExp(actor, rect.x + 145, rect.y + 108, rect.width - 144);

复制代码

只剩下能力值和武器情况的描绘了。
状态那里面是不是也描绘有这些东西？
因此我们就去看看那里是怎么描绘的，打开rpg_window中的Window_Status，珂以搜到以下内容：

1. /**绘制参数 */
   
2. Window_Status.prototype.drawParameters = function(x, y) {
   
3.     var lineHeight = this.lineHeight();
   
4.     for (var i = 0; i < 6; i++) {
   
5.         var paramId = i + 2;
   
6.         var y2 = y + lineHeight * i;
   
7.         this.changeTextColor(this.systemColor());
   
8.         this.drawText(TextManager.param(paramId), x, y2, 160);
   
9.         this.resetTextColor();
   
10.         this.drawText(this._actor.param(paramId), x + 160, y2, 60, 'right');
    
11.     }
    
12. };
    
13. /**绘制装备 */
    
14. Window_Status.prototype.drawEquipments = function(x, y) {
    
15.     var equips = this._actor.equips();
    
16.     var count = Math.min(equips.length, this.maxEquipmentLines());
    
17.     for (var i = 0; i < count; i++) {
    
18.         this.drawItemName(equips[i], x, y + this.lineHeight() * i);
    
19.     }
    
20. };

复制代码

这两个函数一个用来绘制能力值信息，一个用来描绘装备的信息，因此我们用这两个函数来绘制剩下的内容，因为这两个函数定义在Window_Status中，所以需要把这两个函数复制到Window_MenuStatus中，并修改成Window_MenuStatus中的函数；之后，在drawItemActorStatus中进行引用：

1. this.drawParameters(rect.x,rect.y+144);
   
2. this.drawEquipments(rect.x+312,rect.y+144);

复制代码

改好后运行去发现提示param未定义，这并不说明是param的问题，反而是他前面的this._actor的问题：this._actor在Window_MenuStatus中是未定义的，因此需要改成用参数传递，再次运行测试前先记得在drawItemActorStatus的函数调用那里补上参数actor。
再次运行，发现this.maxEquipmentLines()未定义，这还是需要从Window_Status中去复制。
最终得到以下代码：

1. Window_MenuStatus.prototype.maxEquipmentLines = function() {
   
2.     return 6;
   
3. };
   
4. 
   
5. Window_MenuStatus.prototype.drawParameters = function(actor, x, y) {
   
6.     var lineHeight = this.lineHeight();
   
7.     for (var i = 0; i < 6; i++) {
   
8.         var paramId = i + 2;
   
9.         var y2 = y + lineHeight * i;
   
10.         this.changeTextColor(this.systemColor());
    
11.         this.drawText(TextManager.param(paramId), x, y2, 160);
    
12.         this.resetTextColor();
    
13.         this.drawText(actor.param(paramId), x + 160, y2, 60, 'right');
    
14.     }
    
15. };
    
16. 
    
17. Window_MenuStatus.prototype.drawEquipments = function(actor, x, y) {
    
18.     var equips = actor.equips();
    
19.     var count = Math.min(equips.length, this.maxEquipmentLines());
    
20.     for (var i = 0; i < count; i++) {
    
21.         this.drawItemName(equips[i], x, y + this.lineHeight() * i);
    
22.     }
    
23. };

复制代码

最终测试得到以下画面：

下面就开始实现人物信息随选项变动的功能了！
首先，我们需要知道存储当前选项的变量是什么，在Window_MenuStatus中的处理确定的函数processOk中，获取当前的人物是通过this.index()实现的，而this.index()呢？在Window_MenuStatus中没有搜到这个函数的定义，因此我们去他的父类Window_Selectable中搜索，得到以下结果：

1. /**索引 */
   
2. Window_Selectable.prototype.index = function() {
   
3.     //返回 _index
   
4.     return this._index;
   
5. };

复制代码

因此我们也珂以使用this._index获取当前index。
因此将index那里改为this._index，然后运行下看看效果。
运行后却得到了TypeError: Cannot read property 'faceName' of undefined的错误。
难道说this._index出错了？我们珂以看看到底运行到这里this._index返回了什么值。
这就要用到浏览器的控制台输出函数，在出错的这行前面插入：

1. console.log(this._index);

复制代码

再次运行打开菜单出错后按F12，发现输出的值为-1，为什么是-1？我们现在他等于-1的时候把值改为0，然后在F12里面看看这个-1是什么情况下出现的。
因此将定义actor那行改为：

1. var actor = $gameParty.members()[this._index==-1?0:this._index];

复制代码

却发现F12在选项移动的过程中并没有输出任何东西，说明drawItemActorStatus这个函数在选项移动过程中并没有被调用，只是绘制选项的过程中被调用了一次，这显然达不到我们的要求。
这里补充一个知识：放在窗口类的update函数内的函数会不断被调用。而Window_MenuStatus中没有定义update函数，说明他的update与父类相同，因此需要自己定义update函数（首先继承了父类的update函数）：

1. Window_MenuStatus.prototype.update = function(){
   
2.     Window_Selectable.prototype.update.call(this);
   
3.     this.drawItemActorStatus();
   
4. };

复制代码

并且记得在drawItem中删掉drawItemActorStatus函数的引用。
然后运行后发现，虽然人物信息随着选项的移动而改变，但是却发现原来的人物信息还在，只是往窗口上一层一层地“铺”，这样肯定是不行的。
因此我们需要想办法，让原人物信息先从菜单上清除，再描绘当前选项的人物信息。
Tip：清除坐标为x,y，高和宽分别为height和width的矩形中的内容的函数为clearRect，我们珂以通过itemRectForStatus函数来获得矩形的信息，同样把下面这行插入update：

1. this.contents.clearRect(rect.x,rect.y,rect.width,rect.height);

复制代码

运行下看看结果……
确实是没问题了。但是不知为啥电脑风扇开始狂转，打开任务管理器，发现MV的生成的游戏的进程电池使用情况为“非常高”（写教程的时候电脑开着这个时候的游戏开了一晚上，早晨起来发现电脑风扇快转疯了……），这肯定不正常啊…
打开F12发现，之前写的输出this._index的代码正在疯狂输出-1，说明画面更新实在是太频繁了，而实际上并不需要这么频繁，只需要在选项变化的时候更新画面即可。
怎样判断选项变化呢？
因为this._index存储了当前的选项，所以只要选项和原来不一样，this._index就会和原来不一样，所以珂以先把this._index的值存到一个变量中，如果两者不相等，再执行清除重绘的函数，并更新存储的变量，这样就珂以解决因为频繁刷新而导致电脑卡到爆的情况了。
我们在update函数外面新建一个变量xjzsqIndex，然后在update函数内增加一个if判断，来实现这个效果，并且记得把在控制台输出this._index值的那句删掉！代码如下：

1. var xjzsqIndex;
   
2. Window_MenuStatus.prototype.update = function(){
   
3.     Window_Selectable.prototype.update.call(this);
   
4.     if(xjzsqIndex != this._index)
   
5.     {
   
6.         var rect = this.itemRectForStatus();
   
7.         this.contents.clearRect(rect.x, rect.y, rect.width, rect.height);
   
8.         this.drawItemActorStatus();
   
9.         xjzsqIndex = this._index;
   
10.     }
    
11. };

复制代码

电池使用情况立马变成“中”了。
现在就只剩下改变菜单背景了吧。
在加上自带的背景图片之前，我们先把窗口自带的边框“扒”掉，虽然说是扒掉，但是方法确实将窗口背景部分的内容透明度更改为0。
比较合适的修改窗口透明度的时机有两个，一个是在窗口的initialize中修改，因为这是窗口的初始化过程，只执行一次，不会因为多次执行浪费计算资源，另一种是在使用new创建窗口的时候修改，具体在哪里修改还是要看具体情况，哪个方便就在哪里改。
首先是显示金钱的窗口，因为我们在脚本中定义过Scene_Menu的createGoldWindow函数，因此珂以在金钱窗口创造后使用

1. this._goldWindow.opacity = 0;

复制代码

来将金钱窗口背景的透明度修改为0。
对于菜单选项窗口，我们考虑在initialize函数中修改透明度，但是我们发现initialize中已经有了其他方法，我们珂以通过重写这个方法，也就是：（具体为什么这样写珂以去看我参考资料中的烂尾教程一）

1. xjzsqInitialize = Window_MenuCommand.prototype.initialize;
   
2. Window_MenuCommand.prototype.initialize = function(){
   
3.     xjzsqInitialize.call(this);
   
4.     this.opacity  = 0;
   
5. };

复制代码

但是我希望代码尽量短一些，所以我决定在refresh中修改透明度，原因是，refresh函数在该函数中并没有定义，而是直接继承的父类的refresh中的内容，我们自己重新定义比较方便，另外refresh函数也只在他的父类的initialize函数中被调用了一次，本质上还是在initialize中修改的。
因此我们珂以用比上面少一行的代码量来修改复杂度：

1. Window_MenuCommand.prototype.refresh = function(){
   
2.     Window_Command.prototype.refresh.call(this);
   
3.     this.opacity = 0;
   
4. };

复制代码

同样地，经过搜索，发现Window_MenuStatus情况也大致相同，因此采用与上面同样的方法：

1. Window_MenuStatus.prototype.refresh = function(){
   
2.     Window_Selectable.prototype.refresh.call(this);
   
3.     this.opacity = 0;
   
4. };

复制代码

运行游戏测试一下：

所有的窗口背景都消失了！
下面我们就插入背景图片吧！
首先大家先把我们用到的图片下载下来：

下载链接：MenuBackground
下载好以后放到工程目录的/img/system文件夹下（当然你放到其他文件夹也是珂以的，只是后面显示图片的函数会有所区别）
然后我们再次打开Scene_Menu，既然是背景，那就搜索background大概就行了吧，但是竟然没搜到…什么情况？难道默认没有这个函数吗？还不能轻易下结论，注意看Scene_Menu的父类，是Scene_MenuBase，名字就说明这个类也是专门为了菜单设置的，因此我们打开Scene_MenuBase，再次搜索找到以下函数：

1. Scene_MenuBase.prototype.createBackground = function() {
   
2.     //背景精灵 = 新 精灵()
   
3.     this._backgroundSprite = new Sprite();
   
4.     //背景精灵 位图 = 场景管理器 背景位图()
   
5.     this._backgroundSprite.bitmap = SceneManager.backgroundBitmap();
   
6.     //添加子项(背景精灵)
   
7.     this.addChild(this._backgroundSprite);
   
8. };

复制代码

这大概是实现在地图上截图并以此作为菜单背景的代码，因此我们珂以在Scene_Menu中重写这个函数，在父类的基础上增加显示我们刚才下载的那张图片。
首先也仿照Scene_MenuBase的createBackground函数创造一个精灵，就叫做_backgroundSprite2吧；然后指定这个精灵的位图，这里的位图，我们通过ImageManager.loadSystem("文件名")，来读取/img/system目录下文件名为”文件名.png“的文件；最后也是将精灵添加到屏幕上，代码如下：

1. Scene_Menu.prototype.createBackground = function(){
   
2.     Scene_MenuBase.prototype.createBackground.call(this);
   
3.     this._backgroundSprite2 = new Sprite();
   
4.     this._backgroundSprite2.bitmap = ImageManager.loadSystem("MenuBackground");
   
5.     this.addChild(this._backgroundSprite2);
   
6. };

复制代码

运行测试一下效果：

到这里，教程的基础部分就结束啦！

代码

1. /*:
   
2. @author xjzsq
   
3. @plugindesc 菜单美化
   
4. @help
   
5.     直接打开即可食用~
   
6. */
   
7. 
   
8. //********************
   
9. //带图标的金钱显示窗口
   
10. //********************
    
11. function Window_NewGold(){
    
12.     this.initialize.apply(this, arguments);
    
13. };
    
14. 
    
15. Window_NewGold.prototype = Object.create(Window_Gold.prototype);
    
16. 
    
17. Window_NewGold.prototype.constructor = Window_NewGold;
    
18. 
    
19. Window_NewGold.prototype.refresh = function(){
    
20.     Window_Gold.prototype.refresh.call(this);
    
21.     this.drawIcon(313, 0, 0);
    
22. };
    
23. 
    
24. 
    
25. //******************
    
26. //给菜单选项加上图标
    
27. //******************
    
28. var iconIndex = [208, 64, 137, 84, 75, 242, 229, 82];
    
29. 
    
30. Window_MenuCommand.prototype.drawItem = function(index){
    
31.     var rect = this.itemRectForText(index);
    
32.     var align = this.itemTextAlign();
    
33.     this.resetTextColor();
    
34.     this.changePaintOpacity(this.isCommandEnabled(index));
    
35.     this.drawIcon(iconIndex[index],rect.x,rect.y);
    
36.     this.drawText(this.commandName(index), rect.x + 36, rect.y, rect.width - 36, align);
    
37. };
    
38. 
    
39. Window_MenuCommand.prototype.refresh = function(){
    
40.     Window_Command.prototype.refresh.call(this);
    
41.     this.opacity = 0;
    
42. };
    
43. 
    
44. 
    
45. //****************
    
46. //美化角色状态窗口
    
47. //****************
    
48. Window_MenuStatus.prototype.drawItemCharacterImage = function(index){
    
49.     var actor = $gameParty.members()[index];
    
50.     var rect = this.itemRect(index);
    
51.     this.changePaintOpacity(actor.isBattleMember());
    
52.     this.drawActorCharacter(actor, rect.x + rect.width / 2 , rect.y + rect.height / 2 + 18 );
    
53.     this.changePaintOpacity(true);
    
54. };
    
55. 
    
56. Window_MenuStatus.prototype.drawItem = function(index) {
    
57.     this.drawItemBackground(index);
    
58.     this.drawItemCharacterImage(index);
    
59. };
    
60. 
    
61. Window_MenuStatus.prototype.maxCols = function() {
    
62.     return 4;
    
63. };
    
64. 
    
65. Window_MenuStatus.prototype.numVisibleRows = function() {
    
66.     return 7;
    
67. };
    
68. 
    
69. Window_MenuStatus.prototype.itemRect = function(index){
    
70.     var rect = new Rectangle();
    
71.     var maxCols = this.maxCols();
    
72.     rect.width = this.itemWidth();
    
73.     rect.height = this.itemHeight();
    
74.     rect.x = index % maxCols * (rect.width + this.spacing()) - this._scrollX;
    
75.     rect.y = Math.floor(index / maxCols) * rect.height * ( this.numVisibleRows() - 1 ) - this._scrollY;
    
76.     return rect;
    
77. };
    
78. 
    
79. 
    
80. //*************************
    
81. //美化角色状态窗口_角色信息
    
82. //*************************
    
83. Window_MenuStatus.prototype.itemRectForStatus = function(){
    
84.     var rect = new Rectangle();
    
85.     var maxCols = this.maxCols();
    
86.     rect.width = this.itemWidth() * maxCols;
    
87.     rect.height = this.itemHeight();
    
88.     rect.x = - this._scrollX ;
    
89.     rect.y = rect.height - this._scrollY;
    
90.     rect.height *= ( this.numVisibleRows() - 2 );
    
91.     return rect;
    
92. };
    
93. 
    
94. Window_MenuStatus.prototype.drawActorLevel = function(actor, x, y) {
    
95.     this.changeTextColor(this.systemColor());
    
96.     this.drawText(TextManager.levelA, x, y, 48);
    
97.     this.resetTextColor();
    
98.     this.drawText(actor.level, x + 48, y, 36, 'right');
    
99. };
    
100. 
     
101. Game_BattlerBase.prototype.expRate = function() {
     
102.     return this.currentExp() / this.nextLevelExp();
     
103. };
     
104. 
     
105. Window_MenuStatus.prototype.drawActorExp = function(actor, x, y, width) {
     
106.     width = width || 186;
     
107.     var color1 = this.tpGaugeColor1();
     
108.     var color2 = this.tpGaugeColor2();
     
109.     this.drawGauge(x, y, width, actor.expRate(), color1, color2);
     
110.     this.changeTextColor(this.systemColor());
     
111.     this.drawText(TextManager.expA, x, y, 44);
     
112.     this.drawCurrentAndMax(actor.currentExp(), actor.nextLevelExp(), x, y, width,
     
113.                            this.tpColor(actor), this.normalColor());
     
114. };
     
115. 
     
116. Window_MenuStatus.prototype.maxEquipmentLines = function() {
     
117.     return 6;
     
118. };
     
119. 
     
120. Window_MenuStatus.prototype.drawParameters = function(actor, x, y) {
     
121.     var lineHeight = this.lineHeight();
     
122.     for (var i = 0; i < 6; i++) {
     
123.         var paramId = i + 2;
     
124.         var y2 = y + lineHeight * i;
     
125.         this.changeTextColor(this.systemColor());
     
126.         this.drawText(TextManager.param(paramId), x, y2, 160);
     
127.         this.resetTextColor();
     
128.         this.drawText(actor.param(paramId), x + 160, y2, 60, 'right');
     
129.     }
     
130. };
     
131. 
     
132. Window_MenuStatus.prototype.drawEquipments = function(actor, x, y) {
     
133.     var equips = actor.equips();
     
134.     var count = Math.min(equips.length, this.maxEquipmentLines());
     
135.     for (var i = 0; i < count; i++) {
     
136.         this.drawItemName(equips[i], x, y + this.lineHeight() * i);
     
137.     }
     
138. };
     
139. 
     
140. Window_MenuStatus.prototype.drawItemActorStatus = function(){
     
141.     var actor = $gameParty.members()[this._index==-1?0:this._index];
     
142.     var rect = this.itemRectForStatus();
     
143.     this.drawActorFace(actor, rect.x, rect.y);
     
144.     this.drawActorName(actor, rect.x, rect.y, 144);
     
145.     var _valWidth = ( rect.width - 144 ) / 3;
     
146.     this.drawActorLevel(actor, rect.x + 145, rect.y , _valWidth);
     
147.     this.drawActorClass(actor, rect.x + 145 + _valWidth, rect.y, _valWidth);
     
148.     this.drawActorNickname(actor, rect.x + 145 + _valWidth * 2, rect.y, _valWidth);
     
149.     this.drawActorHp(actor, rect.x + 145, rect.y + 36, rect.width - 144);
     
150.     this.drawActorMp(actor, rect.x + 145, rect.y + 72, rect.width - 144);
     
151.     this.drawActorExp(actor, rect.x + 145, rect.y + 108, rect.width - 144);
     
152.     this.drawParameters(actor, rect.x,rect.y + 144);
     
153.     this.drawEquipments(actor, rect.x + 312,rect.y + 144);
     
154. };
     
155. 
     
156. var xjzsqIndex;
     
157. Window_MenuStatus.prototype.update = function(){
     
158.     Window_Selectable.prototype.update.call(this);
     
159.     if(xjzsqIndex != this._index||(xjzsqIndex == -1 && this._index == 0))
     
160.     {
     
161.         var rect = this.itemRectForStatus();
     
162.         this.contents.clearRect(rect.x, rect.y, rect.width, rect.height);
     
163.         this.drawItemActorStatus();
     
164.         xjzsqIndex = this._index;
     
165.     }
     
166. };
     
167. 
     
168. Window_MenuStatus.prototype.refresh = function(){
     
169.     Window_Selectable.prototype.refresh.call(this);
     
170.     this.drawItemActorStatus();
     
171.     this.opacity = 0;
     
172. };
     
173. 
     
174. 
     
175. //************
     
176. //美化后的菜单
     
177. //************
     
178. Scene_Menu.prototype.createGoldWindow = function() {
     
179.     this._goldWindow = new Window_NewGold(0, 0);
     
180.     this._goldWindow.y = Graphics.boxHeight - this._goldWindow.height;
     
181.     this._goldWindow.opacity = 0;
     
182.     this.addWindow(this._goldWindow);
     
183. };
     
184. 
     
185. Scene_Menu.prototype.createBackground = function(){
     
186.     Scene_MenuBase.prototype.createBackground.call(this);
     
187.     this._backgroundSprite2 = new Sprite();
     
188.     this._backgroundSprite2.bitmap = ImageManager.loadSystem("MenuBackground");
     
189.     this.addChild(this._backgroundSprite2);
     
190. };

复制代码

下面的附件是为了求糖，内容和上面代码框里的一致。
xjzsqMenu.zip (1.9 KB, 下载次数: 8, 售价: 100 星屑)

2019-7-17 00:48 上传

点击文件名下载附件
完整代码文件
售价: 100 星屑  [记录]

然后是工程文件：（请下载解压后直接覆盖粘贴到一个RMMV新建的游戏工程文件夹内，以补全缺少的文件）
MenuGuide.zip (485.16 KB, 下载次数: 7, 售价: 100 星屑)

2019-7-17 01:18 上传

点击文件名下载附件
游戏工程
售价: 100 星屑  [记录]

作业

作业布置什么好呢？
就在菜单的人物信息那里的人物头像下方，显示能力值的位置上方，增加人物当前状态图标（睡眠、中毒等图标）的显示吧！
至于如何显示状态图标，这个就通过自己搜索得知啦！
这次的作业将会在Project1论坛的2L公布答案。

后记

从7.2发第一期，到现在（7.16）已经过了两周了。
在写教程的过程中，我也不断发现自己原来写好的脚本存在的写的不合理或者不优雅的地方，很多原来不是很明白的地方也因为写教程要讲明白所以理解地更加透彻了，也许这就是《礼记》中所说的“教学相长吧”。
下次写教程不知道会是什么时候了，计划是讲解一下官方自带的插件或者其他用的比较多的插件是怎么写出来的，也可能是对MV本身自带脚本的解读，总之敬请期待，请大家多多包涵啦！感谢大家的大力支持！

---

作者: xjzsq    时间: 2019-7-17 00:50
占楼待施工

---

作者: 黑舞嗜    时间: 2019-7-17 18:27
楼主NB，支持一个

---

作者: URUUR    时间: 2019-7-18 21:04
前排顶帖

---

作者: zxcasdqwe719    时间: 2019-7-19 18:06


順手交作業
第一次改菜單，跟著教程一步步測試之後真的有種豁然開朗的感覺w
真的很感謝po耐心細緻的教學！！



作業一：步數窗口

作業二：異常狀態顯示（改了一點）

---

作者: xjzsq    时间: 2019-7-21 09:13

zxcasdqwe719 发表于 2019-7-19 18:06
順手交作業
第一次改菜單，跟著教程一步步測試之後真的有種豁然開朗的感覺w
真的很感謝po耐心細緻的教學！ ...

非常感谢你的回复与支持！
（作业第一次有人做感觉好开心！！！）
作业答案完全正确，不介意我拿来作为参考答案吧？

---

作者: 0moliu0    时间: 2019-9-20 16:56
对于不会画图的萌新来说，这修改ui十分好用

---

作者: 博丽内奥拉    时间: 2019-12-30 08:56
我也来交作业吧，虽然已经过去了几个月

new.zip

2019-12-30 08:56 上传

点击文件名下载附件

2.07 KB, 下载次数: 117

---

作者: xjzsq    时间: 2019-12-30 16:36

博丽内奥拉 发表于 2019-12-30 08:56
我也来交作业吧，虽然已经过去了几个月

作业完成得很不错！
感谢回复！

---

作者: wtyliangting    时间: 2020-8-1 01:04
抱歉，老哥。定义Window_MenuStatus.prototype.update时候，后面的function打错了...

---

作者: ddw6688    时间: 2020-8-1 16:26
感谢分享，正好需要

---

作者: 截心手    时间: 2020-8-21 15:57
感动，楼主的教程看完了。小白我面对数千上万的代码和莫名奇妙的各种方法，要是没有楼主这么细致的思路步骤和代码解释，真的完全不知道如何下手。楼主，我的超人。。。

---

作者: 红十字    时间: 2020-9-4 10:31
感谢无私分享支持

---

作者: chenly228    时间: 2021-2-6 22:18
有几个问题
1、如何找要的功能所要使用的代码。
2、如何知道这个功能的使用方法。
比如我看完你的主菜单，想去弄物品这一栏，发现完全无从下手

建议：能有一个视频来讲解，把过程都走一遍

---

作者: xjzsq    时间: 2021-2-8 01:15

chenly228 发表于 2021-2-6 22:18
有几个问题
1、如何找要的功能所要使用的代码。
2、如何知道这个功能的使用方法。

先回答问题吧：
这两个问题我觉得其实是一个问题，那就是怎么找到原生方法的实现：
简单来说，首先是对整个RM的游戏系统架构有一个大体上的了解（不用太细致），然后大概定位到具体一个类，类中的方法不会很多，基本过一遍看名字结合注释就能大概猜出来是做什么的，特别要注意善用参考资料。
详细来解释一下：
这里RM游戏系统框架可以参考我注意事项第三条中的参考资料，RMMV的系统框架其实和RMVA的基本上完全一致，只是用js重写了一遍（还加了个原生的鼠标和触摸），所以其实命名什么的是完全一样的，需要注意的是函数和变量命名从下划线命名法改为了驼峰命名法（比如mv中是itemRectForStatus，而va中是item_rect_for_status）。因此我们可以直接看VA的帮助文档，其中“脚本入门-解读篇”中列出了RM系统的整体框架以及各个类名对应的含义（顺便可以看看实践篇，用js写一写试一试），另外一些函数可能能够在“RGSS参考-游戏库”下面找到。
而定位到具体的类之后就可以打开参考资料中的原生脚本注释，找到对应的类文件结合机翻注释和函数名的英文寻找自己想要的功能，如果直接无法找到，那么可能在父类里面，甚至在父类的父类里面...
总之，在写脚本之前要多看原生的代码，有一定积累之后就自然就知道在哪了，我开始写教程的时候因为自己没写过几个插件，也是一个函数找半天，异常地困难......

关于做视频的建议...
唉，本来是以为上大学之后就有大把的时间来做自己喜欢的事情了，当时计划会有视频教程和更多对于原生脚本的解读，再多手把手写几个插件什么的，结果上了大学之后进了强化班，发现要卷绩点、打竞赛、搞科研......各种事情都缺时间就导致对RMMV的研究以及在制作的游戏无限期搁置了（然而绩点也没卷起来，竞赛成绩也不理想，科研导师不要我了TwT）......希望有生之年能够继续做RM系列的教程，让自己的游戏继续下去，抱歉说多了有些跑题了...
最后的话，熟能生巧，多熟悉官方的脚本之后自然就能解决问题了，有不懂的问题可以直接在论坛或者本贴提出（可以at我，虽然不一定会多久之后回复...），共勉！

---

作者: laowantong    时间: 2021-3-8 11:33



教程很详细，很棒，跟着一步步做的，稍微调了一点位置。另请教一下，获取游戏时长的方法。目前如上时长显示的步数，还在找方法。

---

作者: xjzsq    时间: 2021-9-14 05:49

laowantong 发表于 2021-3-8 11:33
教程很详细，很棒，跟着一步步做的，稍微调了一点位置。另请教一下，获取游戏时长的方法。目前如 ...

抱歉，回复晚了一些（好吧，是晚了六个月之久...）
在我的参考资料2的github仓库中直接搜索“游戏时间”就可以找到对应源码啦（再强调一次请善用搜索）
具体的位置是在这里的第1247~1249行，可以看到游戏时间对应的是 $gameSystem.playtime() ，考虑到他跟获取步数的方法长得很相似，而且注释也写得很符合要求，所以说明就找到正确的方法了。

---

作者: 幻术    时间: 2021-9-18 01:00

很不错，感谢分享

---

作者: 任小雪    时间: 2021-11-23 08:07


https://rpg.blue/forum.php?mod=v ... p;extra=#pid2934066
隔壁这个帖子我尝试了

尝试了直接drawFace，然后发现必须运行一次自身或者菜单，图片才会开始显示，啧
有没有什么法子

你这个贴太长了，很难消化啊……暂时想弄弄自定义弹窗，唔，使得看起来有卡牌的样子，
我现在用着显示图片加对话框的法子，感觉……如果是打牌的话，就不美好了

---

作者: xjzsq    时间: 2021-12-11 21:46

任小雪 发表于 2021-11-23 08:07
https://rpg.blue/forum.php?mod=viewthread&tid=386506&page=5&extra=#pid2934066
隔壁这个帖子我尝试了

虽然已经很久没有写过mv得脚本了...
但是我猜测原因应该是没有加载资脸图资源源导致的，有一个命令可以load ActorFace的资源到内存中。
刚刚看了一下，在我另一个烂尾教程的最终实现代码里面写过了：

1. var face = ImageManager.loadFace($gameParty.members()[0]._faceName);

复制代码

我用了这句就能正常显示人物的脸图，具体可以看这个贴子：[教程]RMMV脚本教程（二）（更新最终实现代码） - RPG Maker MV 讨论区 - Project1 - Powered by Discuz!
（比较尴尬，写到一半就烂尾了，后来就开了这个新坑，之后更新最终实现代码之后就烂在那了）

---

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

Powered by Discuz! X3.1