Your first SFML game, Part IV: The main loop

We already had a main loop for our game, but it didn’t to anything:D.
Here we’ll modify it to make it work with our board and our userInterface.

We keep the usual SFML headers, and we add our custom classes:

////////////////////////////////////////////////////////////
// main.cpp
////////////////////////////////////////////////////////////
#include <SFML/Graphics.hpp>
#include "board.h"
#include "uInterface.h"

We create the window and we add a frame rate limit. By The Way if you don’t want to use anti aliasing replace the appropriate lines of code :

int main()
{
    // Create the main window, using the best available resolution
    //sf::RenderWindow App(sf::VideoMode::GetMode(0),
    //        "Your first SFML game: 4 in a row!");

    // If you want antialiasing in your game, you can use these
    // lines of code instead of the above ones:

    unsigned int antialias = 8;
    sf:: RenderWindow App(sf::VideoMode::GetMode(0),
            "Your first SFML game: 4 in a row!",
            sf::Style::Resize|sf::Style::Close,
            sf::WindowSettings::WindowSettings ( 24, 8, antialias));

    // Reduce CPU usage by limiting the times a frame
    // is drawn per second
    App.SetFramerateLimit(30);

Just before the game loop (main loop) we create our board and our userInterface :

    // Create a 4 in a row board
    Board board(App);

    // Create the user interface
    UInterface ui(board);

We start the main loop as usual:

     // This is the main loop
    // It will loop until you exit the program
    while (App.IsOpened())
    {
        // Here we process the events list
        sf::Event Event;
        while (App.GetEvent(Event))
        {
            // Close window : exit
            if (Event.Type == sf::Event::Closed)
                App.Close();

We add an event catcher: when the user left clicks the screen, we place a token in a column:

            else if (Event.Type == Event.MouseButtonReleased && Event.MouseButton.Button == sf::Mouse::Left)
                ui.placeInColumn(App.GetInput());
        }

We clear the screen with the board’s background colour:

        // Clear the screen with a color
        App.Clear(board.boardColor);

We draw, the board (the circles) in the frame buffer:

        // Here you will draw all stuff in the frame buffer
        // Draw the board
        board.draw();

And we display the buffer on screen!!

        // Render the frame on screen
        App.Display();
    }

    return EXIT_SUCCESS;
}

We now have a fully working SFML game. As you see, it is very easy to do. Most of the code is used to create the board array, to find if a player has won and to define how the circles are shown on screen.

There’s lot of space for improvements. Why don’t you try showing a transparent token when hovering the mouse over a column. This way we’d know who’s next turn. Or why don’t you add some text to show who has won the match? I leave all these improvements to you. If you want some help, try posting a comment here or going to the SFML forums.
May the force be with you…^^
PS: I might be adding network support. You’d be able to match your friend in the other side of the world!! ;)
Keep tuned.:)

About these ads

3 comments on “Your first SFML game, Part IV: The main loop

  1. I loved the tutorial and hope to see more but I just have one question when using images how do u seperatethem into classes, I mean you need to create a pointer of it but do u need to delete it or free it like in sdl

    sorry if that sounds stupid thanks for the tutorials

    • Hi Luke, I’m glad you liked the tutorial.
      To show an image onscreen you should first load it into an object:

      if (!myImage.LoadFromFile("myImageFile.png"))
      {
          // There was an error when loading the file.
      }
      

      Then, the real object you’re showing onscreen is called a sprite, so create one and link it with your image :

      sf::Sprite mySprite;
      mySprite.SetImage(myImage);
      

      Finally draw it in your App :

      App.Draw(mySprite);
      

      This is the most straightfoward an easy way of showing images. There are other ways of doing this, you can find them in this tutorial.

  2. Pingback: 2010 in review « Redkiing's Blog

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s