Introduction
Well, if you are like me, you’ve wondered what the heck is GDI and what does it have to do with me? Personally, I’ve spent more than my fair share of time staring at MSDN going huh? Well, hopefully this tutorial will explain the basics of GDI, and how to use it in your VB.Net applications.

Some basic assumptions before starting this tutorial:

Basic knowledge of VB.Net syntax

Some knowledge of graphics in VB6 (as in enough to know what a line/shape control was) because I will be making some comparisons with them.

An open mind to .Net concepts

Well, I guess the first question is What Is GDI+? GDI+ stands for Graphic Device Interface. This is fancy-talk for a way to draw directly to forms or windows. (For the sake of this tutorial, we will be working with forms.)

Now how is GDI+ in .Net different than GDI in VB6? In .Net, it is much, much easier to work with GDI+. In VB6, GDI was a pain. Just looking at GDI tutorials can tell you this. I personally shied away from GDI in VB6, just out of fear. But with the advent of .Net, we programmers have a much easier way to deal with GDI, in the form of GDI+. I also should add that GDI+ is only available natively in .Net, as it is the System.Drawing.dll, but if you haven’t made the upgrade, you can use OnErr0r’s class wrappers, which you can find here and here. Also, you can also use GDI in .Net as well as GDI+. (But why would you want to? ).

The Namespaces Involved
Well, you can’t use GDI+ without declaring the namespaces. So, at the very top of the code window, you need to include the namespaces that you will need. They are:

System.Drawing – This contains the basic GDI classes. This part of the tutorial will focus on this.

Now we have our graphics object! We can do any thing we want such as use fonts, make pens/lines/paths/polygons, draw images and ellipses and so on! Here are some of the more common methods that we can use (don’t worry, most are really apparent):

Pens, DrawLine, Rectangles, Brushes, DrawRectangle, and FillRectangle
What is a Pen? A pen draws a line of specified width and style. I declare them as separate variables, but they can also be declared inside a line of code.

Code:

Dim pPen As Pen = New Pen(Color.Black, 4)

The first parameter is the color, you can change it by typing Color. The intellisense will pick up, and you will see a combo-box listing all the colors that you have available. The other thing you will probably use here is Color.FromARGB. This function will let you take an RGB value and use it as your color. The second parameter is the width of the pen. Simple enough, isn’t it?

The DrawLine method is as straightforward as it appears, but is really easy to use. Since .Net doesn’t include a line control as VB6 did, we have to draw our lines the same way. MSDN even recommends that we use a Label control to achieve the same effect (full article). However, this will only work with horizontal and vertical lines, and really isn’t a good method to start with. Well, here’s how to use it (I’m using the basic code from above, but only will include the OnPaint event:

The parameters here are again pretty explanatory. The first one is referencing our pen that we declared, while the last four are just the positions of the points of the line. They are X1, X2, Y1, Y2 respectively.

What is a Rectangle? In VB6 we had RECT, and it’s not that different in .Net. A Rectangle can be used for almost all of the System.Drawing methods, and I’ll just use Draw/Fill Rectangle in this tutorial. To declare a Rectangle:

Notice that the declare for it is similar to the declare for a pen; we have to declare it, then use the New sub to make it an object that we can use. Now that we have our rectangle what do we do? We can use the DrawRectangle to draw the outline of the rectangle.

We now have the outline of the rectangle. Our declare includes the pen (which is the color maroon), and the rectangle that we have just declared. You don’t need to declare the rectangle like this, but in my opinion, it just makes it easier to read.

What happens though, if we want to draw a filled rectangle? We can use the FillRectangle.

Woah! What’s this SolidBrush? If you read the parameter information provided by Intellisense/MSDN, you will see that we need a Brush. Well, what are brushes? Brushes are what we use to make fills. The ones we can get just from System.Drawing are SolidBrush and TextureBrush. The SolidBrush does what it says, it makes a solid brush of the color specified. The TextureBrush, however, uses a bitmap. Well now, it’s almost covered up our rectangle’s outline! What should we do to fix it? Just flip them, like so:

The Invalidate() Method and Its Practical Application
What is Invalidate()? Invalidate() will call the OnPaint event of the form again. This way, you can make an update on anything you have draw. Consider it as a way to redraw the form. Now what could one practical application of this be? How about a clock that is directly drawn onto the form? We can accomplish this with a timer created from System.Threading, and use the Invalidate() method every second.

All this does is create a timer and a callback. In the form load, I set the interval to 1000 milliseconds, so our timer will tick once each second. And, when it will Tick, we Invalidate() the form. If you run this code, you will see that it clears the form, and draws the new time on it. This lets us make a clock without any controls!

This seems like such a simple method, but can really be helpful whenever we need to make our form redraw itself. If you have any questions regarding this tutorial, or any technical issues arise, just contact me through the forum’s PM system, or if I happen to be online (MSN) then just feel free to talk to me there.

What are these pesky bitmaps? MSDN says it "encapsulates a GDI+ bitmap, which consists of the pixel data for a graphics image and its attributes." Now, if you are like me, you might be thinking, huh? Well, basically this means that you can store pixel data onto it. (And, by association, you could call a Bitmap a raster image.)
Now, how do we make a bitmap? It is rather simple, it's like any other variable:

Woah! What did we just do? We created a new bitmap (called bBackground) and set its content from the file background.bmp which can be found in the startup directory for our application. Now that we have our background Bitmap, what can we do with it? We can use the TextureBrush to apply a texture to our form!

Before we do that though, we will need to create a TextureBrush. Remember from Part 1 that SolidBrushes will let you create a brush that is a solid color. On the other hand, TextureBrushes let you create a brush that uses a Bitmap or an Image to fill something created by the graphics object. In the following example, I'll use the bBackground bitmap that we have already created to create a TextureBrush that contains background.bmp.

Code:

Dim bBGBrush As TextureBrush = New TextureBrush(bBackground)

Now we have our TextureBrush that is made from background.bmp, we can create a background texture for our form.

This seems really simple, but can produce stunning effects when you have a good background texture and apply it to the form using this method. Also, keep watching, as the next addition to this ongoing series will be on the Gradient Brushes.