Graphics in VB.NET Part 3 - Figures

[Vswe]

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

1. Bitmaps
2. Graphics
3. Figures
4. 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:

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

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

with the color blue

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

on the coordinates of a new rectangle.

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

The rectangle starts at the top left corner

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

and has the same size as the Image.

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:







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:

Pens.Blue

instead of

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:


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.

[Jordan]

You created a smilie just like Chilies! Nice work. +rep

[WingedPanther]

Very cool! +rep

[chili5]

Very cool! Nice drawing. What does DrawPie do?

Your VB smilies can't beat my ActionScript smilies.

[Vswe]

It draws a half circle(the mouth). I didn't try to do it better, it was just an example

[arkanion]

i love VB