Is that possible to use DIY pictures to replace text words on the user interface?

[DrususClaudius]

Hi, is there a method to use .png pictures to show text layout of title/battle prep command, such as "New Game", "Load Game" in the title menu? Sometimes the game interface may look very pretty by using self-found pictures, instead of text words on the buttons, just like those classical gal-games. Is that possible by using scripts? Thank you!

[SapphireSoft]

You must use a script. The following drawScrollContent method is a hint.

(function() {

TitleScreenScrollbar.drawScrollContent = function(x, y, object, isSelect, index) {
}

})();

[DrususClaudius]

Originally posted by SapphireSoft:

You must use a script. The following drawScrollContent method is a hint.

(function() {

TitleScreenScrollbar.drawScrollContent = function(x, y, object, isSelect, index) {
}

})();

Thank you! I will take a try. Btw, is there any scripts I can reference in the original code?

[SapphireSoft]

There is no original code. You paste the above code into a text file and place the file in the plugin folder. Then write the drawScrollContent method code yourself. To write the code you need javascript knowledge.

[DrususClaudius]

Originally posted by SapphireSoft:

There is no original code. You paste the above code into a text file and place the file in the plugin folder. Then write the drawScrollContent method code yourself. To write the code you need javascript knowledge.

Thank you! I got it!

[DrususClaudius]

Originally posted by SapphireSoft:

There is no original code. You paste the above code into a text file and place the file in the plugin folder. Then write the drawScrollContent method code yourself. To write the code you need javascript knowledge.

I tried today and the result seems successful. Therefore I have a further question. How can I change the distribution of title screen scroll bars? For a example, now they are distributed vertically but I want to change the distribution into horizontal. Which script should I use?
I found the original code seems to have some relation to my solution, such as:
_drawScrollbar: function() {
var x, y;
var width = this._scrollbar.getScrollbarWidth();
var height = this._scrollbar.getScrollbarHeight();
var dx = LayoutControl.getRelativeX(8) - 60;
var dy = LayoutControl.getRelativeY(7);

x = root.getGameAreaWidth() - width - dx;
y = root.getGameAreaHeight() - height - dy;
this._scrollbar.drawScrollbar(x, y);
}
However, I am not sure which variable and function controls the distribution of title screen scroll bars and the selection cursor. Do you have any ideas?

[SapphireSoft]

this._scrollbar.setScrollFormation(1, this._commandArray.length);

Change the argument of the above method.
scene-title.js Line 54

[DrususClaudius]

Originally posted by SapphireSoft:

this._scrollbar.setScrollFormation(1, this._commandArray.length);

Change the argument of the above method.
scene-title.js Line 54

I got it. Thank you very much!
And which lines can change the size of scroll bars, which means can control the width and height of scroll bars?

[SapphireSoft]

It is getObjectWidth and getObjectHeight.
scene-title.js Line 283

[DrususClaudius]

Originally posted by SapphireSoft:

It is getObjectWidth and getObjectHeight.
scene-title.js Line 283

And now I want to hide the little finger (select crusor) which is pointing at the objects. Which line should I go to hide the draw?

[SapphireSoft]

TitleScreenScrollbar inherits from BaseScrollbar.
BaseScrollbar implements drawCursor.

So you can implement TitleScreenScrollbar.drawCursor.

[DrususClaudius]

Thanks a lot Sapphire.