Published: September 3, 2008
by Richard G. Baldwin
File: Allegro00130
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.
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.
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.
In this lesson, I will show you how to control the color of each individual pixel, producing visual effects such as that shown in Figure 1 where every pixel is a different color.
Figure 1. Screen shot from project PutPixel01.
|
|
A graphics frame with dimensions of 256x256 is placed on the screen. Nested for loops are used to set the color values for each pixel in the frame. The color ranges from mid-intensity blue in the upper left corner to subdued yellow in the bottom right corner. (See Figure 1.)
Watching the pixel colors change
The initial color of every pixel is black. The color of each pixel is changed directly on the screen. As a result, depending on the speed of your computer, you may be able to see the color of the pixels change going top to bottom down the frame when you run the program.
(On my machine, changing the color depth from 32 to 16 causes the entire frame to be painted much more quickly.)
Pressing any key causes the program to terminate.
Beginning of the program
As usual, I will explain this program in fragments. A complete listing of the program is presented in Listing 4 near the end of the lesson.
The first fragment, shown in Listing 1, shows the beginning of the program.
Listing 1. Beginning of the program.
#include <allegro.h>
int main(){
allegro_init();//Allegro initialization
install_keyboard();//Set up for keyboard input
//Need to set the color depth before setting the
// graphics mode.
set_color_depth(32);
//Set the graphics mode to a 256x256-pixel window.
set_gfx_mode(GFX_AUTODETECT_WINDOWED,256,256,0,0);
|
Nothing new here
I have explained all of the code in Listing 1 in earlier lessons (see Resources), so I won't repeat those explanations here.
Set color values for each pixel individually
The heart of the program is shown in Listing 2. The code in Listing 2 cycles through the screen bitmap setting the color values for each individual pixel.
Listing 2. Set color values for each pixel individually.
for(int row = 0;row < 255;row++){
for(int column = 0;column < 255;column++){
putpixel(screen,column,row,makecol(column,row,128));
}//end loop row
}//end loop on column
|
The code in Listing 2 consists of a pair of nested for loops. The outer loop iterates down through the top 255 rows of pixels in Figure 1. The inner loop iterates across the left-most 255 columns of pixels in Figure 1.
The color values
The putpixel function is called inside the inner loop to set the color values for each pixel specified by coordinate values equal to the column counter and the row counter.
The red and green color values assigned to each pixel are equal to the coordinates of the pixel. A constant blue color value of 128 (half intensity) is assigned to every pixel. Therefore, when the row and column counters are both equal to zero in the upper-left corner, the color of the pixel is half-intensity blue. When the red and green color values are at their maximum in the lower-right corner, the color is a subdued yellow.
Very useful code
The nested for loops shown in Listing 2 will show up again and again in future lessons as we create special effects by modifying the color values for individual pixels in a graphics image. However, in most of those lessons, we will modify the pixels in an off-screen buffer and copy the off-screen buffer to the screen. As a result, you won't be able see the pixels change color as is the case with this program.
End of the program
The end of the main function and the end of the program is shown in Listing 3.
Listing 3. End of the program.
//Block and wait until the user presses a key. readkey(); return 0;//Return 0 to indicate a successful run. }//end main function END_OF_MAIN() |
Once again, there is nothing in Listing 3 that I haven't already explained in earlier lessons in this series.
In this lesson, I showed you how to control the color of each individual pixel in a graphics image using a pair of nested for loops.
The nested for loops used in this lesson to control the color values for individual pixels will show up again and again in future lessons as we create special effects by modifying the color values for individual pixels in a graphics image.
Listing 4. Source code for project PutPixel01.
/*Project PutPixel01
The purpose of this project is to illustrate the most
fundamental aspects of writing code to control the
color of each individual pixel.
A window with dimensions of 256x256 is placed on the
screen. Nested for loops are used to set the value of
each pixel in the window. The color ranges from mid-
intensity blue in the upper left corner to yellow in the
bottom right corner.
The color of each pixel is changed directly on the screen.
As a result, the user can see the color of the pixels
change going from top to bottom down the window.
Changing the color depth from 32 to 16 causes the entire
window to be painted much more quickly.
Pressing any key causes the program to terminate.
*/
#include <allegro.h>
int main(){
allegro_init();//Allegro initialization
install_keyboard();//Set up for keyboard input
//Need to set the color depth before setting the
// graphics mode.
set_color_depth(32);
//Set the graphics mode to a 256x256-pixel window.
set_gfx_mode(GFX_AUTODETECT_WINDOWED,256,256,0,0);
//Cycle through the screen bitmap setting the color of
// each pixel individually.
for(int row = 0;row < 255;row++){
for(int column = 0;column < 255;column++){
putpixel(screen,column,row,makecol(column,row,128));
}//end loop row
}//end loop on column
//Block and wait until the user presses a key.
readkey();
return 0;//Return 0 to indicate a successful run.
}//end main function
END_OF_MAIN()
|
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.
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.
-end-
