How Do I Create A User Input Text Box That Stores Input Into Variables?

Hi everyone,

I’m pretty shaky with MonoGame, but I was wondering how I could create a user input text box. I was thinking of the logic being a box (image) is clicked (bool), it would then detect what key is pressed and constantly feed it into a list. Don’t worry about symbols, capitals, numbers, command keys etc as all I really want right now are just regular letters.

I have found some forums online but they have been extremely brief and confusing. I did see someone mention using GameWindow.TextInput but again, I’m not really too sure how to use this feature and how it is used to detect user input and all that.

I know my logic maybe inefficient/flawed so if there are easier methods of implementing this system, please let me know thanks :slight_smile:

I found this page about a year ago, worked pretty well for me: https://roy-t.nl/2010/02/11/code-snippet-converting-keyboard-input-to-text-in-xna.html

Hope it’s what you’re looking for.

Humm looks like my old code…
2 problems with that code

  1. Garbage collections. (very bad)
  2. Its hardcoded to en regional language.

Use Window.TextInput += **** your call back method *** when your text box has focus.
Here is a working example i wrote out for you most of this is copy paste if you fully read the comments.

//… signifys i skiped past stuff that you always have in game1

In game1 you should probably make a reference to the game window for this example.

using Microsoft.Xna.Framework;
using Microsoft.Xna.Framework.Graphics;
using Microsoft.Xna.Framework.Input;
using System;
using System.Text;
// ...

public class Game1 : BasicGame
{
     public static GameWindow gw;
     // you will need these variables as well it should be obvious what they are for by their names.
     public static MouseState mouseState;
     bool myBoxHasFocus = true;
     StringBuilder myTextBoxDisplayCharacters = new StringBuilder();
     //...

     // in load assign the game window to that reference this is so we can have a nice way to have more then one textbox.

     protected override void LoadContent()
     {
      gw = Window;
      //...
       
      // the update and assisting methods.

        public static void RegisterFocusedButtonForTextInput(System.EventHandler<TextInputEventArgs> method)
        {
            gw.TextInput += method;
        }
        public static void UnRegisterFocusedButtonForTextInput(System.EventHandler<TextInputEventArgs> method)
        {
            gw.TextInput -= method;
        }
        // these two are textbox specific.
        public void CheckClickOnMyBox(Point mouseClick, bool isClicked, Rectangle r)
        {
            if (r.Contains(mouseClick) && isClicked)
            {
                myBoxHasFocus = !myBoxHasFocus;
                if (myBoxHasFocus)
                    RegisterFocusedButtonForTextInput(OnInput);
                else
                    UnRegisterFocusedButtonForTextInput(OnInput);
            }
        }
        public void OnInput(object sender, TextInputEventArgs e)
        {
            var k = e.Key;
            var c = e.Character;
            myTextBoxDisplayCharacters.Append(c);
            Console.WriteLine(myTextBoxDisplayCharacters);
        }

        protected override void Update(GameTime gameTime)
        {
            if (GamePad.GetState(PlayerIndex.One).Buttons.Back == ButtonState.Pressed || Keyboard.GetState().IsKeyDown(Keys.Escape))
                Exit();

            mouseState = Mouse.GetState();
            var isClicked = mouseState.LeftButton == ButtonState.Pressed;
            CheckClickOnMyBox(mouseState.Position, isClicked, new Rectangle(0, 0, 200, 200));

            base.Update(gameTime);
        }

If you use spriteBatch.DrawString to show the bool myBoxHasFocus via to string and print the myTextBoxDisplayCharacters

Clicking and typing in the top left rectangle area will show you the input you have typed when the displayed bool myBoxHasFocus is true.

I didn’t really rig up the click code well sorry.

spriteBatch.DrawString(currentFont, myBoxHasFocus.ToString(), new Vector2(10, 500), Color.Yellow);
spriteBatch.DrawString(currentFont, myTextBoxDisplayCharacters, new Vector2(10, 510), Color.Red);

I have a new full class that does it all without textinput but its not done i was actually working on it atm.

3 Likes

Hey,

Thank you so much for taking time to help me write this code. I have implemented it into my project and it works! This code is pretty good and does exactly what I want :smiley: