Transparent text background

SDL Development
1

Hey,

I have an issue, with TTF_RenderText_Solid, the out put message looks weird: https://prnt.sc/fl5w7m

The top one is made by: TTF_RenderText_Solid
The middle with: TTF_RenderText with white background color
The bottom with: TTF_RenderText with the blue background color (not transparent!)

So my question is:
{
1. how to make TTF_RenderText_Solid look like the same as bottom one.
OR
2. how to make TTF_RenderText background transparent. Why doesnt it work in my solution?
}

My code:

TTF_Font* text_font = NULL;
text_font = TTF_OpenFont(“OpenSans-Regular.ttf”, 18);
SDL_Color text_color;
text_color = {0, 0, 0};
SDL_Color text_background_color;
text_background_color = {153, 217, 234, 0}; /* <---- Setting alpha to 0 doesn’t work! */
string card_name;
stringstream text;
SDL_Rect textRect;
textRect.x=20;
textRect.y=35;

text<<“Example”;
/* SDL_Surface *text_surface = TTF_RenderText_Solid(text_font, text.str().c_str(), text_color); This make the bad looking one. */
SDL_Surface *text_surface = TTF_RenderText(text_font, text.str().c_str(), text_color, text_background_color);
SDL_Texture *texture_text = SDL_CreateTextureFromSurface(renderer, text_surface);
SDL_QueryTexture(texture_text, NULL, NULL, &textRect.w, &textRect.h);
SDL_RenderCopy(renderer, texture_text, NULL, &textRect);

2

What you are seeing is aliasing (the other two are anti-aliased). You shouldn’t be surprised, because the SDL_ttf docs describe the ‘solid’ mode as “quick and dirty” and comments that “the text is not as smooth”. Use TTF_RenderText_Blended if you want high-quality text with a transparent background.

1 Like