Creating the Graphics Window

[ LiB ]

A graphics window is a little bit different from the text windows we have been using thus far. Unlike the programs we have been running to this point, which could only display text, graphical windows can also display graphics, such as images and pictures. They can also change colors of text.

Every Blitz Basic graphical program contains a line of code that initializes the window. This process basically sets up the window for later use. To set up a graphical window, call the function Graphics . Graphics is declared as follows :

 Graphics width, height, color depth, [mode] 

Table 5.1 details each parameter.

Table 5.1. Graphics' Parameters

Parameter	Meaning
width	The width of the window in pixels
height	The height of the window in pixels
color depth	The colors per pixel (in bits)
[mode]	The mode of the window: 0 = auto, 1 = full-screen mode, 2 = windowed mode, 3 = scaled-window mode

NOTE

What Is Initialization?

I will use the term initialization a lot in this chapter, and you might wonder what it means. To initialize a window means to set the window up, so, when you initialize the graphics in Blitz Basic, you are setting it up. After initialization, you will be able to use graphics in the program.

Width and Height

Let's discuss each parameter in depth. Take a look at width and height they affect your program in a huge way, but only a few modes are commonly used. These modes are shown in the following list.

• 640 x 480

• 800 x 600

• 1024 x 768

• 1280 x 1024

• 1600 x 1200

You might be wondering why we only use these modes, and there certainly is a reason. If you were to take a ruler to your computer monitor and measure the height and width, you would always come out with a bigger width than height. But the cool part is, the numbers you come up with are always proportional to one another. For example, my monitor is 14.66 inches wide and 11 inches tall. If you divide 14.66 by 11, you get 1.33. This means that my computer monitor's width is 1.33 times its height. This proportion works for all monitors and most televisions as well. Try it out!

Because the monitor's width is longer than its height, all of the pixel values on the monitor must change. If you were to draw a box that was an exact square, it would end up looking like a rectangle on the monitor (its width would be longer than its height). To combat this problem, resolutions make the height pixels larger than the width pixels. The pixels are stretched out a bit, and the square actually looks like a square. Refer to Figure 5.1 to see the monitor's proportion.

Figure 5.1. The monitor's proportion.

Color Depth

NOTE

Take note that setting the color depth only makes a difference in full-screen mode. In windowed mode, the color depth of your game is limited to the color depth of the player's desktop; in full-screen mode, the color depth can be set to any one of the color depths from Table 5.2 . To see your desktop's color depth, right-click on your desktop and select Properties. Then find the Settings tab.Your color depth is under Color Quality.

Table 5.2. Color Depth

Color Depth (bits)	Colors
8	256
16	65536
24	16,777,216
32	4,294,967,296

The next variable is color depth. The color depth is actually the number of colors that each pixel can be, and is numbered in bits. See Table 5.2 for the common color depths and their respective color counts.

NOTE

There is a procedure to find out how many colors each color depth provides. Simply raise 2 to the power of the color depth. For example, if you want to find out how many colors a color depth of 8 gives, multiply 2 by itself 8 times (2 x 2 x 2 x 2 x 2 x 2 x 2 x 2) or find 2 to the 8 ^th power (2^8).

NOTE

Although these are the only color depths used commonly today, other depths have been used in the past. For example, some very old games might have run in a color depth mode of 1, which provides only two colorsblack and white.

NOTE

CAUTION

Make sure you know what bit depth you should be using before you select it. If you use a color depth of 8, for example, but the colors in your game need at least a color depth of 16, the colors in your game won't show up.

If you aren't quite sure which color depth to select, Blitz Basic can automatically select the best color depth for you. To have Blitz do this, just omit the color depth or set it to 0. Basically, what this means is, if you know what color depth you need, pick it yourself; if not, let Blitz Basic pick for you.

[Mode]

The final variable in the Graphics function is the [ mode] variable. [ Mode] can be one of four choices0, 1, 2, or 3. The [ mode] variable determines how the program window behaves.

0 is [ mode] 's default value; if you leave [ mode] blank, it is automatically set to 0. When your program runs in auto mode, it runs windowed in debug mode and full-screen otherwise . See Figure 5.2 to see the difference between full-screen and windowed modes.

Figure 5.2. Full-screen and windowed modes.

NOTE

What Is Debug Mode?

I refer to debug mode a lot, and you might want to know what it means. When writing a game, you often come across hidden bugs which are extremely hard to find. Debugging allows you to step through a program line-by-line to discover where your program goes wrong. Debugging offers another reason for using functionsdiscovering bugs in a program where most code is located in functions that are separate from the main code is much easier than finding bugs in a program where all the code is thrown together in the main function.

When you are planning on debugging a game, you work in debug mode. This allows you to see the line you are debugging and find out what value each variable contains. When you have finished your game, you turn debug mode off and distribute the actual game. To turn debug mode on and off, check or uncheck Program->Debug Enabled? See Figure 5.3 for a screenshot of debug mode.

Debug mode.

Table 5.3 details each of [mode] 's possible values. Selecting 1 for the [mode] variable causes your game to run full-screen. A game in full-screen mode takes up the entire screen; there are no other windows or programs on the screen. Of course, the other programs are running; they are just hidden under the game. Full-screen mode tends to make the game run faster, but it takes over most of the player's computer screen. Figure 5.4 is a screenshot of a full-screen game.

Table 5.3. [mode]'s Values

Value	Mode Name	Meaning
	Auto	Runs in windowed mode when in debug mode and full-screen when not.
1	Full screen	Game takes up the full screenno other programs can be seen running.
2	Windowed	Game runs as a regular windows program.
3	Scaled windowed	Game runs as a regular windows program but also allows resizing, minimizing, and so on.

Figure 5.4. KONG in full-screen mode.

Setting [mode] to 2 forces your game to run like a normal Windows program. This means that your program has a toolbar and can be moved around just like a normal program, as shown in Figure 5.5. However, you cannot resize your window.

Figure 5.5. KONG in windowed mode.

If [mode] is set to 3, your program acts just like it would if it were set to 2, but you are able to resize, minimize, and maximize the window to your liking. However, this advantage comes at a pricea drastic decrease in speed often occurs as a result of scaled window mode. See Figure 5.6 for an example of what a scaled window could look like.

Figure 5.6. KONG in scaled windowed mode.

[ LiB ]