Lesson 18: Creating Graphics in Visual Basic 6

Master shape controls, drawing methods, and image handling for rich visual interfaces

Key Takeaway

VB6 provides powerful tools for creating graphics through shape controls, image boxes, and drawing methods, enabling you to build visually rich applications.

Welcome to Lesson 18 of our Visual Basic 6 Tutorial! In this lesson, you'll learn how to create compelling graphics in VB6. Unlike traditional BASIC where graphics required complex line-by-line programming, VB6 simplifies the process with intuitive controls and methods that make graphic design accessible to all developers.

18.1 The Line and Shape Controls

VB6 provides built-in controls for drawing basic shapes and lines directly on your forms. These controls are perfect for creating UI elements, diagrams, and visual separators.

Rectangle

Shape = 0

Square

Shape = 1

Oval

Shape = 2

Circle

Shape = 3

Rounded Rectangle

Shape = 4

Rounded Square

Shape = 5

To draw a shape:

  1. Select the Shape control from the toolbox
  2. Click and drag on the form to create your shape
  3. Modify properties like Shape, BorderStyle, FillStyle, and FillColor

18.1.1 Changing Shape Properties Programmatically

You can dynamically change shapes and colors using code. This example allows users to select a shape from a list and change its color:

ShapeDemo.vb
Private Sub Form_Load()
    ' Add shape options to list
    List1.AddItem "Rectangle"
    List1.AddItem "Square"
    List1.AddItem "Oval"
    List1.AddItem "Circle"
    List1.AddItem "Rounded Rectangle"
    List1.AddItem "Rounded Square"
End Sub

Private Sub List1_Click()
    ' Change shape based on selection
    Select Case List1.ListIndex
        Case 0: Shape1.Shape = 0  ' Rectangle
        Case 1: Shape1.Shape = 1  ' Square
        Case 2: Shape1.Shape = 2  ' Oval
        Case 3: Shape1.Shape = 3  ' Circle
        Case 4: Shape1.Shape = 4  ' Rounded Rectangle
        Case 5: Shape1.Shape = 5  ' Rounded Square
    End Select
End Sub

Private Sub Command1_Click()
    ' Show color dialog and apply selection
    CommonDialog1.Flags = &H1&
    CommonDialog1.ShowColor
    Shape1.BackColor = CommonDialog1.Color
End Sub
Shape Selection Interface
Figure 18.1: Shape selection interface

18.2 The Image Box and Picture Box

For more complex graphics, VB6 provides Image and Picture Box controls to display images in various formats.

Image Box

Lightweight control for displaying images with automatic resizing. Best for static images.

Picture Box

More powerful control that can contain other controls and supports drawing methods.

To load an image at runtime:

Loading Images

Image1.Picture = LoadPicture("C:\path\to\image.jpg")

Picture1.Picture = LoadPicture("C:\path\to\image.jpg")

18.2.1 Random Image Display

This example demonstrates how to display random images using the Image Box control:

RandomImages.vb
Dim a, b, c As Integer

Private Sub Command1_Click()
    ' Generate random numbers
    a = 3 + Int(Rnd * 3)
    b = 3 + Int(Rnd * 3)
    c = 3 + Int(Rnd * 3)
    
    ' Set images based on random values
    If a = 3 Then
        Image1(0).Picture = LoadPicture("C:\Images\grape.gif")
    ElseIf a = 4 Then
        Image1(0).Picture = LoadPicture("C:\Images\cherry.gif")
    ElseIf a = 5 Then
        Image1(0).Picture = LoadPicture("C:\Images\orange.gif")
    End If
    
    ' Repeat for other image boxes
    ' ...
End Sub
Random Image Display
Figure 18.2: Random image display

18.3 Drawing Methods: PSet, Line and Circle

For advanced graphics, VB6 provides drawing methods that allow you to create graphics programmatically.

Interactive Drawing Demo

Drawing Tools

Canvas Controls

PSet Method

Draws a single pixel at specified coordinates

PSet (x, y), color

Line Method

Draws lines and rectangles between points

Line (x1, y1)-(x2, y2), color, [B][F]

Circle Method

Draws circles, ellipses, arcs and pie slices

Circle (x, y), radius, color

18.3.1 Drawing Method Examples

Basic examples of using drawing methods:

DrawingMethods.vb
' Draw a point at (100, 100)
PSet (100, 100), vbRed

' Draw a line from (0,0) to (1000,2000)
Line (0, 0)-(1000, 2000), vbBlue

' Draw a filled rectangle
Line (500, 500)-(1500, 1500), vbGreen, BF

' Draw a circle at (1000,1000) with radius 500
Circle (1000, 1000), 500, vbMagenta

Lesson Summary

In this lesson, you've mastered VB6 graphics techniques:

Shape Controls

Using Line and Shape controls to create UI elements

Image Handling

Loading and displaying images with Image and Picture Boxes

Drawing Methods

Using PSet, Line, and Circle to create graphics programmatically

Dynamic Graphics

Changing properties and creating effects at runtime

Performance Tip

For complex animations, use the AutoRedraw property set to True to create persistent graphics that don't need to be redrawn when the form is obscured.

Practice Exercises

Test your graphics skills with these exercises:

Exercise 1: Shape Gallery

Create an application that displays all six VB6 shapes in different colors with labels.

Exercise 2: Image Viewer

Build an image viewer with navigation buttons to cycle through a folder of images.

Exercise 3: Drawing App

Create a simple drawing application using PSet and Line methods with mouse events.

Exercise 4: Animated Banner

Develop an animated banner using the Timer control and drawing methods.

Exercise 5: Pie Chart Generator

Create a program that generates pie charts from data using the Circle method.

Next Lesson

Continue your VB6 journey with Lesson 19: Creating a DVD Player Application.

Related Resources

Full VB6 Tutorial Index

Complete list of all VB6 lessons with descriptions

Explore Tutorials

Visual Basic Examples

Practical VB6 code samples for real-world applications

View Examples

File Handling in VB6

Learn about file creation and handling in VB6

Previous Lesson

Multimedia Applications

Learn to create DVD and media players

Next Lesson