Awesome Arrays - TextBuffers


This is that magic code that allows this Hover Display plugin to do its thing. It may not look all that impressive but trust me when I say there's a lot going on under the hood. RPG Maker is pretty limited so stuff that should be simple can end up quite complicated. All my plugins are meant to make something that's perceivable as impossible into a reality & were all built out of personal necessity. With that in mind, let's talk about TextBuffers.


TextBuffers

These are like really high level strings. For those unaware, strings are basically arrays of text characters. TextBuffers are built around the premise that they micromanage themselves to make paragraphs. They detect words & perform word wrap by measuring how much space is needed based on factors like text size & how long each line can be in pixels. Unlike strings, you can customize each letter, word, & line in entire paragraphs worth of text using familiar tags like <b> Bold, <i> Italic, & <br> Line Break. You can even use multiple colors repeatedly & without changing the default text color by using the <#> tag which works with hex color codes. Example: <#ff0000> or <#FF000> is Red.

Syntax 1: new TextBuffer(textSize, textColor, maxWidth);

Syntax 2: new TextBuffer(textSize);


Breakdown

If you specify the maxWidth parameter as in syntax 1, then it becomes a static value. Max width is used to calculate the space available for each word per line. Word overflow creates new lines which increase max height.

If you omit the maxWidth parameter then your new TextBuffer will calculate a max width for you by creating a preset based on textSize. This has a pretty niche use but works well for floating text like speech bubbles which is the main reason I created the feature. Note: A textSize below 12px leaves the text hard to read.


Ok, so we're gonna need a DisplayObject, some rendered object that can to hold text like a window or sprite. We will use a TextBuffer rather that an array or empty string for that text. It'll format the text automatically & prepare it for drawing later.

someWindow._textBuffer = new TextBuffer(12);


Now, let's create some text to show on refresh. Ideally, you want to make a function to change the text & then call the refresh function.

someWindow.sourceText = 'This is some text.';

someWindow.changeText = function(newText) {

   this.sourceText = newText;

   this.refresh();

}


Next,  let's get that refresh ready. We'll do this by defining that window's refresh function.

someWindow.refresh = function() {

   this._textBuffer.clear();

   this._textBuffer.add(this.sourceText);

    var width = this._textBuffer.maxWidth();

    var height = this._textBuffer.maxHeight();

   this.bitmap = new Bitmap(width, height);

   this.bitmap.fontSize = someSize;

   this.bitmap.textColor = someColor;

   this._text.draw(this.bitmap, 'left');

}


When we call the 'add' function of the TextBuffer it formats the text & populates values for maxHeight & maxWidth(if not specified) which can then be used in bitmap creation. A bitmap is needed as an parameter for the built in draw function  & creating one like this will allow the text to adjust on the fly if needed. Note: With AwesomeArrays active you can actually use the function $gameTemp.hexToColor(colorCode) to turn a hex code like #ff0000 into a compatible rgba color. In this case it would become rgba(255, 0, 0, 255) which is also Red.


Aside from rendering the containing object which I'll assume you know how to do, that's all you really need to do. The add function will measure the text parameter and ensure words are properly drawn while avoiding overflow & processing new line characters which makes it able to draw vertical lists correctly as well. It's as self-sufficient as I could make it on its own.


Hover Display is meant to take this example further & put it all into place for you in the context of hovering text. It allows for temporary windows that can open, close, & refresh as needed. It also ensures that everything happens at the right time in code to show up properly which are important factors that involve some extra know-how beyond the scope of what I'm sharing here. If you have a point & click style game, then Hover Display should come in handy. If you want better text display options TextBuffers in general should come in handy. Hope this helps.

Get Hover Display Plugin for RPG Maker MV

Buy Now$2.00 USD or more

Leave a comment

Log in with itch.io to leave a comment.