Graphics Programming using Allegro

Reading and Displaying Image Files

Published:  September 6, 2008
by Richard G. Baldwin

File:  Allegro00140


Preface

General

This lesson is part of a series (see Resources) designed to teach you how to use Allegro to do graphics programming in C++.  My purpose in writing the series is to provide lecture and lab material for a course titled Game Development Using C++ that I teach at Austin Community College in Austin, Texas.  However, if you have stumbled upon this series and you find it useful, you are welcome to study it.

Viewing tip

I recommend that you open another copy of this document in a separate browser window and use the following links to easily find and view the figures and listings while you are reading about them.

Figures

Listings

Supplemental material

I recommend that you also study the other lessons in my extensive collection of online programming tutorials.  You will find a consolidated index at www.DickBaldwin.com.

Preview

The purpose of this program is to show you how to load an image file into memory and how to display it in an onscreen window.

Two image files are loaded into bitmaps in memory.  According to the documentation for the load_bitmap function, BMP, LBM, PCX, and TGA files are supported by default.  I understand from other web sources that an Allegro extension can be installed to also support JPEG files, but I have not installed that extension on my computer.

Two PCX files

Both image files used in this lesson are PCX files.  I used a local program named Lview to convert the original JPEG files into PCX files.  If you don't have a program on your computer to convert your JPEG files into PCX files, there are numerous free online image converter services available.  For your convenience, I included a link to one of them in Resources, but I haven't used that service because I didn't need to.

Display in an onscreen window

An onscreen window is created that is of sufficient size to contain both images.  The two images are copied into the onscreen window with one image above the other as shown in Figure 1.

Figure 1. Screen output for ImageDisplay01.

Pressing any key causes the program to terminate.

Discussion and sample code

As is my custom, I will explain the program code in fragments.  A complete listing of the program is provided in Listing 5 near the end of the lesson.

The first fragment is shown in Listing 1.

Listing 1. Beginning of the program named ImageDisplay01.
#include <allegro.h>

int main(){
  //Typical Allegro setup.
  allegro_init();
  install_keyboard();
  set_color_depth(32);
  //Create an onscreen window 332x651 pixels in size.
  set_gfx_mode(GFX_AUTODETECT_WINDOWED,332,651,0,0);

You have seen the code in Listing 1 in numerous earlier lessons so an explanation of the code should not be needed.

Load and display the first image

Listing 2 loads and displays the starfish image shown at the top in Figure 1.

Listing 2. Load and display the starfish image.
  //Declare a pointer variable capable of pointing to a
  // bitmap.
  BITMAP *picA = NULL;
  //Load an image file from the current directory.
  picA = load_bitmap("starfish.pcx", NULL);
  //Copy the image to the upper-left corner of the
  // onscreen window.
  blit(picA, screen, 0,0,0,0,324,330);

Listing 2 begins by declaring a pointer variable named picA capable of pointing to a BITMAP.

Call the load_bitmap function

Then Listing 2 calls the load_bitmap function to create a new bitmap in memory and to populate it with the contents of the image file named starfish.pcx.

The second parameter required by the load_bitmap function involves palette information, which is needed for images with low color depth.  However, for a color depth of 32, it is not necessary to pass palette information to the function.  Therefore, Listing 2 passes null as the second parameter.  You can read more about the requirements for palette data or the lack thereof in the documentation for the load_bitmap function.

Copy the image to the screen

Finally, Listing 2 calls the blit function to copy the memory bitmap containing the image to the screen bitmap, aligning the upper-left corner of both bitmaps as shown in Figure 1.  As I explained in an earlier lesson (see Resources), the blit function copies a rectangular area from a source bitmap to a destination bitmap very quickly.

Load and display the image of the tree limb

Listing 3 loads the image of the tree limb and displays it immediately below the image of the starfish as shown in Figure 1.

Listing 3. Load and display the image of the tree limb.
  BITMAP *picB = NULL;
  picB = load_bitmap("tree.pcx", NULL);
  blit(picB, screen, 0,0,0,330,294,321);

Parameters passed to the blit function

The code in Listing 3 is very similar to the code in Listing 2.  Note, however, that the last three parameters to the blit function are different between the two calls to the blit function.

The last two parameters in Listing 3 specify that a rectangular area of the source bitmap with a width of 294 pixels and a height of 321 pixels is to be copied to the destination bitmap.

The first two parameters specify that the upper-left corner of that rectangle is at coordinate position 0,0 in the source bitmap.  (Those four parameters taken together specify that the entire source bitmap is to be copied, but I needed to know the dimensions of the original image in order to know that.)

The third and fourth parameters specify that the upper-left corner of the source image is to be placed at a coordinate position of 0,330 in the destination (screen) bitmap.  This places it immediately below the starfish image as shown in Figure 1.

Read the keyboard buffer and terminate

Listing 4 blocks and waits for the user to press a key on the keyboard with the images shown in Figure 1 displayed on the computer screen.

Listing 4. Read the keyboard buffer and terminate.
  //Block and wait until the user presses a key.
  readkey();
  
  //Destroy bitmaps to avoid memory leaks.
  destroy_bitmap(picA);
  destroy_bitmap(picB);

  return 0;//Return 0 to indicate a successful run.
}//end main function
END_OF_MAIN()

When the user presses any key, the program destroys the two memory bitmaps and terminates.  I discussed the destruction of memory bitmaps in an earlier lesson.

Summary

In this lesson, I showed you how to load image files into memory bitmaps and how to display those images in a window on the computer screen.

In order to display two images in the same window without having them overlap, it was necessary for me to know the dimensions of the images in advance.  I will deal with that issue in a future lesson.

Complete program listing

A complete listing of the program is shown in Listing 5 below.

Listing 5. Source code for program named ImageDisplay01.
/*Project ImageDisplay01

The purpose of this project is to show how to load an
image file into memory and to display it in an onscreen
window.

Two image files are loaded into bitmaps in memory.
According to the docs for the load_bitmap function, BMP,
LBM, PCX, and TGA files are supported by default. I
understand from other web sources that an Allegro
extension can be installed to also support JPEG files,
but I have not installed that extension. In this program,
both image files are PCX files. I used a program named
Lview to convert the original JPEG files to PCX files.

An onscreen window is created that is of sufficient size
to contain both images.

The two images are copied into the onscreen window with
one image above the other.

Pressing any key causes the program to terminate.
*/
#include <allegro.h>

int main(){
  //Typical Allegro setup.
  allegro_init();
  install_keyboard();
  set_color_depth(32);
  //Create an onscreen window 332x651 pixels in size.
  set_gfx_mode(GFX_AUTODETECT_WINDOWED,332,651,0,0);

  //Declare a pointer variable capable of pointing to a
  // bitmap.
  BITMAP *picA = NULL;
  //Load an image file from the current directory.
  picA = load_bitmap("starfish.pcx", NULL);
  //Copy the image to the upper-left corner of the
  // onscreen window.
  blit(picA, screen, 0,0,0,0,324,330);
  
  //Load a second image and copy it to the onscreen
  // window immediately below the first image.
  BITMAP *picB = NULL;
  picB = load_bitmap("tree.pcx", NULL);
  blit(picB, screen, 0,0,0,330,294,321);
  
  //Block and wait until the user presses a key.
  readkey();
  
  //Destroy bitmaps to avoid memory leaks.
  destroy_bitmap(picA);
  destroy_bitmap(picB);

  return 0;//Return 0 to indicate a successful run.
}//end main function
END_OF_MAIN()

 

Resources


Copyright

Copyright 2008, Richard G. Baldwin.  Reproduction in whole or in part in any form or medium without express written permission from Richard Baldwin is prohibited.

About the author

Richard Baldwin is a college professor (at Austin Community College in Austin, TX) and private consultant whose primary focus is a combination of Java, C#, and XML. In addition to the many platform and/or language independent benefits of Java and C# applications, he believes that a combination of Java, C#, and XML will become the primary driving force in the delivery of structured information on the Web.

Richard has participated in numerous consulting projects and he frequently provides onsite training at the high-tech companies located in and around Austin, Texas.  He is the author of Baldwin's Programming Tutorials, which have gained a worldwide following among experienced and aspiring programmers. He has also published articles in JavaPro magazine.

In addition to his programming expertise, Richard has many years of practical experience in Digital Signal Processing (DSP).  His first job after he earned his Bachelor's degree was doing DSP in the Seismic Research Department of Texas Instruments.  (TI is still a world leader in DSP.)  In the following years, he applied his programming and DSP expertise to other interesting areas including sonar and underwater acoustics.

Richard holds an MSEE degree from Southern Methodist University and has many years of experience in the application of computer technology to real-world problems.

Baldwin@DickBaldwin.com

-end-