Lab 8 Bit-Mapped Graphics

• Moving from text-based graphics to bit-mapped graphics.

• Easy to draw graphic points and lines using INT 10h, Function 0Ch (write pixel)

• Have to put the video adapter in one of the standard graphics modes (INT 10h, Function 00h).

Graphics Mode-Will use modes 12h (VGA – 16-color), 0Dh (16 color),

04h (4-color), and 13h (256 color)

Lab 8A – VGA Modes

• Determine the current video mode and save.• Set new video mode.• Divide the number of rows by the number of colors in

the chosen mode. • Write the correct number of rows of pixels so that

horizontal bands of each color with an equal number of rows are present. Bandsize = Maxrow/maxpix where maxpix is number of colors in mode.

• The variable bandcount is used to track how many rows have been written. Each row is written and then the bandsize is checked to see if bandsize = bandcount.

Lab Question #1

• Modify the program so that the colors and displayed in vertical stripes instead of horizontal stripes.

Lab 8B – Color Representation

• A pixel color is composed of three components (Red(R), Green(G), Blue(B))

• The video DAC converts a digital value that represents a color to the analog voltage needed by the RGB monitor.

• 24-bit color means that 8-bits are used for each of the R,G,B color components. (Each pixel requires 3 bytes)

• Number of bytes needed for one screen is 640x480x3 = 921,600 Bytes

Lab 8B – Color Representation

• Rather than use the DAC to convert every digital signal that comes from the PC into a 0-0.7 voltage range (224 different values), some subset could be stored in memory with the correct voltages. This could drastically reduce the amount of memory on the video card.

• A palette is a LUT on the Video DAC.• There is a default palette or one can create their

own palette.• Note that color 0 of the palette is the border

color.

Examples of RGB values for colors

• Bright Red (255, 0, 0)• Bright Blue (0, 0, 255)• Bright Green (0, 255, 0)• Yellow (255, 255, 0)• Magenta (255, 0, 255)• Teal (0, 255, 255)• Gray (63, 63, 63)• Black (0,0,0)• 224 different shades

Lab8-C 2D Animation

• Remember the palettes are stored sequentially in memory.

• To determine how big the palette is, you must know how many colors are used, and how many bytes are used for each color.

• Lab 8 Palette is 16 colors, 3 bytes per color (on for red, one for green, one for blue) 16 x 3 = 48 bytes for the palette

Palette Stored in Memory

0 3 6 9 12R G B R G B R G B R G B R G B

15 18 21 24 27 R G B R G B R G B R G B R G B

30 33 36 39 42 45R G B R G B R G B R G B R G B R G B

Color 8

Color 4Color 0 Color 1 Color 2 Color 3

Color 15

Color 9

Color 10 Color 11 Color 12 Color 13 Color 14

Color 5 Color 6 Color 7

Palette Rotation

• We want to rotate the colors to make it look like animation – the colors are moving across the screen.

• To move from Left to Right– Save the three bytes associated with color 15.– Use string primitives (movsb) to move the data from

locations 3-44 to locations 6-47.– Locations 0-2 are to remain unchanged as they are

the border color.– Put the saved bytes into locations 3-5

MOVSB Instruction

• Move string Data: Copy an integer from one memory location to another.

• Note that by itself, a string primitive only processes a single memory value. If you add a repeat prefix, the instruction repeats, using ECX as the counter. You can process an entire array using only one instruction.

Direction Flag

• The direction flag determines if the movement increments the memory addresses or decrements.

Value of the Direction Flag

Effect on ESI and EDI

Address Sequence

clear incremented low-highset decremented high-low

Example of Moving Strings

Cld ;clear direction flag

Mov esi, OFFSET string1 ;ESI points to string1

Mov edi, OFFSET string2 ;EDI points to string2

Mov ecx, 10 ;set counter to 10

Rep movsb ;move 10 bytes

• ESI and EDI are automatically incremented each time MOVSB repeats. The move only occurs if CX >0.

Another way to rotate the palette

• Store the three bytes associated with color 15 in memory.

• Make loop using direct offset addressing– Move color 14 into 15– Move color 13 into 14– …– Move color 1 into 2– Move color 15 into 1