VB.NET 1.1 Tutorial - GDI+ - Part 1

Previously we have written two programs that draw directly onto the form itself. The first program displayed Hello Mum by providing our own paint event. The second program also displayed Hello Mum by overriding the OnPaint method. These both used methods in the Graphics class to draw on the form. The Graphics class is part of the classes for drawing which are called GDI+.

The term GDI stands for Graphical Device Interface. GDI+ is next evolution of GDI for the .Net Platform. All GDI+ classes reside in the following namespaces:

System.Drawing
System.Text
System.Printing
System.Internal
System.Imaging
System.Drawing2D
System.Design

The `Graphics` Class

As stated previously, the Graphics class is part of the System.Drawing namespace. It encapsulates a GDI+ drawing surface, and it is this surface that we draw upon. In the previous sections, Hello Mum - Windows Style - Part 3 and Hello Mum - Windows Style - Part 4, we used two methods of drawing the same text on the form's graphics surface. The first method (part 3) overrode the OnPaint method,

Protected Overrides Sub OnPaint(ByVal e As PaintEventArgs)
  Dim g As Graphics = e.Graphics

while the second method (part 4) provided a paint event.

Private Sub Form1_Paint( ByVal sender As Object, ByVal e As PaintEventArgs ) _
                         Handles MyBase.Paint
  Dim g As Graphics = e.Graphics

Both of these use the same method to get a reference to the Graphics class. This is our surface to draw on. In order to draw on the surface we need to include a reference to the System.Drawing.dll.

Imports System.Drawing

The code we used to draw our string used one of the methods within this Graphics class.

' Method under System.Drawing.Graphics
e.Graphics.DrawString( "Hello Mum!", _
                       New Font("Verdana", 20), _
                       New SolidBrush(Color.Tomato), _
                       40, _
                       40)

The table below details some of the drawing methods available within the Graphics class.

Method Description

DrawArc Draws an arc from the specified ellipse.

DrawBezier Draws a cubic bezier curve.

DrawBeziers Draws a series of cubic Bezier curves.

DrawClosedCurve Draws a closed curve defined by an array of points.

DrawCurve Draws a curve defined by an array of points.

DrawEllipse Draws an ellipse.

DrawImage Draws an image.

DrawLine Draws a line.

DrawPath Draws the lines and curves defined by a GraphicsPath.

DrawPie Draws the outline of a pie section.

DrawPolygon Draws the outline of a polygon.

DrawRectangle Draws the outline of a rectangle.

DrawString Draws a string.

FillEllipse Fills the interior of an ellipse defined by a bounding rectangle.

FillPath Fills the interior of a path.

FillPie Fills the interior of a pie section.

FillPolygon Fills the interior of a polygon defined by an array of points.

FillRectangle Fills the interior of a rectangle with a Brush.

FillRectangles Fills the interiors of a series of rectangles with a Brush.

FillRegion Fills the interior of a Region.

`Graphic`s Objects

Notice in the above table that some of the methods refer to a Brush object. This is one of a three special items which are worthy of note. These three objects can use up resources, so they need to be managed within your program, making sure that you dispose of them when you are finished.

Object Description

Font Used to describe the font to be used to render text

Brush Used to fill enclosed surfaces with patterns, colors, or bitmaps

Pen Used to draw lines and polygons, including rectangles, arcs, and pies

The `Font` Object

The Font class defines a particular format for text. This includes the font type, its size in points, and/or style attributes. The two most common constructors used to create fonts are:

Public Sub New( String, Single )

where String is the name of the font you wish to use, and the Single is the size of the font in points.

Public Sub New( Font, FontStyle )

where a new instance of the Font class is created from the specified existing Font and FontStyle. FontStyle is an enumeration with the following members:

Member Name Description

Bold Bold text

Italic Italic text

Regular Normal text

Strikeout Text with a line through the middle

Underline Underlined text

For more information, follow the References section at the bottom of the page.

The `Brush` Object

This is an abstract base class and cannot be instantiated. To create a brush object, we must use classes derived from Brush. These are

SolidBrush contained in the System.Drawing namespace.
TextureBrush contained in the System.Drawing namespace.
HatchBrush contained in the System.Drawing.Drawing2D namespace.
LinearGradientBrush contained in the System.Drawing.Drawing2D namespace.
PathGradientBrush contained in the System.Drawing.Drawing2D namespace.

The SolidBrush class defines a brush made up of a single color.
The TextureBrush class is a Brush object that uses an image to fill the interior of a shape.
The HatchBrush class defines a rectangular brush with a hatch style, a foreground color, and a background color.
The LinearGradientBrush class encapsulates both two-color gradients and custom multicolor gradients.
The PathGradientBrush class encapsulates a Brush object that fills the interior of a GraphicsPath object with a gradient.

Brushes are used to fill graphics shapes such as rectangles, ellipses, pies, polygons, and paths.

The `Pen` Object

A Pen object draws a line of specified width and style. The line drawn by a Pen object can be filled in a variety of fill styles, including solid colors and textures. The fill style depends on brush or texture that is used as the fill object.

A pen has four different types of constructor.

Creates a new instance of the Pen class with the specified Color.

Public Sub New( Color )

Creates a new instance of the Pen class with the specified Brush.

Public Sub New( Brush )

Creates a new instance of the Pen class with the specified Brush and width.

Public Sub New( Brush, Single )

Creates a new instance of the Pen class with the specified Color and width.

Public Sub New( Color, Single )

The most common used properties are:

Property Description

Alignment Gets or sets the alignment for the Pen object.

Brush Gets or sets the Brush object that determines attributes of the Pen object.

Color Gets or sets the color of the Pen object.

DashStyle Gets or sets the style used for dashed lines drawn with the Pen object.

Width Gets or sets the width of the Pen object.

Disposing of Objects

When you are finished with a Graphics object, you should call its Dispose method to ensure that all resources used by the Graphics object are freed. Simply letting an object variable go out of scope doesn't ensure that the resources used by the object are freed. Graphics objects can use considerable resources, so you should always call Dispose when you're finished with any Graphics object.

If we re-write the code from the top of the Hello Mum - Windows Style - Part 4 page, we get the following code.

Private Sub HelloPaint_Paint( ByVal sender As Object, _
                              ByVal e As PaintEventArgs) _
                              Handles MyBase.Paint

  ' Get Graphics Object
  Dim g As Graphics = e.Graphics

  ' Create Font
  Dim myFont As New Font( "Verdana", 20 )

  ' Create Brush
  Dim myBrush As New SolidBrush( Color.Tomato )

  ' Draw the String
  g.DrawString( "Hello Mum!", myFont, myBrush, 40, 40 )

  ' Now tidy up
  myFont.Dispose()
  myBrush.Dispose()
End Sub

You can download the file helloPaint.vb from the link, or you can download my copy of the executable from here. If you have Visual Studio, you can download the solution here.

Here we create our Graphics objects, use them, then clean up after ourselves.

References

For more information on the Graphics class, visit MSDN at microsoft here.

For more information on the Font class, visit MSDN at microsoft here.

For more information on the Brush class, visit MSDN at microsoft here.

For more information on the Pen class, visit MSDN at microsoft here.

For more information on the IDisposable.Dispose method, visit MSDN at microsoft here.

What Next?

Next we will draw some simple Lines.

Return to the Tutorial Contents.

VB.NET 1.1 Tutorial - GDI+ - Part 1

The Graphics Class

Graphics Objects

The Font Object

The Brush Object

The Pen Object