Tutorial:

Installation, configuration
and use of SDL2
on CodeBlocks
F.Belabdelli
[email protected]
 Step 1: Installing CodeBlocks
Download (if you haven't already) the latest version
from CodeBlocks with the MinGW compiler:
http://www.codeblocks.org/downloads/binaries/

Double-click on
CodeBlocks will be installed in the
following file:
C:\Program Files\CodeBlocks
https://zestedesavoir.com/tutorials/461/use-a-
library-under-windows-with-mingw-or-code-
blocks-in-language-c/
2
Step 2-1: Installation of SDL2

Download SDL2 from the official website:

https://github.com/libsdl-org/SDL/releases/tag/release-2.26.3

Choose: SDL2-devel-2.26.3-mingw.zip
Move this archive to a folder like:
C:/Dev23/
Unzip the archive. You will get:
C:\dev23\SDL2-2.26.3
x86_64-w64-mingw32: 64-bit machine
i686-w64-mingw32: 32-bit machine

3
Step 2-2: Installing SDL2

In a console window 'cmd', type gcc -v to find out the

SDL2 version to use.

4
Step 3-1: Creating a Console Application Project

Launch Code::Blocks and create a new project of type

console Application

Then choose the C extension:

5
Step 3-2: Creating a Console Application Project

Donner un nom au projet

Choose a location for the project.

Cliquer sur « Next » ensuite « Finish »

6
Step 4-1: CodeBlocks Configuration

Choose the MinGW containing the GCC compiler.

In the menu, choose 'Settings' then 'Compiler'
Select the 'Toolchain executables' tab
Select the MinGW folder which is in the
Installation file for CodeBlocks

7
Step 4-2: Configuration of CodeBlocks

Indicate the 'include' files

Select the 'Search directories' tab
Then the 'Compile' tab
Press the 'Add' button to
specify the path of the *.h files
necessary for the compilation
If you have followed the steps
previous, you need to choose the folder:

C:\dev23\SDL2-2.26.3\x86_64-w64-mingw32\include

8
Step 4-3: Configuration of CodeBlocks

Indicate the 'lib' files

Select the 'Search directories' tab
Then the 'Linker' tab
Press the "Add" button
to specify the SDL2 libraries
If you have followed the steps
previous ones, you must choose
the file:

C:\dev23\SDL2-2.26.3\x86_64-w64-mingw32\lib

9
 Step 4-4: Configuration of CodeBlocks

Indicate the link libraries:

Select the 'Linker settings' tab
Press the 'Add' button
to add the SDL2 libraries
Add the following 2 libraries:

libSDL2main.a
libSDL2.dll.a

Enter the following options in the 'Other linker options' section

-lmingw32 -lSDL2main -lSDL2

10
Step 4-6: CodeBlocks Configuration

Add the SDL2.dll file

Go to the folder: C:\dev23\SDL2-2.26.3\x86_64-w64-mingw32\bin
Copy the SDL2.dll file
Go to the project folder (where you created the project).
Copy SDL2.dll (it is at the same level as 'testSDL2.cbp')

11
 Etape 5 : Tester un programme SDL2
#include <stdlib.h> if( pWindow )
#include <stdio.h> {
#include <SDL2/SDL.h> SDL_Delay(3000); /* Wait three seconds, that
int main(int argc, char** argv) the user sees the window */
{ SDL_DestroyWindow(pWindow);
Simple initialization }
if (SDL_Init(SDL_INIT_VIDEO) != 0 ) else
{ {
Failed to initialize SDL fprintf(stderr, "Error creating the window: ")
(%s) ",SDL_GetError()); %s
return -1; }
} SDL_Quit();
/* Creation of the window */ return 0;
SDL_Window* pWindow = NULL; }
pWindow = SDL_CreateWindow("My first application"
SDL2, SDL_WINDOWPOS_UNDEFINED
SDL_WINDOWPOS_UNDEFINED, 640, 480,
SDL_WINDOW_SHOWN);

12
First window

13
Introduction to SDL2

SDL - Simple DirectMedia Layer - is a library

multimedia
It allows you to create 2D video games in C, C++, python...
It allows to:
display windows
display images
to manage the keyboard
to play sound
It is multi-platform, has about 600 functions

https://zestedesavoir.com/tutoriels/pdf/1014/utiliser-la-sdl-en-langage-c.pdf

14
Initialize SDL2

https://wiki.libsdl.org/SDL2/SDL_Init
SDL_Init(SDL_INIT_VIDEO | SDL_INIT_AUDIO);

Flags Description
SDL_INIT_VIDEO Initialize the rendering management system
SDL_INIT_JOYSTICK Initialize the joystick management system
SDL_INIT_GAMECONTROLLER
Initialize the game controller management system
SDL_INIT_EVENTS Initialize the event management system
SDL_INIT_EVERYTHING Allows everything to be initialized

SDL_INIT_TIMER Initialize the time management system

SDL_INIT_AUDIO Initialize the audio management system

15
Create a window

https://wiki.libsdl.org/SDL2/SDL_CreateWindow
SDL_CreateWindow("My first SDL2 application",
SDL_WINDOWPOS_UNDEFINED,
SDL_WINDOWPOS_UNDEFINED,
640
480
SDL_WINDOW_SHOWN);

Flags Description
SDL_WINDOW_FULLSCREEN Create a full-screen window
SDL_WINDOW_FULLSCREEN_DESKTOP creates a full-screen window at the desktop resolution
SDL_WINDOW_SHOWN Create a visible window
SDL_WINDOW_HIDDEN Create a non-visible window
SDL_WINDOW_BORDERLESS Create a borderless window
SDL_WINDOW_RESIZABLE Create a resizable window
SDL_WINDOW_MINIMIZED Create a minimized window
SDL_WINDOW_MAXIMIZED Create a maximized window
16
Draw in the window

https://wiki.libsdl.org/SDL2/SDL_CreateRenderer
You must use a render (SDL_Renderer) to draw in a
window

Flags Description
SDL_RENDERER_SOFTWARE The renderer is software, the rendering will be done by the CPU and the
data will be stored in RAM.
SDL_RENDERER_ACCELERATEDThe renderer uses hardware acceleration. The data is in
video memory, faster than RAM.
SDL_RENDERER_PRESENTVSYNC
The update of the rendering window is synchronized with the frequency
of screen refresh.

17
 Basic drawing elements: the point and the rectangle
https://wiki.libsdl.org/SDL2/SDL_Rect
(0,0)

18
Draw a rectangle

Declare and initialize a rectangle

SDL_Rectrect ={20,30,100,200};// x, y, largeur, hauteur
Choose a drawing color, here white.
SDL_SetRenderDrawColor(pRenderer, 255, 255, 255, 255);
Clear the screen (therefore draw the background with the chosen color)
SDL_RenderClear(pRenderer);
Change the drawing color (here blue)
SDL_SetRenderDrawColor(pRenderer, 0, 0, 255, 255);
Draw the outline of the rectangle
SDL_RenderDrawRect(pRenderer, &rect);
Update the rendering
SDL_RenderPresent(pRenderer);

19
Some useful functions on Rectangles

https://wiki.libsdl.org/SDL2/CategoryRect
Check if 2 rectangles have an intersection:
SDL_bool SDL_HasIntersection(const SDL_Rect* A, const SDL_Rect* B)
Check if 2 rectangles have an intersection and give the intersection rectangle.
SDL_bool SDL_IntersectRect(const SDL_Rect* A, const SDL_Rect* B, SDL_Rect* result)
Check if a point is inside a rectangle:
SDL_bool SDL_PointInRect(const SDL_Point* p, const SDL_Rect* r)
Draw a rectangle:
int SDL_RenderDrawRect(SDL_Renderer* renderer, const SDL_Rect* rect)

20
Load a background image

Load a bmp image

SDL_Surface* image = SDL_LoadBMP("tigre.bmp");
SDL_Texture* pTextureImage =
SDL_CreateTextureFromSurface(pRenderer, image);
SDL_FreeSurface(image);
SDL_SetRenderDrawColor(pRenderer, 0, 0, 0, 255);
SDL_RenderClear(pRenderer);

SDL_RenderCopy(pRenderer, pTextureImage, NULL, NULL); //

Display my texture on the whole screen

SDL_RenderPresent(pRenderer);

21
Display an image

SDL_Rect src = {0, 0, 0, 0};

SDL_Rect dst = { 0, 0, 400, 300 };
SDL_QueryTexture(pTextureImage, NULL, NULL, &src.w,
&src.h);

22