Graphics in VB.NET Part 3 - Figures

**Vswe** · 11-07-2009 03:06 PM

In this 4 parts long tutorial series I will introduce you to graphics in VB.NET. The four parts is meant to be in order so I recomend you to read them in order to be able to understand the later parts.

Graphics in VB.NET

Bitmaps
Graphics
Figures
Strings

Fill figures

By using graphics you can use "Fill..." to fill areas with a selected color. The first parameter is which brush you will use. The brush is which color you want to use. Then it's different on different "Fills" how you define the coordinates and size of the area you want to fill. The different possible types of areas are:

Code:

FillClosedCurve
FillEllipse
FillPath
FillPie
FillPolygon
FillPolygon
FillPolygon
FillRectangle
FillRectangles
FillRegion

If you want to paint the whole background in one color it's probably best to use FillRectangle, I will use that as an example on how to use the "Fills":

[highlight=VB.NET] Dim Img As New Bitmap(400, 400)

Dim g As Graphics = Graphics.FromImage(Img)
g.FillRectangle(Brushes.Blue, New Rectangle(0, 0, Img.Width, Img.Height))
g.Dispose()[/highlight]

In the above example we're familiar with everything expect this line:

[highlight=VB.NET] g.FillRectangle(Brushes.Blue, New Rectangle(0, 0, Img.Width, Img.Height))[/highlight]

What it's do is that it fills a rectangle

Code:

       g.FillRectangle(Brushes.Blue, New Rectangle(0, 0, Img.Width, Img.Height))

with the color blue

Code:

       g.FillRectangle(Brushes.Blue, New Rectangle(0, 0, Img.Width, Img.Height))

on the coordinates of a new rectangle.

Code:

       g.FillRectangle(Brushes.Blue, New Rectangle(0, 0, 400, 400))

The rectangle starts at the top left corner

Code:

New Rectangle(0, 0, Img.Width, Img.Height)

and has the same size as the Image.

Code:

New Rectangle(0, 0, Img.Width, Img.Height)

All types in the above list works pretty much the same, so by using this you can draw filled forms to images. A good reason to use it is to create a background color as showed above as an example. An example on more then just filling the background can be viewed here below by I by this code:

[highlight=VB.NET] Dim Img As New Bitmap(400, 400)

Dim g As Graphics = Graphics.FromImage(Img)
g.FillRectangle(Brushes.Blue, New Rectangle(0, 0, Img.Width, Img.Height))
g.FillEllipse(Brushes.Yellow, New RectangleF(25, 25, 350, 350))
g.FillEllipse(Brushes.Black, New RectangleF(100, 75, 50, 50))
g.FillEllipse(Brushes.Black, New RectangleF(250, 75, 50, 50))
g.FillPie(Brushes.Black, New Rectangle(100, 150, 200, 200), 0, 180)
g.Dispose()[/highlight]

Creates this image:

Graphics in VB.NET Part 3 - Figures-smiley.jpg

Drawing figures

There also exists "Draw...", here we have few different types of them. We have 3 types DrawImage(for bitmaps), 2 types of DrawIcon(for icons) and DrawString(which is for strings) and then the rest is figures as the "Fills" were. However there's a lot more "Draw figures" then "Fill figures". The other different is that draw only draws the edge of the figure instead of filling it, this also means you have to replace brushes with pens, for example:

Code:

Pens.Blue

instead of

Code:

Brushes.Blue

To see the difference I've "converted" the above smiley example to use "Draws", like so:

[highlight=VB.NET] Dim Img As New Bitmap(400, 400)

Dim g As Graphics = Graphics.FromImage(Img)
'I had to do the background white to be able to see the iamge
g.FillRectangle(Brushes.White, New Rectangle(0, 0, Img.Width, Img.Height))

g.DrawRectangle(Pens.Blue, New Rectangle(0, 0, Img.Width, Img.Height))
g.DrawEllipse(Pens.Yellow, New RectangleF(25, 25, 350, 350))
g.DrawEllipse(Pens.Black, New RectangleF(100, 75, 50, 50))
g.DrawEllipse(Pens.Black, New RectangleF(250, 75, 50, 50))
g.DrawPie(Pens.Black, New Rectangle(100, 150, 200, 200), 0, 180)
g.Dispose()[/highlight]

Which then gives us this result:

Graphics in VB.NET Part 3 - Figures-smiley2.jpg

Note that I added one "Fill" to give the image a white background so we could see what it drew.

That was everything for this part, in the next one I'll show you how to draw a string to an image using graphics and DrawString.