Thursday, November 24, 2011

2D C++ Game: Part 6 - Image Background Transparency, Game FPS, Events, Game Loop

0 comments
// Allegro library
#include <allegro5/allegro.h>
#include <allegro5/allegro_image.h>

//Screen resolution
#define SCREEN_W 640
#define SCREEN_H 480

// Game fps
#define FPS 60

int main()
{
    al_init(); // Start Allegro
    ALLEGRO_DISPLAY *screen = NULL; // Main display
    ALLEGRO_EVENT_QUEUE *event_queue = NULL; // Event queue to maintain events
    ALLEGRO_TIMER *timer = NULL; // Timer to control game fps

    // Initializing screen, event queue and timer
    screen = al_create_display(SCREEN_W, SCREEN_H);
    event_queue = al_create_event_queue();
    timer = al_create_timer(1.0/FPS); // Timer set to tick at 60 frames per second

    // Register event sources to be handled in the event queue
    al_register_event_source(event_queue,al_get_display_event_source(screen));
    al_register_event_source(event_queue,al_get_timer_event_source(timer));

    al_init_image_addon(); // Initialize Allegro image addon
    al_start_timer(timer); // Start timer

    // ALLEGRO BITMAP 'image' to hold the image
    ALLEGRO_BITMAP *image = NULL;
    // Load bitmap
    image = al_load_bitmap("Pacman_Sprite.png");
    // Convert image background to transparent
    al_convert_mask_to_alpha(image,al_map_rgb(255, 0, 255));



    int x=0; // x coordinate of the image

    while(1) //Game Loop
    {
        ALLEGRO_EVENT event; // ALLEGRO_EVENT to hold events
        al_wait_for_event(event_queue,&event); // Wait for events to occur

        // Display handler
        // Draw if timer counter has incremented and there are no events to handle
        // and event queue is empty
        if(event.type == ALLEGRO_EVENT_TIMER && al_is_event_queue_empty(event_queue))
        {
            al_draw_bitmap(image, x, SCREEN_H/2, 0); // Draw image on the backbuffer
            al_flip_display(); // Display backbuffer on to the main screen
            al_clear_to_color(al_map_rgb(0, 0, 0)); // Clear display to black
        }

        //Event handlers
        if (event.type == ALLEGRO_EVENT_TIMER)
        {
            // Increment x coordinate of the image
            // When position of the image is more than the screen width, reset x coordinate to 0
            if(++x>=SCREEN_W)x=0;
        }else if(event.type==ALLEGRO_EVENT_DISPLAY_CLOSE)
        {
            break; // End game loop on closing display window
        }


    }// End of Game Loop

    al_destroy_display(screen); // Destroy display
    return 0;
}
Explanation:
▪ Image Background Transparency
    // ALLEGRO BITMAP 'image' to hold the image
    ALLEGRO_BITMAP *image = NULL;
    // Load bitmap
    image = al_load_bitmap("Pacman_Sprite.png");
    // Convert image background to transparent
    al_convert_mask_to_alpha(image,al_map_rgb(255, 0, 255));
Image background transparency is achieved with the Allegro routine al_convert_mask_to_alpha(ALLEGRO_BITMAP *bitmap, ALLEGRO_COLOR mask_color) which takes 2 parameters:
 ALLEGRO_BITMAP structure which holds our image.
 ALLEGRO_COLOR structure, in our case we gave al_map_rgb(255, 0, 255) which is the rgb value for magenta, which is the background color of our image.
▪ Game FPS
// Game fps
#define FPS 60
ALLEGRO_TIMER *timer = NULL; // Timer to control game fps
timer = al_create_timer(1.0/FPS); // Timer set to tick at 60 frames per second
al_register_event_source(event_queue,al_get_timer_event_source(timer));
al_start_timer(timer); // Start timer

Sunday, November 6, 2011

2D C++ Game: Part 5 - Drawing Graphics From Image File

0 comments
In this part, we will be displaying this image on the screen using allegro_image functions/routines.
house.png
Objective: Load and display image file.
#include <allegro5/allegro.h>
#include <allegro5/allegro_image.h>

#define SCREEN_W 640
#define SCREEN_H 480
int main()
{
    al_init();
    ALLEGRO_DISPLAY *screen = NULL;
    screen = al_create_display(SCREEN_W, SCREEN_H);

    al_init_image_addon();
    ALLEGRO_BITMAP *image= NULL;
    image = al_load_bitmap("house.png");
    al_draw_bitmap(image, SCREEN_W/2, SCREEN_H/2, 0);
    al_flip_display();

    al_rest(5.0);
    al_destroy_display(screen);
    return 0;
}

Explanation:
▪ al_init_image_addon();
Before we start, we need to initialize the image addon first before using any other image related funcitons or routines.

▪ ALLEGRO_BITMAP *image = NULL;
Then we create a pointer 'image' to ALLEGRO_BITMAP structure which will hold our image.

▪ image = al_load_bitmap("house.png");
Then we use al_load_bitmap(const char *filename) function to load the image from a specified path to our ALEGRO_BITMAP structure we created.

▪ al_draw_bitmap(image, SCREEN_W/2, SCREEN_H/2, 0);
Then we draw the image on to the back buffer using al_draw_bitmap(ALLEGRO_BITMAP *bitmap, float dx, float dy, int flags) routine which takes 3 parameters as follows:
 ALLEGRO_BITMAP structure which holds our image.
 X coordinate of the image to be drawn on the screen.
 Y coordinate of the image to be drawn on the screen.
 The flags parameter can be 0 or one of the following flags:
ALLEGRO_FLIP_HORIZONTAL - flip the bitmap about the y-axis.
ALLEGRO_FLIP_VERTICAL - flip the bitmap about the x-axis.

The picture below explains, how the image is displayed on the screen as per our specified parameters.


Saturday, November 5, 2011

2D C++ Game: Part 4 - Draw Text Using Fonts

0 comments
Inorder to use font functions in Allegro we need to include two more additional libraries i.e allegro_font.h and allegro_ttf.h along with allegro.h which is the core library. I have used arial.ttf font file for this program, you can use any other font file of your own choice. Make sure you copy the font file to the project directory or if it is in any other location, then input the proper path of the file while loading the font file in the program.

Objective: Display 'Hello World' on the screen using fonts.
#include <allegro5/allegro.h>
#include <allegro5/allegro_font.h>
#include <allegro5/allegro_ttf.h>

#define SCREEN_W 640
#define SCREEN_H 480
int main()
{
    al_init();
    ALLEGRO_DISPLAY *screen = NULL;
    screen = al_create_display(SCREEN_W, SCREEN_H);

    al_init_font_addon();
    al_init_ttf_addon();

    ALLEGRO_FONT *font = NULL;
    font=al_load_ttf_font("arial.ttf", 15, 0);
    al_draw_text(font, al_map_rgb(255,255,255), SCREEN_W/2, SCREEN_H/2, ALLEGRO_ALIGN_CENTRE, "Hello World");
    al_flip_display();

    al_rest(3.0);
    al_destroy_display(screen);
}
Explanation:
al_init_font_addon();al_init_ttf_addon();
To use these font functions, we will need to initialize the font addon by using al_init_font_addon. Along with that we will need to initialize ttf addon as well because we will be using al_load_ttf_font() function later in the program which needs ttf addon.

▪ ALLEGRO_FONT *font;
We declare a ALLEGRO_FONT structure which will hold our font and intialize it to NULL.

▪ font=al_load_ttf_font("arial.ttf", 15, 0);
Then we need to load the font using al_load_ttf_font(char const *filename, int size, int flags) function which takes three parameters i.e font file path, size of the font to be displayed and flags which you can leave it to 0. This function returns ALLEGRO_FONT structure, which we will use to initialize our pointer we had declared.

▪ al_draw_text(font, al_map_rgb(255,255,255), SCREEN_W/2, SCREEN_H/2, ALLEGRO_ALIGN_CENTRE, "Hello World");
Then we will use al_draw_text(const ALLEGRO_FONT *font, ALLEGRO_COLOR color, float x, float y, int flags, char const *text) function to draw desired text on the back buffer using our specified font. This function takes 6 parameters as follows:
 ALLEGRO_FONT structure which holds our font.
 ALLEGRO_COLOR structure to specify the colour of the text, for which we will use al_map_rgb(r,g,b) as parameter.
 X coordinate of the text to be drawn on the screen.
 Y coordinate of the text to be drawn on the screen.
 The flags parameter can be 0 or one of the following flags:
ALLEGRO_ALIGN_LEFT - Draw the text left-aligned (same as 0).
ALLEGRO_ALIGN_CENTRE - Draw the text centered around the given position.
ALLEGRO_ALIGN_RIGHT - Draw the text right-aligned to the given position.
 Input the text to be drawn on the screen.

Output:

Sunday, October 30, 2011

2D C++ Game: Part 3 - Getting Started

0 comments
So, by now everything must be in place and working. Let's start, with a very basic program to check if Allegro is working properly.

Objective: Initialize a window and fill it with colour.
#include <allegro5/allegro.h>

#define SCREEN_W 640
#define SCREEN_H 480
int main()
{
    al_init();
    ALLEGRO_DISPLAY *screen = NULL;
    screen=al_create_display(SCREEN_W, SCREEN_H);
    al_clear_to_color(al_map_rgb(0,0,255));
    al_flip_display();

    al_rest(5.0);
    al_destroy_display(screen);
    return 0;
}
Explanation:
#include <allegro5/allegro.h>
This is the core library of Allegro, which is required to use the Allegro functions. Just the way we include library files like iostream.h or stdio.h inorder to use cout or printf function.

▪ #define SCREEN_W 640
Then we define a constant screen width and assign value 640.
▪ #define SCREEN_H 480
Then we define a constant screen height and assign value 480, both are later used in the program.

al_init();
This is to initialize the Allegro system and has be to initialized before using any other Allegro function.

ALLEGRO_DISPLAY *screen = NULL;
Here we declare a pointer 'screen' which will be our window/display and then initialize it to NULL.

display = al_create_display(SCREEN_W, SCREEN H);
Then we initialize screen with specified dimensions which we had defined in the very beginning of our program i.e 640, 480. For this, we use al_create_display(int width, int height), which returns NULL if an error has occured.

al_clear_to_color(al_map_rgb(0,0,255));
Then we clear the display to a specific colour using al_clear_to_color(ALLEGRO_COLOR color), An ALLEGRO_COLOR structure describes a color in a device. So, we need ALLEGRO_COLOR structure as parameter, for which we use al_map_rgb(unsigned char r, unsigned char g, unsigned char b) which takes three arguments, the value for the red, green, and blue components of the color ranging from 0-255 respectively, and will return a ALLEGRO_COLOR structure.

al_flip_display();
In Allegro, there are two image buffers, one is the front buffer and another is back buffer. Front buffer is the one displayed currently on the screen and back buffer is the one being drawn in the code. Once we are done drawing on the back buffer, we have to call al_flip_display() which updates the back buffer to the front buffer. This is done inorder to prevent the flickering effect that is caused due to drawing directly on to the front buffer, this technique in computer graphics terminology is called as double buffering.

al_rest(5.0);
Then we used al_rest(double seconds) to pause the system for 5 seconds, orelse the program would execute the next line of the code and window will close before you can even see it.

al_destroy_display(screen);
This should be always called at the end of the program to destroy our window and to free up the memory.

return 0;
Finally, we return 0 to the main function signifying the successful execution of the program.

Output:

Thursday, October 27, 2011

2D C++ Game: Part 2 - Prerequisites

0 comments
Note: If you are not interested to read any of this and want to get straight to the prerequisites then please scroll down the post.

» Application Programming Interface ( API ):

▪ What is API ?
In simple words, API is a interface used by programmers to communicate with the hardware. In game programming, we will be needing some way to of draw graphics on to the monitor via graphics card and play music/sound to our speaker via sound card, that is where API will come into the action.

▪ What APIs are there ?
DirectX and OpenGL are two APIs widely used when it comes to game programming.

DirectX is developed by Microsoft and made to run only on Windows platforms, whereas on the contrary OpenGL(Open Graphics Library) is developed by Khronos Group and is cross platform i.e it can run on various platforms. DirectX takes care of both graphics and audio where as OpenGL is solely for graphics and lacks audio, but not to worry there are other APIs which can be used alongside, like OpenAL (Open Audio Library) made by Creative Technology which can be used along with OpenGL. Anyways, I don't want to run into details about each API as its a very vast topic. For detailed explanation there is always Wikipedia. I have enclosed a link, in case you would want a comparison between both DirectX vs OpenGL.

While browsing through various forums, I found out that for years there have been heated arguments when its comes to topics like DirectX vs OpenGL, both have their own fanbase. Deciding which one to use becomes a big headache for the people who are new into game programming. Anyways, I am not going to use any API directly instead I will be using a multimedia library/game programming library.

» Multimedia Library/Game Programming Library:

▪ What is Library ?
Library is a collection of resources which may include various pre-written subroutines or classes, values etc to carry out specific tasks.

In simpler words, imagine it as a multivitamin capsule. Consider each vitamin packed inside it as subroutine or class which carries out specific task. I know it sounds lame.

▪ Which Game Programming Library to use ?
As by now you must be able to guess what Multimedia Library means. Its a library solely made to handle operations related to multimedia such a graphics, audio, input etc. Library acts a wrapper for various APIs. Using APIs directly can be a very tedious task, which can create complications for the people who are new to game programming.

Using library simplifies the task and prevents a lot of  headache, for instance if you want to create a window and draw a line, all you do is call a function to initialize a window and call xyz function to draw line and pass xy parameters and you are done.

Once again when its comes to choosing which game library to use, is debatable. Everyone will suggest with which they are comfortable. Anyways, there are loads of game libraries out there, some using DirectX or OpenGL and even both. I suggest you to choose a library which suits your project needs and is well documented and has a healthy active community which in long run, will help you in your learning process. There is nothing so called best gaming library. Everything has its pros and cons, ultimately it depends on your requirements and how well you utilize the resources.

▪ Damn, just tell me already what game library are you going to use ?
I am going to use Allegro (Atari Low LEvel Game ROutine) Library. Allegro is a cross-platform, Open source library mainly aimed at video game and multimedia programming. It is capable of  handling common, low-level tasks such as creating windows, accepting user input, loading data, drawing images, playing sounds, etc. and generally abstracting away the underlying platform. However, Allegro is not a game engine: you are free to design and structure your program as you like.

Allegro 5.0 supports the following platforms:
■ Unix/Linux
■ Windows
■ MacOS X
■ iPhone


▪ 
Why Allegro ?
It is just  my personal choice, as I said before choose a game library that has proper documentation and has a healthy community. You can google 'game library', there are loads of other game libraries as well.

▪ Why use Allegro game library, why not make our own ?
Allegro takes care of all the low level tasks like I mentioned before , making a library from scratch to handle these can become very tedious. The whole point is why not use something that has been refined since years. I chose to use game library because I want to put all my focus on building game mechanics.

» Which C++ compiler to use ?
This is completely based on your personal choice but I would recommend you to use Microsoft Visual Studio or Code::Blocks because Allegrowiki has step by step installation guide of these two IDE's, so better to get started right away, instead of wasting time figuring out how to install. I have used Visual Studio and Dev C++ in the past so, I will be trying Code::Blocks this time.
(NoteIDE stands for Integrated Development Environment)


▪ 
Installation Guide:
This tutorials shows you how to install different IDEs and compilers.

Windows
■ Windows, Visual Studio 2008 and Allegro 5
■ Windows, Visual Studio 2010 and Allegro 5
■ Windows Vista, Code::Blocks 10.05 and Allegro 5

Mac OS
■ OSX, Xcode 3, Framework
■ OSX, Xcode 4, Framework

Linux/SVN
■ Fedora and Allegro 5
■ Ubuntu and Allegro 5
■ Debian and Allegro 5

----------------------------------------------------------------------------------------------------------------------------------

List of prerequisites:
Finally, its about time. Let's sum it up and get started.

» C++ : You need to have a working knowledge on basics of C++ and object oriented programming.
» C++ IDE : Code::Blocks
» C++ Compiler : MinGW
» Game library : Allegro
» Graphics editor : Microsoft Paint, GIMP

2D C++ Game: Part 1 - Introduction

0 comments
I have always been a video game enthusiast since my childhood. My first gaming console I owned was 'NES' (Nintendo Entertainment System) which came with a complementary cartridge 'Super Mario Bros' (which I could never complete), I was just simply hooked to it.

Even though technology and gaming industry has steeped up vastly, I still love those 8-bit console games which I used to play in my childhood days, not only because it makes me nostalgic, its the effort, the developers must have put to make these games, considering the fact that in old times technology was still in its juvenile stage. This fascinates me.

I still remember being hooked for hours to 2D DOS games such as Paratroopers, Dangerous Dave, Keen Commander, Crystal Cave, Bio Menace and so on. Over the years the word 'Gaming' has undergone a paradigm shift, now we see awesome sound effects, high definition graphics and so on.

Why game development ?
For 2 reasons, first its a platform where you can bring your thoughts into reality. As a video game lover, I always wanted to make my own games but lacked the proper knowledge (Yes, I am damn lazy). Second, it will help you to improvise your coding skills because game programming is pretty much code intensive and you will get to apply all aspects of programming that you have learned, at some point of time while working on your game.

Anyways, now as I have got a lot of spare time lying around and my brain is rusting, so I thought of putting my mind into doing something productive rather than being sluggish. I have decided to, attempt to make 2D game(s), not sure about the genre though it may be a Side scroller, Role playing game or anything because I have not planned anything yet. Once I am comfortable with the aspects of game programming and stuff, I will plan accordingly as the time progresses. For now I just want things to go with the flow in my learning process. That's all for now, Ciao.

2D C++ Game Development

0 comments