RPGツクールMVで、CGの閲覧やシーンの視聴を行うための回想用プラグインが だいぶできあがってきました! (以下画像参照)
タイトルのお話なのですが、 プラグイン作成中に、「ウィンドウにピクチャが表示されない問題」で悩んで、 時間を使ってしまいました! 同じ問題で困らないように、備忘録としてメモを残しておきます。
ピクチャが表示されない問題
Scene_Recollection
- Scene_Baseをプロトタイプ継承したオブジェクト
- 回想モードを選択したり、CGを表示したりする
Window_RecList
- Window_Selectableをプロトタイプ継承したオブジェクト
- 閲覧したい回想シーンを一覧から選択する
ソースコード(ピクチャが表示されない)
//========================================================================= // ■ Scene_Recollection //========================================================================= // 回想用のシーン関数です //========================================================================= function Scene_Recollection() { this.initialize.apply(this, arguments); } Scene_Recollection.prototype = Object.create(Scene_Base.prototype); Scene_Recollection.prototype.constructor = Scene_Recollection; Scene_Recollection.prototype.initialize = function() { Scene_Base.prototype.initialize.call(this); }; Scene_Recollection.prototype.create = function() { Scene_Base.prototype.create.call(this); this.createWindowLayer(); this.createCommandWindow(); }; Scene_Recollection.prototype.createCommandWindow = function() { // 回想リスト this._rec_list = new Window_RecList(0, 0, Graphics.width, Graphics.height); this._rec_list.visible = false; this._rec_list.setHandler('ok', this.commandDoRecMode.bind(this)); this._rec_list.setHandler('cancel', this.commandBackSelectMode.bind(this)); this.addWindow(this._rec_list); }; //------------------------------------------------------------------------- // ● 開始処理 //------------------------------------------------------------------------- Scene_Recollection.prototype.start = function() { Scene_Base.prototype.start.call(this); }; //========================================================================= // ■ Window_RecollectionList //========================================================================= // 回想またはCGを選択するウィンドウです //========================================================================= function Window_RecList() { this.initialize.apply(this, arguments); } Window_RecList.prototype = Object.create(Window_Selectable.prototype); Window_RecList.prototype.constructor = Window_RecList; //------------------------------------------------------------------------- // ● 初期化処理 //------------------------------------------------------------------------- Window_RecList.prototype.initialize = function(x, y, width, height) { Window_Selectable.prototype.initialize.call(this, x, y, width, height); this.windowWidth = width; this.windowHeight = height; this.select(0); this._formationMode = false; this.refresh(); }; //------------------------------------------------------------------------- // ● 組み込み関数カスタマイズ //------------------------------------------------------------------------- Window_RecList.prototype.maxItems = function() { return 3; }; Window_RecList.prototype.maxCols = function() { return 2 }; Window_RecList.prototype.drawItem = function(index) { var rect = this.itemRect(index); var bmp = ImageManager.loadPicture("hoge") this.contents.blt(bmp, rect.x + 16, rect.y + 4 +text_height, this.itemWidth() - 36, this.itemHeight() - 8 - text_height); };
Window_RecList.prototype.drawItemで、選択リスト1つ1つの表示内容を定義しています。 hoge.pngというファイルから、Bitmapを作成し、画面に表示する想定ですが、上記のソースコードだとピクチャが表示されません。
解消方法
- Sceneクラスのstartメソッドで、ピクチャ表示対象のウィンドウをrefreshする必要がありました。
//========================================================================= // ■ Scene_Recollection //========================================================================= // 回想用のシーン関数です //========================================================================= function Scene_Recollection() { this.initialize.apply(this, arguments); } Scene_Recollection.prototype = Object.create(Scene_Base.prototype); Scene_Recollection.prototype.constructor = Scene_Recollection; Scene_Recollection.prototype.initialize = function() { Scene_Base.prototype.initialize.call(this); }; Scene_Recollection.prototype.create = function() { Scene_Base.prototype.create.call(this); this.createWindowLayer(); this.createCommandWindow(); }; Scene_Recollection.prototype.createCommandWindow = function() { // 回想リスト this._rec_list = new Window_RecList(0, 0, Graphics.width, Graphics.height); this._rec_list.visible = false; this._rec_list.setHandler('ok', this.commandDoRecMode.bind(this)); this._rec_list.setHandler('cancel', this.commandBackSelectMode.bind(this)); this.addWindow(this._rec_list); }; //------------------------------------------------------------------------- // ● 開始処理 //------------------------------------------------------------------------- Scene_Recollection.prototype.start = function() { Scene_Base.prototype.start.call(this); // 【!】このrefreshをしないと、ピクチャを表示してくれない this._rec_list.refresh(); }; //========================================================================= // ■ Window_RecollectionList //========================================================================= // 回想またはCGを選択するウィンドウです //========================================================================= function Window_RecList() { this.initialize.apply(this, arguments); } Window_RecList.prototype = Object.create(Window_Selectable.prototype); Window_RecList.prototype.constructor = Window_RecList; //------------------------------------------------------------------------- // ● 初期化処理 //------------------------------------------------------------------------- Window_RecList.prototype.initialize = function(x, y, width, height) { Window_Selectable.prototype.initialize.call(this, x, y, width, height); this.windowWidth = width; this.windowHeight = height; this.select(0); this._formationMode = false; this.refresh(); }; //------------------------------------------------------------------------- // ● 組み込み関数カスタマイズ //------------------------------------------------------------------------- Window_RecList.prototype.maxItems = function() { return 3; }; Window_RecList.prototype.maxCols = function() { return 2 }; Window_RecList.prototype.drawItem = function(index) { var rect = this.itemRect(index); var bmp = ImageManager.loadPicture("hoge") this.contents.blt(bmp, rect.x + 16, rect.y + 4 +text_height, this.itemWidth() - 36, this.itemHeight() - 8 - text_height); };
Window_Selectableを継承したWindow_Recollectionの問題かと思って、コードを読んでいましたが、 結局はSceneが悪かったようです。
なお、Bitmapの表示はされないのですが、「テキスト」ならばrefreshしなくとも表示可能でした。
細かいところでハマってしまい時間を使ってしまいました。。
それでは、皆様も楽しいツクールライフを!