RMMV How To Display Text Anywhere On Screen, and Include In Game Variables, Also How To Hide/Show And Update The Text

[omarproductions]

Hey Makers, how's it going?

I'm not that skilled when it comes to using JavaScript. The only stuff I know is from when I was taking web development 1 in college, plus we barely touch it in that course. So, little to say, my knowledge when it comes to JavaScript, is next to none. That's why I've come here to get some help. All I would like to know is how to display text (and possibly in a text window) anywhere I want using JavaScript, and also display in game variables within the text on screen. I'd also like to know how I can use JavaScript to Hide/Show and update my text, using a call script, so every time the variable within the text on screen changes, it updates, and I can choose when to display the text on screen.

Basically it should look something like this (Picture taken in RPG Maker VX Ace): What I want to do is take the concept I found from a YouTube video, and apply it in JavaScript so I can use it in RPG Maker MV.

Here's the video for reference:
I'd greatly appreciate your help, to make my game the best it can be. Thank you for your time and help!

Regards,
Omar

 

[Zero_G]

You can start with this tutorial, part 4 talks about displaying text anywhere.


And for reference, here is a plugin I made to display text in the corners of the screen, and then fade out.

Spoiler: Plugin Text Popup

//=============================================================================
// Text_Popup.js
//=============================================================================
/*:
 * @Text_Popup
 * @plugindesc Display a popup text
 * @version 1.0
 * @author Zero_G
 * @filename Text_Popup.js
 * @help
 -------------------------------------------------------------------------------
 == Description ==
 This plugin is an example of how to pop up text

 == Terms of Use ==
 - Free for use in non-commercial projects with credits
 - Free for use in commercial projects
 - Please provide credits to Zero_G

 == Usage ==
 Press de C key during gameplay to show popup

 function SceneManager.callPopup(text, position, maxWidht)
 text = text of popup
 position = position of popup ['topRight', 'bottomRight', 'topLeft',
            'bottomLeft'], default is 'topRight'
 maxWidht = max widht of popup in pixels, text will compress to this widht.
            if text is too long, increase it. Deafult 100
 
 -------------------------------------------------------------------------------
*/

var Imported = Imported || {};
var ZERO = ZERO || {};
Imported.ZERO_TextPopup = 1;
ZERO.TextPopup = ZERO.TextPopup || {};

(function ($) {
  document.addEventListener('keydown', event => {
    if (event.keyCode == 67) {  // C
        SceneManager.callPopup('testing popup');
      }
  });

  // Create sprite object
  var popupSprite;
  var _Scene_Base_start = Scene_Base.prototype.start;
  Scene_Base.prototype.start = function () {
    _Scene_Base_start.call(this);

    popupSprite = new Sprite(new Bitmap(Graphics.width, Graphics.height));
    popupSprite.opacity = 255;
    this.addChild(popupSprite);
  };

  // Call popup

  /* drawText info
  * @param {String} text The text that will be drawn
  * @param {Number} x The x coordinate for the left of the text
  * @param {Number} y The y coordinate for the top of the text
  * @param {Number} maxWidth The maximum allowed width of the text
  * @param {Number} lineHeight The height of the text line
  * @param {String} align The alignment of the text
  **/
  SceneManager.callPopup = function (text, position = 'topRight', maxWidth = 100) {
    popupSprite.bitmap.clear();
    popupSprite.opacity = 255;

    switch(position){
        case 'topRight':
            popupSprite.bitmap.drawText(String(text), Graphics.width - maxWidth - 10, 10, maxWidth, 30, 'right');
            break;
        case 'bottomRight':
            popupSprite.bitmap.drawText(String(text), Graphics.width - maxWidth - 10, Graphics.height - 50, maxWidth, 30, 'right');
            break;
        case 'topLeft':
            popupSprite.bitmap.drawText(String(text), 10, 10, maxWidth, 30, 'left');
            break;
        case 'bottomLeft':
            popupSprite.bitmap.drawText(String(text), 10, Graphics.height - 50, maxWidth, 30, 'left');
            break;
    }
  };

  // Fade popup
  var _Scene_Base_update = Scene_Base.prototype.update;
  Scene_Base.prototype.update = function() {
  _Scene_Base_update.call(this);

  if (typeof popupSprite !== 'undefined'){
    if(popupSprite.opacity > 0) {
        popupSprite.opacity -= 1;
    }
  }
};
})(ZERO.TextPopup);

 

[omarproductions]

You can start with this tutorial, part 4 talks about displaying text anywhere.

Thanks!

 

[Zero_G]

But there should be a plugin that does this already, for example one that displays current gold (then modify it to your convenience). Look in the plugin lists.

 

[omarproductions]

But there should be a plugin that does this already, for example one that displays current gold (then modify it to your convenience). Look in the plugin lists.

Can you tell me how cause I tried one time and had no clue what I was doing.

 

[Zero_G]

Display Variable on screen at all times?

A friend and I are working together on a project that allows the player to battle multiple times based on a variable of their choosing. This is set up in a way that there are no rewards for each individual battle but instead checks how many battles were completed before this variable reached...

forums.rpgmakerweb.com

 

[omarproductions]

Display Variable on screen at all times?

A friend and I are working together on a project that allows the player to battle multiple times based on a variable of their choosing. This is set up in a way that there are no rewards for each individual battle but instead checks how many battles were completed before this variable reached...

forums.rpgmakerweb.com

Thanks!

 

[TheGentlemanLoser]

OrangeHUD is the family of plugins you want: be advised I found it a ***** and a half to configure and still am not entirely happy with the results, but then again, I know (even) less about JavaScript than you do (approaching nothing)

 

[omarproductions]

OrangeHUD is the family of plugins you want: be advised I found it a ***** and a half to configure and still am not entirely happy with the results, but then again, I know (even) less about JavaScript than you do (approaching nothing)

Thanks!

 

[Riazey]

There's also SRD Hudmaker which can display not only text but a bunch of other stuff as well~

 

[omarproductions]

There's also SRD Hudmaker which can display not only text but a bunch of other stuff as well~

I’ll check it out sometime. Thanks for telling me!

 

[omarproductions]

Thank you guys for your support! After going through all the things you recommended I do, I decided that I will use SRD Hudmaker, since it’s the easiest plugin I can use. I’d also like to add that those who recommend this plugin, will be in the credits of my game!