< Browse > Home / All, Code / Blog article: Creating GUI with SDL

| Mobile | RSS

Creating GUI with SDL

December 30th, 2008 | 2 Comments | Posted in All, Code

To create a GUI with the SDL, the first time have to do the settings for Microsoft Visual Studio such as this description.
Examples of ‘GUI.h’ in the program:

#include "SDL/GUI.h"

int main(int argc, char* args[])
{
bool quit = false;      //variable quit

This code will make a window with 256 x 192 size, window initialisation

if(init(256, 192,"Dev Window") == false)
{
return 1;
}

Making Object

Label inputLbl(30, 20, "Input :");

TextBox txtInput (140, 20, 100, 26, "");
Label outputLbl(30, 60, "Output :");
Label resultLbl(140, 60, "");
Button showBtn (140, 100, 100, 26, 170, 101, "Show");
Button quitBtn (140, 140, 100, 26, 173, 141, "Quit");

This is main loop for SDL program

while(!quit)
{
clearWindow();                        //to refresh SDL buffer
if(SDL_PollEvent(&event))   //save all event on keyboard and mouse
{
showBtn.handle_events();              //updated object as event
quitBtn.handle_events();
txtInput.handle_events();
if(showBtn.isClicked())               //handled event for button
{
resultLbl.setText(txtInput.getText());
}


if(quitBtn.isClicked())
{
quit = true;
}


if (event.type == SDL_QUIT) //handled evet if closed button clicked
{
quit = true;
}
}


inputLbl.show();
outputLbl.show();
resultLbl.show();
txtInput.show();
showBtn.show();
quitBtn.show();


if(SDL_Flip(screen) == -1)        //show SDL buffer on window
{
return 1;
}
}

clean_up();     //cleaning memory from SDL buffer
return 0;
}

The program will produce the above output as follows :

Leave a Reply 7905 views, 6 so far today |
Tags: ,

You must read this :

Follow Discussion

2 Responses to “Creating GUI with SDL”

  1. AnnaHopn Says:

    Hi,
    Ugh, I liked!

    Thank you
    AnnaHopn

  2. US Education Says:

    Dazzling article . Will definitely copy it to my blog.Thanks.

Leave a Reply

sawajiri-erika-00071236sawajiri-erika-00071238sawajiri-erika-00071226sawajiri-erika-00071248sawajiri-erika-00071225sawajiri-erika-000712351969454_1156852473