Visual Basic 2008 Tutorial

Lesson 23: Managing Graphics -Drawing Rectangle

[Lesson 22]<<  [Home]   >>[Lesson 24]


We have learned how to create the Graphics and the Pen objects to draw straight lines in the previous lesson. Now we shall learn how to draw rectangle, square,ellipse and circle.  

23.1 Creating Rectangles

To draw a rectangle on the screen in VB2008, there are two ways: (i)The first way is to draw a rectangle directly using the DrawRectangle method by specifying its upper-left corner's coordinates and its width and height. You also need to create a Graphics and a Pen object to handle the actual drawing. The method to draw the rectangle is DrawRectangle .

The syntax is:

    myGrapphics.DrawRectangle(myPen, X, Y, width, height)

Where myGraphics is the variable name of the Graphics object and myPen is the variable name of the Pen object created by you. You can use any valid and meaningful variable names. X, Y is the coordinate of the upper left corner of the rectangle while width and height are self-explanatory, i.e, the width and height of the rectangle. The code is shown below:

    Dim myPen As Pen

    myPen = New Pen(Drawing.Color.Blue, 5)

    Dim myGraphics As Graphics = Me.CreateGraphics

    myGraphics.DrawRectangle(myPen, 0, 0, 100, 50)


(ii) The second way is to create a rectangle object first and then draw this triangle using the DrawRectangle method. The syntax is as shown below:

    myGraphics.DrawRectangle(myPen,myRectangle)

where myRectangle is the rectangle object created by you, the user.

The code to create a rectangtle object is as shown below:

    Dim myRectangle As New Rectangle

    myRect.X = 10 myRect.Y = 10

    myRect.Width = 100

    myRect.Height = 50

You can also create a rectangle object using a one-line code as follows:

    Dim myRectangle As New Rectangle(X,Y,width, height)

and the code to draw the above rectange is

    myGraphics.DrawRectangle(myPen, myRectangle)

The full code is shown below:

  Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click


   Dim myRect As New Rectangle

     myRect.X = 10

     myRect.Y = 10

     myRect.Width = 100

     myRect.Height = 50

   Dim myPen As Pen

     myPen = New Pen(Drawing.Color.Blue, 5)

   Dim myGraphics As Graphics = Me.CreateGraphics

     myGraphics.DrawRectangle(myPen, myRect)


  End Sub

23.2 Customizing Line Style of the Pen Object

The shape we draw so far are drawn with solid line, we can actually customize the line style of the Pen object so that we have dotted line, line consisting of dashes and more. For example, the syntax to draw with dotted line is shown below:

     myPen.DashStyle=Drawing.Drawing2D.DashStyle.Dot

The last argument ,Dot , specifies a particular line DashStyle value, a line that makes up of dots . The following code draws a rectangle with red dotted line.

  Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click

   Dim myPen As Pen

     myPen = New Pen(Drawing.Color.Red, 5)

   Dim myGraphics As Graphics = Me.CreateGraphics

     myPen.DashStyle = Drawing.Drawing2D.DashStyle.Dot

     myGraphics.DrawRectangle(myPen, 10, 10, 100, 50)

  End Sub

The output image is shown below:

The possible values of the line DashStyle of the Pen are listed in the table below:

DashStyle ValueLine Style
DotLine consists of dots
DashLine consists of dashes
DashDotLine consists of alternating dashes and dots
DashDotDotLine consists of alternating dashes and double dots
SolidSolid line
CustomCustom line style

  Bookmark and Share


[Lesson 22]<<  [Home]   >>[Lesson 24]


Copyright® Dr.Liew Voon Kiong  Contact: admin@vbtutor.net Privacy Policy]