RPG Maker MV 仿新仙剑 战斗场景UI 三

二级战斗指令菜单

仙剑1中二级战斗的菜单内容如下:物品、防御、围攻、逃跑、状态这五项。
现在来完成金玉其外的UI部分,内核具体的功能需要后期进行填充了!

RMMV效果

在RMMV中原始菜单中是没有这二级菜单的,因此需要重新进行添加进去。

代码

Pal_Scene_Battle.prototype.createAllWindows = function() {
    ......
	this.createOtherCommandWindow();
	......
};
Pal_Scene_Battle.prototype.createOtherCommandWindow = function() {
    this._otherCommandWindow = new Window_OtherCommand();
    this._otherCommandWindow.setHandler('item', this.commandItem.bind(this));
    this._otherCommandWindow.setHandler('guard',  this.commandSkill.bind(this));
    this._otherCommandWindow.setHandler('allAttack',  this.commandJointAttack.bind(this));
    this._otherCommandWindow.setHandler('escape',   this.commandEscape.bind(this));
    this._otherCommandWindow.setHandler('status', this.selectPreviousCommand.bind(this));
	this._otherCommandWindow.setHandler('cancel', this.selectOtherCancelCommand.bind(this));
    this.addWindow(this._otherCommandWindow);
};

createAllWindows 方法中添加了创建 createOtherCommandWindow 方法的代码,而 createOtherCommandWindow 方法中创建了额外命令的窗口并绑定了按钮对应的实现,里面不少的方法是原始的方法或临时调用的方法。

Pal_Scene_Battle.prototype.commandOther = function() {
	this._otherCommandWindow.activate();
	this.selectNextCommand2();
};
Pal_Scene_Battle.prototype.selectNextCommand2 = function() {
    this.changeInputWindow();
};
Pal_Scene_Battle.prototype.selectPreviousCommand2 = function() {
    this.changeInputWindow();
};
Pal_Scene_Battle.prototype.selectOtherCancelCommand = function() {
    this._otherCommandWindow.close();
	this.selectPreviousCommand2();
};

这四个方法中commandOther 是上一篇中角色命令窗口的其他按钮所绑定的方法,作用是激活其他(额外)命令窗口,并进行下一个命令,其中调用了selectNextCommand2 方法,该方法调用了切换输入的窗口的方法;selectPreviousCommand2 是上一个命令的操作,这里加了2是区别原来的方法;selectOtherCancelCommand 方法是关闭其他命令窗口,并返回上一个命令。这里之所以这么绕是因为和原始代码保持一致,也保持一定的阅读性。

Pal_Scene_Battle.prototype.isAnyInputWindowActive = function() {
    return ......|| this._otherCommandWindow.active ||......);
};

该方法是判断窗口是否激活的,这里添加了其他命令窗口的激活判断。

Pal_Scene_Battle.prototype.changeInputWindow = function() {
    if (BattleManager.isInputting()) {
        if (BattleManager.actor()) {
			if(this._otherCommandWindow.active){
				this.startOtherCommandSelection();
			}else{
				this.startActorCommandSelection();
			}
        } else {
            this.startPartyCommandSelection();
        }
    } else {
        this.endCommandSelection();
    }
};

changeInputWindow 方法是切换输入窗口的,在这里面添加了对其他命令窗口激活的判断,激活了才执行打开其他命令窗口,否则打开角色命令窗口,这样需要创建的窗口和操作就完成了。

function Window_OtherCommand() {
    this.initialize.apply(this, arguments);
}

Window_OtherCommand.prototype = Object.create(Window_Command.prototype);
Window_OtherCommand.prototype.constructor = Window_OtherCommand;

Window_OtherCommand.prototype.initialize = function() {
    var y = Graphics.boxHeight - this.windowHeight();
    Window_Command.prototype.initialize.call(this, 0, y);
	this.move(15, 94, 128, 224);
    this.openness = 0;
    this.deactivate();
    this._actor = null;
};

Window_OtherCommand.prototype.windowWidth = function() {
    return 128;
};

Window_OtherCommand.prototype.numVisibleRows = function() {
    return 7;
};
//标准内边距
Window_OtherCommand.prototype.standardPadding = function() {
    return 0;
};

//创建命令列表
Window_OtherCommand.prototype.makeCommandList = function() {
    if (this._actor) {
        this.addAttackCommand();
        this.addSkillCommands();
        this.addJointAttackCommand();
		this.addEscapeCommand();
        this.addOtherCommand();
    }
};
//添加道具命令
Window_OtherCommand.prototype.addAttackCommand = function() {
    this.addCommand(TextManager.item, 'item', this._actor.canAttack());
};
//添加防御命令
Window_OtherCommand.prototype.addSkillCommands = function() {
   this.addCommand(TextManager.guard, 'guard', this._actor.canAttack());
};
//添加围攻命令
Window_OtherCommand.prototype.addJointAttackCommand = function() {
    this.addCommand("围攻", 'allAttack', this._actor.canAttack());
};
//添加逃跑命令
Window_OtherCommand.prototype.addEscapeCommand = function() {
    this.addCommand(TextManager.escape, 'escape');
};
//添加状态命令
Window_OtherCommand.prototype.addOtherCommand = function() {
    this.addCommand(TextManager.status, 'status');
};

Window_OtherCommand.prototype.setup = function(actor) {
    this._actor = actor;
    this.clearCommandList();
    this.makeCommandList();
    this.refresh();
    this.selectLast();
    this.activate();
    this.open();
};
Window_OtherCommand.prototype.processOk = function() {
    if (this._actor) {
        if (ConfigManager.commandRemember) {
            this._actor.setLastCommandSymbol(this.currentSymbol());
        } else {
            this._actor.setLastCommandSymbol('');
        }
    }
    Window_Command.prototype.processOk.call(this);
};
Window_OtherCommand.prototype.selectLast = function() {
    this.select(0);
    if (this._actor && ConfigManager.commandRemember) {
        var symbol = this._actor.lastCommandSymbol();
        this.selectSymbol(symbol);
        if (symbol === 'skill') {
            var skill = this._actor.lastBattleSkill();
            if (skill) {
                this.selectExt(skill.stypeId);
            }
        }
    }
};

这里面大部分的代码都是以上一篇的Window_ActorCommand 菜单代码修改来的,因此阅读起来没有任何负担,还是保持的原味!

效果

【RPG Maker MV 仿新仙剑 战斗场景UI (三)】-LMLPHP 【RPG Maker MV 仿新仙剑 战斗场景UI (三)】-LMLPHP 【RPG Maker MV 仿新仙剑 战斗场景UI (三)】-LMLPHP
【RPG Maker MV 仿新仙剑 战斗场景UI (三)】-LMLPHP
这样效果就完成了,但是可以看到没有对应的UI啊!!!
这就是下面需要做的事情了。

仿仙剑UI

现在基础的UI功能已经搭建好了,可以进行下一步的UI处理了!

代码

Window_OtherCommand.prototype.initialize = function() {
    ......
	this.BattleCommand= ImageManager.loadSystem('FightExtend');
    ......
};
Window_OtherCommand.prototype.update=function(){
	Window_Base.prototype.update.call(this);
	this.processCursorMove();
	this.processHandling();
	this._stayCount++;
	this.refresh();
}

Window_OtherCommand.prototype.refresh=function(){
	this.contents.clear();
	if(this._actor){
		this.drawBattleOtherCommand();
	}
}
Window_OtherCommand.prototype.drawSx=new Map([
	[0,0],
	[1,128],
	[2,256],
	[3,384],
	[4,512]
]);
Window_OtherCommand.prototype.drawBattleOtherCommand=function(){
	var bitmap=this.BattleCommand;
	var sy=0;
	var sw=128;
	var sh=224;
	var dx=0;
	var dy=0;
	this.contents.blt(bitmap, this.drawSx.get(this._index), sy, sw, sh, dx, dy);
}

initialize 方法中添加了图片加载的操作;update 和 refresh 方法拿上一个菜单的简要修改下名称即可使用;drawSx 是Map写法的条件封装语句,用于封装判断后的X的位置;drawBattleOtherCommand 方法用于绘制需要绘制的UI图片,其中绘制时根据指令的下标选择对应的位置,然后传入绘制方法中去,这样可以节省不少冗余的代码。

效果

【RPG Maker MV 仿新仙剑 战斗场景UI (三)】-LMLPHP 【RPG Maker MV 仿新仙剑 战斗场景UI (三)】-LMLPHP 【RPG Maker MV 仿新仙剑 战斗场景UI (三)】-LMLPHP
【RPG Maker MV 仿新仙剑 战斗场景UI (三)】-LMLPHP
这样整理的效果就出来了,当然了,还有不少的地方没有处理,这些会在后期进行处理。

03-20 11:35