1
\$\begingroup\$

enter image description here

Hi all, I'm working on an SDL2 project and I require multiple editable square textboxes as shown in the image above. Is there any way I can do this?

\$\endgroup\$
5
  • \$\begingroup\$ What have you tried? \$\endgroup\$
    – user35344
    Oct 9, 2021 at 17:19
  • \$\begingroup\$ @Tyyppi_77 I have tried to look at text input documentation for SDL but it is nonexistent , the only thing I managed to find was a widget toolkit called Kiss , however If I have no clue how to install it as the instructions are so incredibly vague \$\endgroup\$ Oct 9, 2021 at 17:45
  • \$\begingroup\$ I would recommend you to check out a GUI library called ImGui. It's a very powerful library with an easy installation, with a backend that is prepared to be used together with SDL. \$\endgroup\$ Oct 9, 2021 at 19:10
  • \$\begingroup\$ @Daniel_1985 I'm using c not c++ \$\endgroup\$ Oct 9, 2021 at 20:57
  • \$\begingroup\$ There seems to be c bindings for ImGui... \$\endgroup\$
    – Vaillancourt
    Oct 9, 2021 at 22:10

1 Answer 1

1
\$\begingroup\$

There are two parts to my answer: rendering a dynamic text box onto the screen, and changing the text box based on user input, which hopefully covers both parts of your question. I'm writing this based on the assumption that you're using standard SDL2 libraries and documentation, which (I hope?) are C/C++ blind.

Dynamic text box: What you'll need

In SDL2, the usual way to draw a dynamic text box is that you will need the following things:

You will also need to include the SDL_ttf library, which is a font rendering library for text that is used within the SDL library. It might have been included in your installation - if not, here is a link to get it.

Dynamic text box: The implementation

First you can use the built-in SDL_ttf function TTF_RenderText_BlendedWrapped to render your given text string (which must first be converted into a char array) into an SDL_Surface. The maxLength parameter is the maximum allowable length of the text string before it wraps around into a second line, which is useful for dynamic text wrapping in your boxes to save time and headaches.

Surface = TTF_RenderText_Blended_Wrapped(font, CharArray, color, maxLength);

Next you can use SDL_CreateTextureFromSurface to convert that surface into a texture, using your SDL_Renderer as the first parameter:

Texture = SDL_CreateTextureFromSurface(renderer, Surface);

And finally, you can draw that text box onto the screen using any other function you would use to draw a texture on screen.

The full text box constructor function that I use in my own SDL2 game, for your convenience:

/*
* Constructor with text, font, font color, and renderer.
* 
* @param t: The text in the text box.
* @param font: The font we are using.
* @param color: The color of the text.
* @param renderer: The renderer.
* @param maxLength: The maximum width of the text box before it wraps around.
*/
TextBox(string t, TTF_Font* font, SDL_Color color, SDL_Renderer* renderer, int maxLength)
{
    char CharArray[2000]; // Create a char array
    strcpy_s(CharArray, t.c_str()); // Convert the string into a char array for the surface function.

    Surface = TTF_RenderText_Blended_Wrapped(font, CharArray, color, maxLength); // Make into a surface.
    Texture = SDL_CreateTextureFromSurface(renderer, Surface); // Turn the surface into a texture.
    TTF_SizeText(font, CharArray, &w, &h); // Size the texture so it renders the text correctly.
}

Changing the text box for user input

To do this, you'll need to re-render the text box each time its text changes, since the text is rendered into an SDL_Surface as part of the rendering function. You'll need to overwrite the text box with a new one and re-render it each time the text is updated:

Box = TextBox(NewText, Font, TextColor, renderer, maxLength); // Re-render with the new text.
\$\endgroup\$
8
  • \$\begingroup\$ Thanks , however - I'm using C , not C++ - So most of your Textbox class has no direct equivelent For me in C , i.e. I am unable to use - strcpy_s(CharArray, t.c_str()); , and of course , scince im using C I do not have classes , and can not instantiate \$\endgroup\$ Oct 11, 2021 at 21:33
  • \$\begingroup\$ @BilalAhmed Yikes, I was hoping at least some of this would carry over to C. Not sure what I can do for you then, you've picked a tough battle. \$\endgroup\$
    – Sciborg
    Oct 11, 2021 at 22:39
  • \$\begingroup\$ so its impossible then? \$\endgroup\$ Oct 15, 2021 at 9:53
  • \$\begingroup\$ @BilalAhmed You may be able to look into Vaillancourt's suggestion of using the C bindings for imGui, but beyond that I don't know if this is a thing that can be done. I hope you're able to find something though - I'm not an expert by any means. \$\endgroup\$
    – Sciborg
    Oct 15, 2021 at 15:17
  • \$\begingroup\$ I fanally managed to port It to C! - your advice has been invaluable to me! \$\endgroup\$ Oct 15, 2021 at 17:21

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .