DotNet Tutorials

V4 Dot Net Tutorials

Server Intellect Cloud Hosting

Navigator : Home > Tutorials > Graphics Tutorials > ...

 Drawing with Graphics in WinForms using VB

This tutorial will show you how to draw various shapes in a Window Form Application using the Graphics namespace. VB version.

Creating graphics in .NET can be very easy. In this tutorial, you will learn how to make a Windows Form Application draw different shapes using built-in methods of System.Drawing.Graphics

We will be creating a form with a PictureBox control and several buttons. These buttons will draw pre-defined shapes using all built-in methods. We will first design our form with one large Picture Box (size: 570, 300), and then add eight buttons to do the following: draw a line, ellipse, rectangle, arc, pie, polygon and bezier, and a button to clear the canvas.

Once we have these controls added to the form, we can begin adding the functionality. Double-click each button on the design view to create the click event handlers for them. First we will instantiate our graphics and pen, then draw a line:

Dim g As System.Drawing.Graphics
Dim pen1 As New System.Drawing.Pen(Color.Blue, 2)

Private Sub butLine_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles butLine.Click
g = PictureBox1.CreateGraphics
g.DrawLine(pen1, 250, 50, 400, 200)
End Sub

Yes, it is possible to find a good web host. Sometimes it takes a while. After trying several, we went with Server Intellect and have been very happy. They are the most professional, customer service friendly and technically knowledgeable host we've found so far.

The usage of the majority of the methods are similar, so we assign our graphics variable to the CreateGraphics method on each button click and then use the graphics methods to create the shapes. The usage of the majority of the methods are similar in principle:

Private Sub butEllipse_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles butEllipse.Click
g = PictureBox1.CreateGraphics
g.DrawEllipse(pen1, 50, 50, 100, 150)
End Sub

Private Sub butRect_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles butRect.Click
g = PictureBox1.CreateGraphics
g.DrawRectangle(pen1, 30, 30, 50, 60)
End Sub

Private Sub butArc_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles butArc.Click
g = PictureBox1.CreateGraphics
g.DrawArc(pen1, 150, 100, 150, 200, 150, 160)
End Sub

Private Sub butPie_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles butPie.Click
g = PictureBox1.CreateGraphics
g.DrawPie(pen1, 50, 50, 150, 150, 0, 170)
End Sub

We chose Server Intellect for its dedicated servers, for our web hosting. They have managed to handle virtually everything for us, from start to finish. And their customer service is stellar.

The Polygon is slightly different in that we are required to plot the points of each corner before we draw:

Private Sub butPoly_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles butPoly.Click
Dim p(5) As System.Drawing.Point
p(0).X = 0
p(0).Y = 0
p(1).X = 53
p(1).Y = 111
p(2).X = 114
p(2).Y = 86
p(3).X = 34
p(3).Y = 34
p(4).X = 165
p(4).Y = 7
g = PictureBox1.CreateGraphics
g.DrawPolygon(pen1, p)
End Sub

The bezier is similar in that we plot the points as well, but we can do it in fewer steps than the polygon. The values in the bezier are the x and y coordinates of the control points.
We can simply code the clear button by calling the Refresh method of the PictureBox:

Private Sub butBez_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles butBez.Click
g = PictureBox1.CreateGraphics
g.DrawBezier(pen1, 100, 200, 240, 250, 100, 200, 150, 30)
End Sub

Private Sub butClear_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles butClear.Click
PictureBox1.Refresh()
End Sub

We migrated our web sites to Server Intellect over one weekend and the setup was so smooth that we were up and running right away. They assisted us with everything we needed to do for all of our applications. With Server Intellect's help, we were able to avoid any headaches!

The entire code-behind is as follows:

Imports System.Drawing
Imports System.Drawing.Drawing2D
Imports System.Windows.Forms

Public Class Form1
Dim g As System.Drawing.Graphics
Dim pen1 As New System.Drawing.Pen(Color.Blue, 2)

Private Sub butLine_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles butLine.Click
g = PictureBox1.CreateGraphics
g.DrawLine(pen1, 250, 50, 400, 200)
End Sub

Private Sub butEllipse_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles butEllipse.Click
g = PictureBox1.CreateGraphics
g.DrawEllipse(pen1, 50, 50, 100, 150)
End Sub

Private Sub butRect_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles butRect.Click
g = PictureBox1.CreateGraphics
g.DrawRectangle(pen1, 30, 30, 50, 60)
End Sub

Private Sub butArc_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles butArc.Click
g = PictureBox1.CreateGraphics
g.DrawArc(pen1, 150, 100, 150, 200, 150, 160)
End Sub

Private Sub butPie_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles butPie.Click
g = PictureBox1.CreateGraphics
g.DrawPie(pen1, 50, 50, 150, 150, 0, 170)
End Sub

Private Sub butPoly_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles butPoly.Click
Dim p(5) As System.Drawing.Point
p(0).X = 0
p(0).Y = 0
p(1).X = 53
p(1).Y = 111
p(2).X = 114
p(2).Y = 86
p(3).X = 34
p(3).Y = 34
p(4).X = 165
p(4).Y = 7
g = PictureBox1.CreateGraphics
g.DrawPolygon(pen1, p)
End Sub

Private Sub butBez_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles butBez.Click
g = PictureBox1.CreateGraphics
g.DrawBezier(pen1, 100, 200, 240, 250, 100, 200, 150, 30)
End Sub

Private Sub butClear_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles butClear.Click
PictureBox1.Refresh()
End Sub
End Class

Now when we run this application, we will be able to click each button and see the different shapes appear on the form.

Looking for the C# Version? Click Here!

Looking for more .NET Tutorials? Click Here!
Download Project Source - Enter your Email to be emailed a link to download the Full Source Project used in this Tutorial!



100% SPAM FREE! We will never sell or rent your email address!