Drawing a face on a Window

Ozenky

Villager
Member
Joined
Sep 21, 2018
Messages
14
Reaction score
1
First Language
Spanish
Primarily Uses
RMMV
Hello everyone! This is my first post here and I am starting to learn Javascript and want to learn using RPG Maker MV for many personal projects.

I have been tinkering for practice in the Maker and got a lot of interesting results, but my next step is to draw faces on a Window. I wanted to use Window_Base.prototype.drawFace but have not got any luck so far. The code runs but no face shows up. My code is below:

(function(){

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

Window_MyWindow2.prototype = Object.create(Window_Selectable.prototype);
Window_MyWindow2.prototype.constructor = Window_MyWindow2;

Window_MyWindow2.prototype.initialize = function(x,y,height,width) {
Window_Selectable.prototype.initialize.call(this,x,y,height,width);

this.refrescar();
};

Window_MyWindow2.prototype.refrescar = function() {
this.drawTextEx('\\C[20]x= ' + this.canvasToLocalX(500) + '\n\\C[0]y= ' +
this.canvasToLocalY(150), 0,50 );
this.drawFace('PER4',0,0,0,100,100);
}

var _Scene_Map_createAllWindows2 = Scene_Map.prototype.createAllWindows;
Scene_Map.prototype.createAllWindows = function() {
_Scene_Map_createAllWindows2.call(this);
this.createMinimapWindow2();
};

Scene_Map.prototype.createMinimapWindow2 = function() {
this._minimapWindow2 = new Window_MyWindow2(200,30,600,570);
this.addChild(this._minimapWindow2);
};

// }


})();

This has many things that are just for practice purpose, but my goal is to draw a character face on the window. The file name is located where it should be and it is called PER4, but so far no luck.

Thanks. Any help is appreciated.
 

MushroomCake28

KAMO Studio
Global Mod
Joined
Nov 18, 2015
Messages
2,585
Reaction score
3,780
First Language
English
Primarily Uses
RMMV

I've moved this thread to Learning Javascript. Please be sure to post your threads in the correct forum next time. Thank you.


Try with this function for now, it's easier:

Code:
Window_Base.prototype.drawActorFace = function(actor, x, y, width, height) {
    this.drawFace(actor.faceName(), actor.faceIndex(), x, y, width, height);
};
 

Ozenky

Villager
Member
Joined
Sep 21, 2018
Messages
14
Reaction score
1
First Language
Spanish
Primarily Uses
RMMV
[MOVE]Learning Javascript[/MOVE]
Try with this function for now, it's easier:

Code:
Window_Base.prototype.drawActorFace = function(actor, x, y, width, height) {
    this.drawFace(actor.faceName(), actor.faceIndex(), x, y, width, height);
};
I am trying but I am not quite sure what to put in actor.faceName() or actor.faceIndex(). When I try to use, for example, a string with the name it calls error (it says is not a function). ¿Any idea of what is going on there?
 

Silva

Scoobityboo
Veteran
Joined
Nov 5, 2018
Messages
386
Reaction score
204
First Language
English
Primarily Uses
RMMV
Regarding your face not showing, I'm guessing it's because the bitmap isn't loaded when the scene tried to draw the window. If you look at Scene_Menu you'll see that during its creation process it reserves the face images it needs so they're there when it needs to draw them, Scene_Map doesn't do this.

If you were to redraw your window (using the console) after a second of starting the scene you'd probably find that the image does show.

RE using drawActorFace, don't worry about the function's body code, just call it like so:

Code:
this.drawActorFace($gameActors.actor(id), 0, 0, 100, 100);
//replace id with actor's ID
You can substitute $gameActors.actor(id) for another reference to an actor if it's more suitable, so long as you pass the function an actor object (eg. $gameParty.members()[0]).
 

Ozenky

Villager
Member
Joined
Sep 21, 2018
Messages
14
Reaction score
1
First Language
Spanish
Primarily Uses
RMMV
Regarding your face not showing, I'm guessing it's because the bitmap isn't loaded when the scene tried to draw the window. If you look at Scene_Menu you'll see that during its creation process it reserves the face images it needs so they're there when it needs to draw them, Scene_Map doesn't do this.

If you were to redraw your window (using the console) after a second of starting the scene you'd probably find that the image does show.

RE using drawActorFace, don't worry about the function's body code, just call it like so:

Code:
this.drawActorFace($gameActors.actor(id), 0, 0, 100, 100);
//replace id with actor's ID
You can substitute $gameActors.actor(id) for another reference to an actor if it's more suitable, so long as you pass the function an actor object (eg. $gameParty.members()[0]).
I did this an threw me the following error (adedd what's bold):

(function(){

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

Window_MyWindow2.prototype = Object.create(Window_Selectable.prototype);
Window_MyWindow2.prototype.constructor = Window_MyWindow2;

Window_MyWindow2.prototype.dibujaractor = function(nombre, px, py) {
Window_base.prototype.drawActorCharacter.call(this, nombre, px, py);
};

Window_MyWindow2.prototype.initialize = function(x,y,height,width) {
Window_Selectable.prototype.initialize.call(this,x,y,height,width);
this.refrescar();
};

Window_MyWindow2.prototype.refrescar = function() {
// this.drawTextEx('\\C[20]x= ' + this.canvasToLocalX(500) + '\n\\C[0]y= ' +
// this.canvasToLocalY(150) + ' ' + this.partyMemberName(4), 0,50 );
this.drawActorFace($gameActors.actor(1), 0, 0, 100, 100);
}

var _Scene_Map_createAllWindows2 = Scene_Map.prototype.createAllWindows;
Scene_Map.prototype.createAllWindows = function() {
_Scene_Map_createAllWindows2.call(this);
this.createMinimapWindow2();
};

Scene_Map.prototype.createMinimapWindow2 = function() {
this._minimapWindow2 = new Window_MyWindow2(200,30,600,570);
this.drawActorFace($gameActors.actor(1), 0, 0, 100, 100);
this.addChild(this._minimapWindow2);
};
})();

Let me know if there is something to correct here please and thanks (sorry, added file that presentes error).
 

Attachments

Ozenky

Villager
Member
Joined
Sep 21, 2018
Messages
14
Reaction score
1
First Language
Spanish
Primarily Uses
RMMV
Regarding your face not showing, I'm guessing it's because the bitmap isn't loaded when the scene tried to draw the window. If you look at Scene_Menu you'll see that during its creation process it reserves the face images it needs so they're there when it needs to draw them, Scene_Map doesn't do this.

If you were to redraw your window (using the console) after a second of starting the scene you'd probably find that the image does show.

RE using drawActorFace, don't worry about the function's body code, just call it like so:

Code:
this.drawActorFace($gameActors.actor(id), 0, 0, 100, 100);
//replace id with actor's ID
You can substitute $gameActors.actor(id) for another reference to an actor if it's more suitable, so long as you pass the function an actor object (eg. $gameParty.members()[0]).
Oh ok, did the following changes (shown bold) and the result was ... interesting and quite what I was looking for:

(function(){

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

Window_MyWindow2.prototype = Object.create(Window_Selectable.prototype);
Window_MyWindow2.prototype.constructor = Window_MyWindow2;


Window_MyWindow2.prototype.initialize = function(x,y,height,width) {
Window_Selectable.prototype.initialize.call(this,x,y,height,width);
this.refrescar();
};

Window_MyWindow2.prototype.refrescar = function() {
this.drawActorFace($gameActors.actor(1), 0, 0, 100, 100);
}

var _Scene_Map_createAllWindows2 = Scene_Menu.prototype.createStatusWindow;
Scene_Menu.prototype.createStatusWindow = function() {
_Scene_Map_createAllWindows2.call(this);
this.createMinimapWindow2();
};

Scene_Menu.prototype.createMinimapWindow2 = function() {
this._minimapWindow2 = new Window_MyWindow2(200,30,600,570);
this.addChild(this._minimapWindow2);
};
})();

¿Is there a reason why in the first time I load the new menu window, it shows nothing and after that, it show the face as it should? I will consider this matter solved after that answer. From there on I think I can move on by myself quite well.
 

Attachments

MushroomCake28

KAMO Studio
Global Mod
Joined
Nov 18, 2015
Messages
2,585
Reaction score
3,780
First Language
English
Primarily Uses
RMMV
Yeah, it's a caching issue. Basically you load the image in the ram, but it's not ready yet when you draw it in the window. The second time it works since the image is already in the RAM.
 

Ozenky

Villager
Member
Joined
Sep 21, 2018
Messages
14
Reaction score
1
First Language
Spanish
Primarily Uses
RMMV
Yeah, it's a caching issue. Basically you load the image in the ram, but it's not ready yet when you draw it in the window. The second time it works since the image is already in the RAM.
But, ¿it's there a way to fix it? ¿any function I can call or something?
 

MushroomCake28

KAMO Studio
Global Mod
Joined
Nov 18, 2015
Messages
2,585
Reaction score
3,780
First Language
English
Primarily Uses
RMMV
One thing I do in my projects is load the image beforehand. Just use the ImageManager to load it like you would do for sprites.
 

pasunna

Veteran
Veteran
Joined
Feb 3, 2019
Messages
289
Reaction score
69
First Language
thai
Primarily Uses
RMMV
the other way is create refresh function to redraw every thing
and make it update one time after the first draw
but... basically you will update it when something change later anyway
so... it is a must function
 

Ozenky

Villager
Member
Joined
Sep 21, 2018
Messages
14
Reaction score
1
First Language
Spanish
Primarily Uses
RMMV
One thing I do in my projects is load the image beforehand. Just use the ImageManager to load it like you would do for sprites.
I tried to add it inside the function which calls my window creation, like this:

Window_MyWindow2.prototype.initialize = function(x,y,height,width) {
Window_Selectable.prototype.initialize.call(this,x,y,height,width);
ImageManager.loadFace('PER4');
Window_Base.prototype.reserveFaceImages.call(this);
this.refrescar();
};

Still does not show anything. ¿Any suggestion?
 

MushroomCake28

KAMO Studio
Global Mod
Joined
Nov 18, 2015
Messages
2,585
Reaction score
3,780
First Language
English
Primarily Uses
RMMV
You have to call it before that. If it's in the Status menu, I call it in the general menu for example.
 

Ozenky

Villager
Member
Joined
Sep 21, 2018
Messages
14
Reaction score
1
First Language
Spanish
Primarily Uses
RMMV
Ok, it is done. I put that outside of everything, in the mere beginning, and worked fantastically. Gonna show my final work here and I consider this matter closed. ¡Thanks everyone!

(function(){

ImageManager.loadFace('PER4');

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

Window_MyWindow2.prototype = Object.create(Window_Selectable.prototype);
Window_MyWindow2.prototype.constructor = Window_MyWindow2;


Window_MyWindow2.prototype.initialize = function(x,y,height,width) {
Window_Selectable.prototype.initialize.call(this,x,y,height,width);
Window_Base.prototype.reserveFaceImages.call(this);
this.refrescar();
};

Window_MyWindow2.prototype.refrescar = function() {
this.drawActorFace($gameActors.actor(5), 0, 0, 100, 100);
};

var _Scene_Map_createAllWindows2 = Scene_Map.prototype.createAllWindows;
Scene_Map.prototype.createAllWindows = function() {
_Scene_Map_createAllWindows2.call(this);
this.createMinimapWindow2();
};

Scene_Map.prototype.createMinimapWindow2 = function() {
this._minimapWindow2 = new Window_MyWindow2(200,30,600,570);
this.addChild(this._minimapWindow2);
};
})();
 

Users Who Are Viewing This Thread (Users: 0, Guests: 1)

Latest Threads

Latest Posts

Latest Profile Posts

It's weird I actually have MORE work to do when stuck at home than before.
The No Travel Game Jam is here! Jump in to make a game in the month of April that takes place all in one town!


Decided to take a stab at video editing.... Even made a clickbait screen. I'm so proud of my sellout ways. :LZSexcite:

Forum statistics

Threads
95,470
Messages
929,397
Members
125,712
Latest member
Flane
Top