How to render text in SDL2? - c

I'm using an SDL_Window and SDL_Renderer.
Is it possible to use SDL_TTF with SDL_Render/SDL_Window? If so, how?

Yep, it is possible, given that you have a renderer and a window plus you don't really have any thoughts on dabbling with surfaces then you might want to mind on creating texture, here is a sample code
//this opens a font style and sets a size
TTF_Font* Sans = TTF_OpenFont("Sans.ttf", 24);
// this is the color in rgb format,
// maxing out all would give you the color white,
// and it will be your text's color
SDL_Color White = {255, 255, 255};
// as TTF_RenderText_Solid could only be used on
// SDL_Surface then you have to create the surface first
SDL_Surface* surfaceMessage =
TTF_RenderText_Solid(Sans, "put your text here", White);
// now you can convert it into a texture
SDL_Texture* Message = SDL_CreateTextureFromSurface(renderer, surfaceMessage);
SDL_Rect Message_rect; //create a rect
Message_rect.x = 0; //controls the rect's x coordinate
Message_rect.y = 0; // controls the rect's y coordinte
Message_rect.w = 100; // controls the width of the rect
Message_rect.h = 100; // controls the height of the rect
// (0,0) is on the top left of the window/screen,
// think a rect as the text's box,
// that way it would be very simple to understand
// Now since it's a texture, you have to put RenderCopy
// in your game loop area, the area where the whole code executes
// you put the renderer's name first, the Message,
// the crop size (you can ignore this if you don't want
// to dabble with cropping), and the rect which is the size
// and coordinate of your texture
SDL_RenderCopy(renderer, Message, NULL, &Message_rect);
// Don't forget to free your surface and texture
SDL_FreeSurface(surfaceMessage);
SDL_DestroyTexture(Message);
I tried to explain the code line by line, you don't see any window right there since I already assumed that you knew how to initialize a renderer which would give me an idea that you also know how to initialize a window, then all you need is the idea on how to initialize a texture.
Minor questions here, did your window open? was it colored black? if so then my thoughts were right, if not, then you can just ask me and I could change this code to implement the whole section which consists of a renderer and a window.

SDL_ttf minimal runnable example
Not super efficient, but easy to integrate. For efficiency see: How to render fonts and text with SDL2 efficiently?
Kept in a separate repo than the main SDL source, but hosted on the same official server, so should be fine: http://hg.libsdl.org/SDL_ttf/
Newlines won't work. You have to work with line heights.
Compile and run:
sudo apt-get install -y libsdl2-dev
gcc -lSDL2 -lSDL2_ttf -o ttf ttf.c
./ttf /usr/share/fonts/truetype/freefont/FreeMonoOblique.ttf
You must pass the path of a TTF font file to the program.
ttf.c
#include <stdlib.h>
#include <SDL2/SDL.h>
#include <SDL2/SDL_ttf.h>
#define WINDOW_WIDTH 300
#define WINDOW_HEIGHT (WINDOW_WIDTH)
/*
- x, y: upper left corner.
- texture, rect: outputs.
*/
void get_text_and_rect(SDL_Renderer *renderer, int x, int y, char *text,
TTF_Font *font, SDL_Texture **texture, SDL_Rect *rect) {
int text_width;
int text_height;
SDL_Surface *surface;
SDL_Color textColor = {255, 255, 255, 0};
surface = TTF_RenderText_Solid(font, text, textColor);
*texture = SDL_CreateTextureFromSurface(renderer, surface);
text_width = surface->w;
text_height = surface->h;
SDL_FreeSurface(surface);
rect->x = x;
rect->y = y;
rect->w = text_width;
rect->h = text_height;
}
int main(int argc, char **argv) {
SDL_Event event;
SDL_Rect rect1, rect2;
SDL_Renderer *renderer;
SDL_Texture *texture1, *texture2;
SDL_Window *window;
char *font_path;
int quit;
if (argc == 1) {
font_path = "FreeSans.ttf";
} else if (argc == 2) {
font_path = argv[1];
} else {
fprintf(stderr, "error: too many arguments\n");
exit(EXIT_FAILURE);
}
/* Inint TTF. */
SDL_Init(SDL_INIT_TIMER | SDL_INIT_VIDEO);
SDL_CreateWindowAndRenderer(WINDOW_WIDTH, WINDOW_WIDTH, 0, &window, &renderer);
TTF_Init();
TTF_Font *font = TTF_OpenFont(font_path, 24);
if (font == NULL) {
fprintf(stderr, "error: font not found\n");
exit(EXIT_FAILURE);
}
get_text_and_rect(renderer, 0, 0, "hello", font, &texture1, &rect1);
get_text_and_rect(renderer, 0, rect1.y + rect1.h, "world", font, &texture2, &rect2);
quit = 0;
while (!quit) {
while (SDL_PollEvent(&event) == 1) {
if (event.type == SDL_QUIT) {
quit = 1;
}
}
SDL_SetRenderDrawColor(renderer, 0, 0, 0, 0);
SDL_RenderClear(renderer);
/* Use TTF textures. */
SDL_RenderCopy(renderer, texture1, NULL, &rect1);
SDL_RenderCopy(renderer, texture2, NULL, &rect2);
SDL_RenderPresent(renderer);
}
/* Deinit TTF. */
SDL_DestroyTexture(texture1);
SDL_DestroyTexture(texture2);
TTF_Quit();
SDL_DestroyRenderer(renderer);
SDL_DestroyWindow(window);
SDL_Quit();
return EXIT_SUCCESS;
}
GitHub upstream.
Tested in Ubuntu 16.04, SDL 2.0.4.

Yes it is. You create a surface with the text you want and then convert it to a texture that you can render.
Some sample code from one of my projects:
std::string score_text = "score: " + std::to_string(score);
SDL_Color textColor = { 255, 255, 255, 0 };
SDL_Surface* textSurface = TTF_RenderText_Solid(font, score_text.c_str(), textColor);
SDL_Texture* text = SDL_CreateTextureFromSurface(renderer, textSurface);
int text_width = textSurface->w;
int text_height = textSurface->h;
SDL_FreeSurface(textSurface);
SDL_Rect renderQuad = { 20, win_height - 30, text_width, text_height };
SDL_RenderCopy(renderer, text, NULL, &renderQuad);
SDL_DestroyTexture(text);
This assumes you've properly initialized SDL_ttf and loaded a font. In the example scoreis an int. The screen gets cleared and rendered to somewhere else (I didn't include that part).
For a full working example, check out the tutorial for SDL_ttf in SDL2 at Lazy Foo.

Edited to make it easier to follow along, to use Roboto.ttf (https://fonts.google.com/specimen/Roboto) instead of Verdana.ttf and to add not2qubit suggestion. Please keep in mind that this doesn't follow any C++ class convention at all. I just wanted to be sure that this would be easy enough to copy/paste and run.
To build this you need to add the library SDL_ttf (https://www.libsdl.org/projects/SDL_ttf/).
g++ demo.cpp -o demo -Wall -I include -lsdl2 -lsdl2_ttf
Since there are some people struggling with more complex code, I've included my own snippet here to help some beginners like myself. This will just show a red screen with a black hello world. Don't forget to add -lsdl2 and -lsdl2_ttf on your build and include the Verdana.ttf font on the same folder.
#include <iostream>
#include <SDL2/SDL.h>
#include <SDL2/SDL_ttf.h> //This is an sample library not included with stock SDL2. https://www.libsdl.org/projects/SDL_ttf/release-1.2.html
const char* WINDOW_TITLE = "Hello World SDL2 + TTF";
const char* FONT_NAME = "roboto.ttf";
const int FONT_SIZE = 128;
const int WINDOW_WIDTH = 1280, WINDOW_HEIGHT = 720;
SDL_Window* Window; // Window created by SDL.
SDL_Renderer* Renderer; // The renderer that shows our textures.
SDL_Event WindowEvent; // Event capturer from SDL Window.
SDL_Color TextColor = { 255, 0, 0, 255}; // Red SDL color.
TTF_Font* Font; // The font to be loaded from the ttf file.
SDL_Surface* TextSurface; // The surface necessary to create the font texture.
SDL_Texture* TextTexture; // The font texture prepared for render.
SDL_Rect TextRect; // Text rectangle area with the position for the texture text.
void CreateWindow() {
Window = SDL_CreateWindow(WINDOW_TITLE, SDL_WINDOWPOS_CENTERED, SDL_WINDOWPOS_CENTERED, WINDOW_WIDTH, WINDOW_HEIGHT, SDL_WINDOW_ALLOW_HIGHDPI);
if (!Window)
std::cout << "There was a problem creating the window.";
Renderer = SDL_CreateRenderer(Window, -1, 0);
if (!Renderer)
std::cout << "There was a problem creating the renderer.";
}
void CreateText(const char* Message) {
TTF_Init();
TTF_Font *font = TTF_OpenFont(FONT_NAME, FONT_SIZE);
if (!font)
std::cout << "Couldn't find/init open ttf font." << std::endl;
TextSurface = TTF_RenderText_Solid(font, Message, TextColor);
TextTexture = SDL_CreateTextureFromSurface(Renderer, TextSurface);
TextRect.x = WINDOW_WIDTH - TextSurface->w * 0.5; // Center horizontaly
TextRect.y = WINDOW_HEIGHT - TextSurface->h * 0.5; // Center verticaly
TextRect.w = TextSurface->w;
TextRect.h = TextSurface->h;
// After you create the texture you can release the surface memory allocation because we actually render the texture not the surface.
SDL_FreeSurface(TextSurface);
TTF_Quit();
}
bool IsPollingEvent() {
while(SDL_PollEvent(&WindowEvent)) {
switch (WindowEvent.type) {
case SDL_QUIT: return false;
}
}
return true;
}
void RenderText() {
SDL_SetRenderDrawColor(Renderer, 0, 0, 0, 255); // Make window bg black.
SDL_RenderClear(Renderer); // Paint screen black.
SDL_RenderCopy(Renderer, TextTexture, NULL, &TextRect); // Add text to render queue.
SDL_RenderPresent(Renderer); // Render everything that's on the queue.
SDL_Delay(10); // Delay to prevent CPU overhead as suggested by the user `not2qubit`
}
void ClearMemory() {
SDL_DestroyTexture(TextTexture);
SDL_DestroyRenderer(Renderer);
SDL_DestroyWindow(Window);
SDL_Quit();
std::cout << "Clear proccess done." << std::endl;
}
int main() {
CreateWindow();
CreateText("Hello SDL_Ttf");
while (IsPollingEvent()) {
RenderText();
}
ClearMemory();
return EXIT_SUCCESS;
}

For Powershell on Windows
If you're trying to do this from Powershell on Windows, you'll soon find out that this is a real PITA. Until now...
I've just spent the hours to debug all the details to get this to work, when you want to insist using Clang++ and SDL2 to render a native Windows window with text.
There are 3 things you need to install; LLVM, SDL2, SDL2_ttf. Then you have to ensure your program will find your libraries, headers and fonts. This is basically summarized in the following program here:
//---------------------------------------------------------------------
// Name: HelloSDL2.cpp
// Author: EAML
// Date: 2021-05-16
//
// Description:
// A minimal PoC for producing a native SDL2 Windows app that can
// be ran from either Windows Explorer or from Powershell console.
// It's designed to use minimal command line, compiler options,
// and dependencies... It will display a gray window for 2 sec's.
//
// Dependencies:
// [1] LLVM Clang++ compiler package
// [2] SDL2 Libraries (DLL's) and Header files (*.h)
// [3] TTF Libraries (DLL's) and Header files (*.h)
//
// Notes:
// There is a slight variation in the bahaviour, depending on:
// (a) if you compile as a Windows GUI: the text will not show.
// (b) if you compile as a console CLI: text will show in both terminal and/or in a 2nd new window
// (c) You may need to use "main()" for console and "WinMain()" for GUI...
// (c) to install on Linux, use packages: clang, libsdl2-dev
// (d) Someone said: #define SDL_MAIN_HANDLED ...
//
// To Run:
// cp .\SDL2\lib\x64\SDL2.dll C:\Windows\. # For SDL2
// cp .\SDL2_ttf\lib\x64\*.dll C:\Windows\. # For SDL2 TTF
// cp C:\Windows\Fonts\arial.ttf . # Get a font...
//
// For a CLI version, with console output in 2nd Window:
// # clang++.exe -std=c++11 main.cpp -o main.exe -L .\SDL2\lib\x64\ -L .\SDL2_ttf\lib\x64\ -I .\SDL2_ttf\include\ -I .\SDL2\include\ -lShell32 -lSDL2main -lSDL2 -lSDL2_ttf -Wno-narrowing -Xlinker /subsystem:console
//
// For a GUI version, without any console output:
// # clang++.exe -std=c++11 main.cpp -o main.exe -L .\SDL2\lib\x64\ -L .\SDL2_ttf\lib\x64\ -I .\SDL2_ttf\include\ -I .\SDL2\include\ -lShell32 -lSDL2main -lSDL2 -lSDL2_ttf -Wno-narrowing -Xlinker /subsystem:windows
//
// References:
// [1] https://github.com/llvm/llvm-project/releases
// [2] http://www.libsdl.org/release/SDL2-devel-2.0.14-VC.zip
// [3] https://www.libsdl.org/projects/SDL_ttf/release/SDL2_ttf-devel-2.0.15-VC.zip
// [4] https://www.libsdl.org/projects/SDL_ttf/docs/SDL_ttf.html
// [5] http://www.sdltutorials.com/sdl-ttf
//---------------------------------------------------------------------
//#include <SDL2/SDL.h>
#include "SDL2/include/SDL.h"
#include "SDL2_ttf/include/SDL_ttf.h"
#include <stdio.h>
#define SCREEN_WIDTH 640
#define SCREEN_HEIGHT 480
#define WINDOW_TITLE "Hello SDL2!"
//#define WINDOW_TEXT "Hello World!"
void drawText ( SDL_Surface* screen, char* string, int size, int x, int y, SDL_Color fgC, SDL_Color bgC) {
// Remember to call TTF_Init(), TTF_Quit(), before/after using this function.
TTF_Font* font = TTF_OpenFont("arial.ttf", size);
if(!font) {
printf("[ERROR] TTF_OpenFont() Failed with: %s\n", TTF_GetError());
exit(2);
}
TTF_SetFontStyle(font, TTF_STYLE_BOLD);
//SDL_Surface* textSurface = TTF_RenderText_Solid(font, string, fgC);
SDL_Surface* textSurface = TTF_RenderText_Shaded(font, string, fgC, bgC);
SDL_Rect textLocation = { x, y, 0, 0 };
SDL_BlitSurface(textSurface, NULL, screen, &textLocation);
SDL_FreeSurface(textSurface);
TTF_CloseFont(font);
//printf("Oh My Goodness, an error : %s\n", TTF_GetError()); return 1;
}
int main(int argc, char* args[]) {
SDL_Window* window = NULL; // The window we are rendering to
SDL_Surface* screenSurface = NULL; // The surface contained by the window
if (SDL_Init(SDL_INIT_VIDEO) < 0) {
printf( "SDL could not initialize! SDL Error: %s\n", SDL_GetError());
return 1;
}
window = SDL_CreateWindow(WINDOW_TITLE, SDL_WINDOWPOS_UNDEFINED, SDL_WINDOWPOS_UNDEFINED,SCREEN_WIDTH, SCREEN_HEIGHT, SDL_WINDOW_SHOWN);
if (window == NULL) {
printf( "Window could not be created! SDL Error: %s\n", SDL_GetError());
return 1;
}
screenSurface = SDL_GetWindowSurface(window);
SDL_FillRect(screenSurface, NULL, SDL_MapRGB(screenSurface->format, 0x80, 0x80, 0x80)); // Set a gray background canvas
SDL_UpdateWindowSurface(window);
//-----------------------------------------------------
// Draw the Text
//-----------------------------------------------------
if(TTF_Init() == -1) {
printf("[ERROR] TTF_Init() Failed with: %s\n", TTF_GetError());
exit(2);
}
SDL_Color fgC1 = { 0xff,0xff,0xff }, bgC1 = {0x00,0x00,0xa0}; // white text on blue background
SDL_Color fgC2 = { 0x00,0x00,0x00 }, bgC2 = {0xff,0x00,0xff}; // black text on magenta background
drawText( screenSurface, (char*) "Hello World! # (x=50, y=100)", 18, 50,100, fgC1, bgC1); // 18 pt # (x=100,y=150)
drawText( screenSurface, (char*) "arial.ttf # (x=200, y=150)", 16, 200,150, fgC2, bgC2); // 16 pt # (x=100,y=150)
SDL_UpdateWindowSurface(window);
TTF_Quit();
//-----------------------------------------------------
// Get some info...
//-----------------------------------------------------
SDL_version compiled;
SDL_version linked;
SDL_version ttfv;
SDL_VERSION(&compiled);
SDL_GetVersion(&linked);
SDL_TTF_VERSION(&ttfv);
printf("Compiled using SDL version : %d.%d.%d \n", compiled.major, compiled.minor, compiled.patch);
printf("and linked with SDL version : %d.%d.%d \n", linked.major, linked.minor, linked.patch);
printf("and using SDL_TTF version : %d.%d.%d \n", ttfv.major, ttfv.minor, ttfv.patch);
SDL_Delay(3000); // Wait 3 seconds
SDL_DestroyWindow(window);
SDL_Quit();
return 0;
}
The result of running the code above is this:
How to get to this point?
Install LLVM for Windows:
Check the box for [x] add to Windows PATH.
If you didn't add LLVM to your Windows PATH, then at least add it temporarily and manually.
Open a Powershell and type: $env:path += ";C:\Program Files\LLVM\bin"
Install SDL2 for Windows:
Download and extract the SDL2 & SDL2_ttf runtime binaries (*.dll) and header libraries (found in [2,3])
and put them into separate SDL folder(s) in the same directory as your C++ file.
You should now have something like:
# tree --dirsfirst ./SDL2{,_ttf} -P *.h
./SDL2
├── include
│   ├── begin_code.h
│   ├── close_code.h
│   ├── SDL.h
│   ├── SDL_assert.h
...
│   ├── SDL_version.h
│   ├── SDL_video.h
│   └── SDL_vulkan.h
└── lib
./SDL2_ttf
└── include
   └── SDL_ttf.h
# tree --dirsfirst ./SDL2{,_ttf}/lib -P *.dll
./SDL2/lib
├── x64
│   └── SDL2.dll
└── x86
└── SDL2.dll
./SDL2_ttf/lib
├── x64
│   ├── libfreetype-6.dll
│   ├── SDL2_ttf.dll
│   └── zlib1.dll
└── x86
├── libfreetype-6.dll
├── SDL2_ttf.dll
└── zlib1.dll
Copy all the relevant downloaded DLL's into the C:\Windows\, unless you know how to make clang++.exe able to find them. (I wasn't able...)
cd C:\path\to\main.cpp
cp .\SDL2\lib\x64\SDL2.dll C:\Windows\. # For SDL2
cp .\SDL2_ttf\lib\x64\*.dll C:\Windows\. # For SDL2 TTF
cp C:\Windows\Fonts\arial.ttf . # Get a font...
Download the above SDL2 "Hello World" Windows program.
Use the Minimal PoC code from here.
Compile the program with:
clang++.exe -std=c++11 main2.cpp -o main.exe -L .\SDL2\lib\x64\ -L .\SDL2_ttf\lib\x64\ -I .\SDL2_ttf\include\ -I .\SDL2\include\ -lShell32 -lSDL2main -lSDL2 -lSDL2_ttf -Wno-narrowing -Xlinker /subsystem:windows
The order of how the libraries are placed, seem to have an importance. Make sure it's like above.
Also, notice the two different -Xlinker options:
/subsystem:windows # This give you only one window but no console output
/subsystem:console # This give you console output, but in a 2nd window when in GUI
To see other linker optins, use:
link.exe /link
link.exe /lib
# The most relevant are:
/DLL
/ENTRY:symbol
/LIBPATH:dir
/MACHINE:{ARM|ARM64|EBC|X64|X86}
/SUBSYSTEM:{CONSOLE | NATIVE | POSIX | WINDOWS | WINDOWSCE |...}
/VERBOSE
You are now good to go!
Download References
LLVM Clang++ compiler package
SDL2 Libraries (DLL's) and Header files (*.h)
SDL2 TTF Libraries (DLL's) and Header files (*.h)
Useful SDL wiki

If you want it to do with class:
// Include somewhere
#include <SDL2/SDL_ttf.h>
// Do not forget to init TTF once somewhere main.cpp
if (TTF_Init()==-1) {
printf("Failed to TTF: %s", SDL_GetError());
return 1;
}
// Have a font instance ready
TTF_Font* font = TTF_OpenFont("assets/fonts/ugly.ttf", 72);
if (font==NULL){
printf("Failed to load font: %s", SDL_GetError());
}
// Have a Text instance ready
// (Class file is below this code)
// Also you need to provide SDL_Renderer* renderer to init
Text* fps_tracker = new Text(renderer, font);
// Somewhere in while true
fps_tracker.setText("FPS: 232");
// Render it
fps_tracker.render();
Here is the class:
using namespace std;
#include <string>
#include <SDL2/SDL_image.h>
#include <SDL2/SDL_ttf.h>
class Text {
SDL_Texture* texture = NULL;
SDL_Rect position;
TTF_Font* font;
SDL_Renderer* renderer;
SDL_Color color;
string text;
public:
Text(SDL_Renderer* renderer, TTF_Font* font, string text="", int x=0, int y=0, SDL_Color color={255, 255, 255}) {
position.x = x;
position.y = y;
this->color = color;
this->font = font;
this->renderer = renderer;
}
void setText(string text) {
if (this->text==text){
return;
}
this->text = text;
SDL_DestroyTexture(texture);
SDL_Surface* surface = TTF_RenderText_Solid(font, text.c_str(), color);
if (surface==NULL) {
printf("Failed to render text: %s", SDL_GetError());
}
position.w = surface->w;
position.h = surface->h;
texture = SDL_CreateTextureFromSurface(renderer, surface);
SDL_FreeSurface(surface);
}
void render() {
SDL_RenderCopy(renderer, texture, NULL, &position);
}
~Text() {
SDL_DestroyTexture(texture);
}
};

If you don't want to or can't use the SDL2 TTF library, you can easily implement it yourself with just the freetype library.
Include freetype
#include <ft2build.h>
#include FT_FREETYPE_H
Create texture class
class texture
{
public:
texture() : t{nullptr} {}
texture(const texture &) = delete;
texture &operator=(const texture &) = delete;
texture(texture &&o) : t{o.t}
{
o.t = nullptr;
}
inline texture &operator=(texture &&o)
{
release();
t = o.t;
o.t = nullptr;
return *this;
}
inline texture(SDL_Renderer *renderer, void *image, int width, int height, int depth, int pitch, uint32_t rmask, uint32_t gmask, uint32_t bmask, uint32_t amask) : t{nullptr}
{
attach_image(renderer, image, width, height, depth, pitch, rmask, gmask, bmask, amask);
}
inline void attach_image(SDL_Renderer *renderer, void *image, int width, int height, int depth, int pitch, uint32_t rmask, uint32_t gmask, uint32_t bmask, uint32_t amask)
{
release();
SDL_Surface *s = SDL_CreateRGBSurfaceFrom(image, width, height, depth, pitch, rmask, gmask, bmask, amask);
t = SDL_CreateTextureFromSurface(renderer, s);
SDL_FreeSurface(s);
}
inline void draw(SDL_Renderer *renderer, const SDL_Rect *src, const SDL_Rect *dest) const
{
if (t)
SDL_RenderCopyEx(renderer, t, src, dest, 0, nullptr, SDL_FLIP_NONE);
}
int width() const
{
if(!t) return 0;
int w;
SDL_QueryTexture(t, nullptr, nullptr, &w, nullptr);
return w;
}
int height() const {
if(!t) return 0;
int h;
SDL_QueryTexture(t, nullptr, nullptr, nullptr, &h);
return h;
}
~texture()
{
release();
}
private:
SDL_Texture *t;
inline void release()
{
if (t)
SDL_DestroyTexture(t);
t = nullptr;
}
};
Create glyph class
struct character : texture
{
using texture::texture;
unsigned int advance;
int bearing_x;
int bearing_y;
};
Determine endianness and set up masks
#if SDL_BYTEORDER == SDL_BIG_ENDIAN
#define rmask 0x000000ff
#define gmask 0x0000ff00
#define bmask 0x00ff0000
#define amask 0xff000000
#else
#define rmask 0xff000000
#define gmask 0x00ff0000
#define bmask 0x0000ff00
#define amask 0x000000ff
#endif
Create converter from free type's 8bit pixel depth to 32bit for SDL2
void convert_8_to_32_depth(std::vector<uint32_t> &res, unsigned char *image, int width, int height)
{
res.clear();
res.reserve(width * height);
for (int y = 0; y < height; ++y)
{
for (int x = 0; x < width; ++x)
{
if (image[y * width + x])
res.push_back(amask);
else
res.push_back(0);
}
}
}
Create font storage texture class
struct lib
{
lib() = default;
lib(SDL_Renderer *renderer, int height)
{
init(renderer, height);
}
void init(SDL_Renderer *renderer, int height)
{
FT_Library ft;
if (FT_Init_FreeType(&ft))
{
std::cout << "Can't init freetype lib\n";
}
FT_Face face;
//use if you have font data in array
// if (FT_New_Memory_Face(ft, font_array, std::size(font_array), 0, &face))
// {
// std::cout << "Failed to load font\n";
// }
if (FT_New_Face(ft, "location/to/my/font.ttf", 0, &face))
{
std::cout << "Failed to load font\n";
}
//set size of future glyphs
FT_Set_Pixel_Sizes(face, 0, height);
std::vector<uint32_t> image;
for (unsigned int c = 0; c < 256; ++c)
{
//load freetype glyph
if (FT_Load_Char(face, c, FT_LOAD_RENDER))
{
std::cout << "failed to load glyph\n";
}
if (face->glyph->bitmap.width)
{
///get image data that works for sdl2
convert_8_to_32_depth(image, face->glyph->bitmap.buffer, face->glyph->bitmap.width, face->glyph->bitmap.rows);
chars[c].attach_image(renderer, image.data(), face->glyph->bitmap.width, face->glyph->bitmap.rows,
32, face->glyph->bitmap.width * sizeof(decltype(image)::value_type),
rmask, gmask, bmask, amask);
}
chars[c].bearing_x = face->glyph->bitmap_left;
chars[c].bearing_y = face->glyph->bitmap_top;
chars[c].advance = face->glyph->advance.x;
}
FT_Done_Face(face);
FT_Done_FreeType(ft);
}
character chars[256];
};
Print text function
void print_text(SDL_Renderer *renderer, int x, int y, int height, std::string_view text)
{
static constexpr int default_height = 50;
//store map of each renderer used to avoid creating more libs than neccesary
static std::map<SDL_Renderer *, lib> l;
const lib& ts = l.try_emplace(renderer, renderer, default_height).first->second;
float scale = height / default_height;
SDL_Rect dest;
for (auto c : text)
{
dest.x = x + ts.chars[c].bearing_x * scale;
dest.y = y - ts.chars[c].bearing_y * scale;
dest.w = ts.chars[c].width() * scale;
dest.h = ts.chars[c].height() * scale;
ts.chars[c].draw(renderer, nullptr, &dest);
x += (ts.chars[c].advance >> 6) * scale;
}
}

Related

why is incorrect audio format?

when i start the code i get warning: incorrect audio format
i figured out its related to the mp3 file.
whats the problem and how can i fix it?
i already tried to convert the mp3 to a wav file but that also didnt work.
is it possible that 3mb of mp3 is to big? shouldnt be?
Edit: when i let it run without of mp3 the wav files will run just fine
with mp3 the programm will start but no sound at all
#include <stdio.h>
#include <stdlib.h>
#include <stdbool.h>
#include <SDL2/SDL.h>
#include <SDL2/SDL_mixer.h>
static const int width = 800;
static const int height = 600;
int main(int argc, char **argv)
{
// Initialize SDL video and audio systems
SDL_Init(SDL_INIT_VIDEO | SDL_INIT_AUDIO);
// Initialize SDL mixer
Mix_OpenAudio(44100, MIX_DEFAULT_FORMAT, 3, 2048);
// Load audio files
Mix_Music *backgroundSound = Mix_LoadMUS("portfolio.mp3");
Mix_Chunk *jumpEffect = Mix_LoadWAV("JumpEffect.wav");
Mix_Chunk *laserEffect = Mix_LoadWAV("LaserEffect.wav");
//Mix_Chunk *musicEffect = Mix_LoadWAV("portfolio2.wav");
// Create a SDL window
SDL_Window *window = SDL_CreateWindow("Hello, SDL2", SDL_WINDOWPOS_UNDEFINED, SDL_WINDOWPOS_UNDEFINED, width, height, SDL_WINDOW_OPENGL);
// Create a renderer (accelerated and in sync with the display refresh rate)
SDL_Renderer *renderer = SDL_CreateRenderer(window, -1, SDL_RENDERER_ACCELERATED | SDL_RENDERER_PRESENTVSYNC);
SDL_SetRenderDrawColor(renderer, 255, 0, 0, 255);
// Start the background music
Mix_PlayMusic(backgroundSound, -1);
bool running = true;
SDL_Event event;
while(running)
{
// Process events
while(SDL_PollEvent(&event))
{
if(event.type == SDL_QUIT)
{
running = false;
}
else if(event.type == SDL_KEYDOWN)
{
// Press "1" and play jump effect
if(event.key.keysym.sym == SDLK_1)
{
Mix_PlayChannel(-1, jumpEffect, 0);
}
// Press "2" and play laser effect
else if(event.key.keysym.sym == SDLK_2)
{
Mix_PlayChannel(-1, laserEffect, 0);
}
}
}
// Clear screen
SDL_RenderClear(renderer);
// Draw
// Show what was drawn
SDL_RenderPresent(renderer);
}
// Release resources
SDL_DestroyRenderer(renderer);
SDL_DestroyWindow(window);
Mix_FreeMusic(backgroundSound);
Mix_FreeChunk(jumpEffect);
Mix_FreeChunk(laserEffect);
//Mix_FreeChunk(music);
Mix_CloseAudio();
SDL_Quit();
return 0;
}

Sdl2 window is either transparent or rendering whats behind it on arch linux

The code looks like this:
#include"global.h"
static const int width = 800;
static const int height = 600;
int main (int argc, char **argv)
{
SDL_Init(SDL_INIT_VIDEO);
// Create the window
SDL_Window *window = SDL_CreateWindow("Ferengine",SDL_WINDOWPOS_UNDEFINED,SDL_WINDOWPOS_UNDEFINED,width,height, SDL_WINDOW_OPENGL);
// renderer
SDL_Renderer *renderer = SDL_CreateRenderer(window,-1,SDL_RENDERER_ACCELERATED | SDL_RENDERER_PRESENTVSYNC);
// settings
SDL_SetRenderDrawColor(renderer,255,0,0,255);
SDL_SetWindowOpacity(window,1.0f);
// loop
bool running = true;
SDL_Event event;
while(running)
{
while(SDL_PollEvent(&event))
{
if(event.type == SDL_QUIT)
{
running = false;
}
}
}
SDL_RenderClear(renderer);
SDL_RenderPresent(renderer);
// release resources
SDL_DestroyRenderer(renderer);
SDL_DestroyWindow(window);
SDL_Quit();
return 0;
}
global.h looks like this:
// SDL
#include <stdbool.h>
#include <SDL2/SDL.h>
#include <stdio.h>
#include <stdlib.h>
my make file looks like this
CC=gcc
S_DIR=Source
B_DIR=Build
build:
$(CC) \
-o \
$(B_DIR)/Ferengine \
$(S_DIR)/main.c \
-lSDL2
clean:
rm -f $(B_DIR)/*
file structure:
main folder
Makefile
source | build/executable
source/main.c | source/global.h
when I run make and then run the executable either the window is rendering whats behind it or it is transparent I saw another question like this but its answer did not work. I am using sdl2 version 2.0.22-2.
I read the tutorial wrong it should be
while(running)
{
while(SDL_PollEvent(&event))
{
if(event.type == SDL_QUIT)
{
running = false;
}
}
SDL_RenderClear(renderer);
SDL_RenderPresent(renderer);
}

C SDL2 write text to canvas segmentation fault

I'm trying to use C to create a webassembly program to write text to an HTML5 canvas. I'm getting a segfault.
I've been looking at this tutorial: https://lyceum-allotments.github.io/2016/06/emscripten-and-sdl2-tutorial-part-6-write-owl/
This is my main.c file:
#include <stdio.h>
#include <SDL2/SDL.h>
#include <emscripten.h>
#include <stdlib.h>
#include <math.h>
#include <SDL2/SDL_ttf.h>
/**
* A Context structure that can be used to pass variables into the loop
*/
//
struct Context {
SDL_Renderer *renderer;
int iteration;
// Rectangle that texture will be rendered into
TTF_Font *font;
SDL_Texture *text_texture;
} Context;
/**
* size of the canvas in pixels
*/
const int WINDOW_WIDTH = 1600;
const int WINDOW_HEIGHT = 420;
void set_font_text(struct Context *ctx, const char *text) {
SDL_Color fg = {0,0,0,255};
SDL_Surface *text_surface = TTF_RenderText_Blended(ctx->font, text, fg);
ctx->text_texture = SDL_CreateTextureFromSurface(ctx->renderer, text_surface);
SDL_FreeSurface(text_surface);
SDL_DestroyTexture(ctx->text_texture);
}
int get_font_texture(struct Context *ctx) {
ctx->font = TTF_OpenFont("assets/fonts/Alef-Regular.ttf", 30);
set_font_text(ctx, "NEIL DU TOIT");
TTF_CloseFont(ctx->font);
TTF_Quit();
return 1;
}
/**
* The loop handler, will be called repeatedly
*/
void mainLoop(void *arg) {
struct Context *ctx = arg;
// Set background color and clear canvas
SDL_SetRenderDrawColor(ctx->renderer, 100, 143, 154, 255);
SDL_RenderClear(ctx->renderer);
SDL_Rect text_dest = {.x = 50, .y = 175, .w = 0, .h = 0};
SDL_QueryTexture(ctx->text_texture, NULL, NULL, &text_dest.w, &text_dest.h);
SDL_RenderCopy(ctx->renderer, ctx->text_texture, NULL, &text_dest);
SDL_RenderPresent(ctx->renderer);
}
int main() {
SDL_Window *window;
struct Context ctx;
SDL_Init(SDL_INIT_VIDEO);
TTF_Init();
SDL_CreateWindowAndRenderer(WINDOW_WIDTH, WINDOW_HEIGHT, 0, &window, &ctx.renderer);
SDL_SetRenderDrawColor(ctx.renderer, 255, 143, 154, 255);
get_font_texture(&ctx);
ctx.iteration = 0;
int infinite_loop = 1;
int fps = -1;
emscripten_set_main_loop_arg(mainLoop, &ctx, fps, infinite_loop);
SDL_DestroyRenderer(ctx.renderer);
SDL_DestroyWindow(window);
SDL_Quit();
}
Comiled using:
emcc main.c -s USE_SDL=2 -s WASM=1 -s USE_SDL_TTF=2 -O3 -o main.js
and served with:
python3 -m http.server 8000
When opened I immediately see:
If I remove the call to set_font_text the error goes away (but I don't see any text of course)
What's going wrong?

OpenGL4 gl_texture_2d_array won't display

I want to get started with modern OpenGL while reading the superbible book by coding a cellular automata using a 2d-array texture of size 1280x1280x2 and computing the next state to another layer in a compute shader. The idea is impiously stolen from glumpy examples.
However, while having such ambition in mind, I got confused at even trying to display it, not even passing the samplers into shaders.
Below I included both, the generator, which works OK, and the piece of code that does contain a problem.
gen
#!/usr/bin/env perl
use strict;
use warnings;
sub get_arg {
return (scalar #ARGV == 0) ? shift : shift #ARGV;
}
my $size = get_arg 1280;
my $rate = get_arg ($size >> 1);
my $symbol = (sub { ((shift) < $rate) ? '*' : '_' } );
print "$size\n";
for (0..$size) {
print $symbol->(int(rand() * $size)) for (0..$size);
print "\n";
}
code
#include <stdio.h>
#include <stdbool.h>
#include <assert.h>
// including opengl libraries on linux/osx
//include glew
#include <GL/glew.h>
//include opengl
#if defined (__APPLE_CC__)
#include <OpenGL/gl3.h>
#else
#include <GL/gl3.h> /* assert OpenGL 3.2 core profile available. */
#endif
//include glfw3
#define GLFW_INCLUDE_GL3 /* don't drag in legacy GL headers. */
#define GLFW_NO_GLU /* don't drag in the old GLU lib - unless you must. */
#include <GLFW/glfw3.h>
// ----------- the program itself
GLFWwindow *g_window;
#define SIZE 1280
#define WIDTH SIZE
#define HEIGHT SIZE
#define DEPTH 2
init_glfw(const char *name) {
// start GL context and O/S window using the GLFW helper library
assert(glfwInit());
#if defined(__APPLE_CC__)
glfwWindowHint(GLFW_CONTEXT_VERSION_MAJOR, 3);
glfwWindowHint(GLFW_CONTEXT_VERSION_MINOR, 2);
glfwWindowHint(GLFW_OPENGL_FORWARD_COMPAT, GL_TRUE);
glfwWindowHint(GLFW_OPENGL_PROFILE, GLFW_OPENGL_CORE_PROFILE);
#endif
g_window = glfwCreateWindow(WIDTH, HEIGHT, name, NULL, NULL);
assert(g_window != NULL);
glfwMakeContextCurrent(g_window);
// start GLEW extension handler
glewExperimental = GL_TRUE;
glewInit();
// tell GL to only draw onto a pixel if the shape is closer to the viewer
glEnable(GL_DEPTH_TEST); // enable depth-testing
glDepthFunc(GL_LESS); // depth-testing interprets a smaller value as "closer"
glEnable(GL_DEBUG_OUTPUT);
glEnable(GL_BLEND);
glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);
glTexEnvi(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_MODULATE);
}
typedef enum { FILLED = '*', EMPTY = '_' } SYMBOL;
load_array(GLubyte array[SIZE * SIZE * DEPTH], FILE *stream) {
static char c;
for(int i = 0; i < SIZE; ++i) {
for(int j = 0; j < SIZE; ++j) {
bool approved = false;
GLubyte *it = &array[SIZE * i + j];
while(!approved) {
approved = true;
c = getc(stream);
assert(c != EOF);
switch(c) {
case FILLED:
*it = 0x00;
break;
case EMPTY:
*it = 0xff;
break;
default:
approved = false;
break;
}
}
assert(*it == 0x00 || *it == 0xff);
it[SIZE * SIZE] = it[0];
}
}
}
GLuint create_2d_texture() {
static GLuint texture = 0;
assert(texture == 0);
static GLubyte field[SIZE * SIZE << 1];
load_array(field, stdin);
glGenTextures(1, &texture);
glBindTexture(GL_TEXTURE_2D_ARRAY, texture);
glTexStorage3D(GL_TEXTURE_2D_ARRAY, 1, GL_ALPHA8, SIZE, SIZE, DEPTH);
glTexSubImage3D(GL_TEXTURE_2D_ARRAY, 0, 0, 0, 0, SIZE, SIZE, DEPTH, GL_ALPHA, GL_UNSIGNED_BYTE, field);
glTexParameteri(GL_TEXTURE_2D_ARRAY,GL_TEXTURE_MIN_FILTER,GL_LINEAR);
glTexParameteri(GL_TEXTURE_2D_ARRAY,GL_TEXTURE_MAG_FILTER,GL_LINEAR);
glTexParameteri(GL_TEXTURE_2D_ARRAY,GL_TEXTURE_WRAP_S,GL_CLAMP_TO_EDGE);
glTexParameteri(GL_TEXTURE_2D_ARRAY,GL_TEXTURE_WRAP_T,GL_CLAMP_TO_EDGE);
return texture;
}
display() {
GLuint texture = create_2d_texture();
assert(texture != 0);
glEnable(GL_CULL_FACE);
glCullFace(GL_FRONT_AND_BACK);
while(!glfwWindowShouldClose(g_window)) {
glClearColor(1.0, 1.0, 1.0, 1.0);
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glLoadIdentity();
glMatrixMode(GL_PROJECTION);
glActiveTexture(GL_TEXTURE0);
glBindTexture(GL_TEXTURE_2D_ARRAY, texture);
glPushMatrix();
glEnable(GL_TEXTURE_2D_ARRAY);
glBegin(GL_QUADS);
glTexCoord3s(0, SIZE, 0); glVertex3f( 0.0f, 0.0f, 0.0 );
glTexCoord3s(SIZE, SIZE, 0); glVertex3f( SIZE, 0.0f, 0.0 );
glTexCoord3s(0, SIZE, 0); glVertex3f( SIZE, SIZE, 0.0 );
glTexCoord3s(0, 0, 0); glVertex3f( 0.0f, SIZE, 0.0 );
glEnd();
glPopMatrix();
glfwSwapBuffers(g_window);
glfwPollEvents();
if(glfwGetKey(g_window, GLFW_KEY_ESCAPE)) {
glfwSetWindowShouldClose(g_window, 1);
}
}
}
main() {
init_glfw("I want to display a texture");
display();
glfwDestroyWindow(g_window);
glfwTerminate();
}
Could you help me to analyse the issues with displaying the 2d array on the screen, please? What I am trying to achieve is to make the whole window randomly black-and-white, but so far I ended up completely confused just adding more layers from googled solutions and man pages.
I am not asking for a working code, just a comprehensible explanation which would help me to get through this problem.
glEnable(GL_TEXTURE_2D_ARRAY);
That gave you an OpenGL error. Even in compatibility profiles, you cannot enable an array texture of any kind. Why?
Because you cannot used fixed-function processing with array textures at all. You cannot use glTexEnv to fetch from an array texture. They're wholly and completely shader-based constructs.
So if you want to use an array texture, you must use a shader.

SDL2 Window lacking window bar

I'm trying to build an SDL2 app on OSX El Capitan, and I am running into an issue where the window dressing is not appearing. Things like the exit button and the resizing bar are not appearing. I've compiled on Windows and it all works fine there.
To make it a bit easier this link to Lazy Foo's tutorial replicates the issue: http://lazyfoo.net/tutorials/SDL/01_hello_SDL/index2.php
My make file is pretty simple (I've stolen it off his website as well)
COMPILER_FLAGS = -w
LINKER_FLAGS = -framework SDL2
#OBJS specifies which files to compile as part of the project
OBJS = main.c
#CC specifies which compiler we're using
CC = g++
OBJ_NAME = main
#This is the target that compiles our executable
all : $(OBJS)
$(CC) $(OBJS) $(INCLUDE_PATHS) $(LIBRARY_PATHS) $(COMPILER_FLAGS) $(LINKER_FLAGS) -o $(OBJ_NAME)
If anyone knows what I am doing wrong, I'd love to find out.
UPDATE: I pulled out an old laptop, fresh installed to El Capitan and it is having the same issue based on the Lazy Foo code.
UPDATE:
/*This source code copyrighted by Lazy Foo' Productions (2004-2015)
and may not be redistributed without written permission.*/
//Using SDL and standard IO
#include <SDL.h>
#include <stdio.h>
//Screen dimension constants
const int SCREEN_WIDTH = 640;
const int SCREEN_HEIGHT = 480;
int main( int argc, char* args[] )
{
//The window we'll be rendering to
SDL_Window* window = NULL;
//The surface contained by the window
SDL_Surface* screenSurface = NULL;
//Initialize SDL
if( SDL_Init( SDL_INIT_VIDEO ) < 0 )
{
printf( "SDL could not initialize! SDL_Error: %s\n", SDL_GetError() );
}
else
{
//Create window
window = SDL_CreateWindow( "SDL Tutorial", SDL_WINDOWPOS_UNDEFINED, SDL_WINDOWPOS_UNDEFINED, SCREEN_WIDTH, SCREEN_HEIGHT, SDL_WINDOW_SHOWN );
if( window == NULL )
{
printf( "Window could not be created! SDL_Error: %s\n", SDL_GetError() );
}
else
{
//Get window surface
screenSurface = SDL_GetWindowSurface( window );
//Fill the surface white
SDL_FillRect( screenSurface, NULL, SDL_MapRGB( screenSurface->format, 0xFF, 0xFF, 0xFF ) );
//Update the surface
SDL_UpdateWindowSurface( window );
//Wait two seconds
SDL_Delay( 2000 );
}
}
//Destroy window
SDL_DestroyWindow( window );
//Quit SDL subsystems
SDL_Quit();
return 0;
}
Not sure of the root cause but making a loop that polls events seems to do the trick.
bool loop = true;
while(loop)
{
SDL_Event event;
while(SDL_PollEvent(&event))
{
if(event.type == SDL_QUIT)
{
loop = false;
}
}
}

Resources