Allegro Tutorial Series–Part 1: Getting Started

Welcome to part one in our tutorial series covering Allegro, an open source C game library/media framework.  For a bit more of an overview and a video version of this tutorial be sure to check out this video.  In this tutorial series, we are going to cover the basics of getting started with Allegro, from creating your basic app, to drawing graphics and playing audio.

In this part, we are going to illustrate creating a project using Visual Studio 2017.  Allegro is also available on Linux and Mac, but we are not going to cover the getting started process on these platforms.  All of the code in subsequent tutorials will be applicable for all platforms.

Allegro supports NuGet, which makes setting up a new project in Visual Studio incredibly easy.  Let’s start off by creating a Hello World example.  Let’s get started.

Start off by creating a new Windows application in Visual Studio.  Select File->New->Project…

image

Next select Visual C++, then Windows Console Application, name it and give it a location, then hit the OK button.

image

In the Solution Explorer, for your newly created project, right click References and select Manage NuGet Packages…

image

Next click Browse, enter Allegro in the text field, then click the download icon.  Click OK if prompted with an additional dialog.

image

And done!  You have now configured Allegro for use.  In this example however, we are going to need two additional libraries.  Allegro is modular in nature and you only enable the functionality you need.  Our application is going to display Hello World on screen and this is going to require a pair of libraries for text and font support.  Don’t worry, it’s easy.

In the Solution Explorer, select your project, like so:

image

Now either right click and select Properties or press Alt + Enter.  This will bring up the Properties Window for your project.  On the left hand side, located and select Allegro 5, then locate and enable Truetype Font Addon and Font Addon, like so:

image

Click Apply then Ok to close the dialog.  We are now ready to code.

You should have a file created for you with the same name as your project, in my case it’s HelloWorld.cpp.  Double click it in the Project Explorer window and replace it with the following code:

#include "stdafx.h"
#include <allegro5/allegro.h>
#include <allegro5/allegro_ttf.h>
#include <allegro5/allegro_font.h>

int main()
{
    al_init();
    al_init_font_addon();
    al_init_ttf_addon();

    ALLEGRO_DISPLAY * display = al_create_display(640, 480);
    ALLEGRO_FONT * font = al_load_ttf_font("YARDSALE.ttf", 64, 0);

    while (true) {
        al_clear_to_color(al_map_rgb(255, 255, 255));
        al_draw_text(font, al_map_rgb(0, 0, 0), 0, 0, 0, "Hello World");
        al_flip_display();
    }
}

This code follows a pretty common pattern in Allegro.  We always start off by initializing the Allegro libraries with a call to al_init().  You will notice in this example we also need to init the two addons we included.  This is true for all addons use in Allegro as you will see shortly.

This code then creates a window 640×480 in size, loads a font named YARDSALE.ttf with a size of 64pt.  Next, we run an infinite loop clearing the background to white ( in RBG format, each number from 0 – 255 is the amount of that could, Red, Green and Blue respectively ).  We then draw the text using our font and this time the color black.  All this time we have been drawing to an offscreen buffer.  Call al_flip_display() to make this offscreen buffer visible to the user.

There are a few things to note about this example… first, it can’t be exited.  Don’t worry, we will cover that in a future tutorial.  It also leaks resources like a sieve.  Each load, create or init call has a corresponding call to free those resources up when we are done with them.  We will also cover this in a future tutorial.

The final thing you might notice is we used a font called YARDSALE.ttf…  guess we need that font don’t we?  That font is available for download here, simply download the zip file and copy the file YARDSALE.ttf.  Of course, if you have your own TTF file, you can feel free to use it, just be sure to change the file name in the code.  Now the question remains… where do you copy it?  This is actually an area that Visual Studio C++ developers often get tripped up… I certainly do.  You want this file to be copied into the Working Directory of your application.  You can determine or set this directory in the Properties panel of your project.

image

Copy the TTF file to this location.

Now you can run your code by hitting F5 or clicking Local Windows Debugger in the toolbar.  If everything went according to plan, you should see:

image

Congratulations, you’ve just created your first Allegro application!  One thing you might notice is a DOS window in the background, like so:

image

Don’t worry, getting rid of this window is pretty simple.  Once again, open up the Properties window of your project.  Now locate Linker->System on the left hand side.  Select SubSystem, then Windows instead of Console.

image

Voila, no more console window!  One other thing you may notice… due to the fact this application is an infinite loop, it never actually shuts down and you can’t close it using the X icon.  For now, you can exit the application in Visual Studio using this button:

image

Or by hitting Shift F5.  Well, that’s it for Part One, congratulations, you’ve created your very first Allegro application.  Next, we will look a bit closer at our game loop and making exiting our game a lot easier.

Back to Table Of Contents


Scroll to Top