Drawing in .Net is actually quite simply due to the System.Drawing namespace. (Must be referenced into the project before tyring to use it! A simple mistake often overlooked!)
Normally a picture box is used for drawing custom shapes directly into a form, since it allows the location that the drawings will beto be modified by simply moving the picture box in the designer. However any control that has a Paint Method can be quite simply drawn on in the same way that i will demonstrate with the picture box! (Although drawing onto toolstrips and menu strips is best done through creating a new ToolStripRenderer class!)
The first stage is to get the designer to create a method for the painting of a picture box.
Below is the method for the paint event of the picture box.
(VB .NET)
Private Sub PictureBox1_Paint(ByVal sender As System.Object, ByVal e As System.Windows.Forms.PaintEventArgs) Handles PictureBox1.Paint
End Sub
(C#)
private void pictureBox1_Paint(object sender, PaintEventArgs e)
{
}
(C++/CLI)
private: System::Void pictureBox1_Paint(System::Object^ sender, System::Windows::Forms::PaintEventArgs^ e) {
}
From now on I shall use C# to demonstrate the rest of this drawing process. But I will put the final code in all 3 languages.
It is easiest if I show you line by line.
Pen p = new Pen(new SolidBrush(Color.Blue));
So, first we need to create a Pen to draw with. Here we create a pen pass it a SolidBrush which we have set to be blue.
Imagine a normal pen. The Solid Brush is like using an Ink Cartridge, it will always be the colour we set it (In this case blue)
We then fill the pen with the Ink Cartridge (The Solid Brush)
Other Brush types are:
- LinearGradientBrush – This allows you to have stripes
- HatchBrush – Allows Hatching
- TextureBrsuh – Allows textures such as images to be painted
The next step is to draw something.
e.Graphics.DrawLine(p, new Point(5, 5), new Point(20, 5));
This step uses e (The PaintEventArgs) .Graphics class
This allows us access to method such as the one we use here DrawLine.
DrawLine takes a reference to the Pen (p) a start point for the line and an end point for the line, (5,5) and (20,5) respectively, in the form (x coord, y coord). For those who haven’t used coordinates for a while: The x axis goes across horizontally. The Y axis goes vertically. With (0,0) being the top left of the control.
If you run it now you will get a line in blue going horizontally in the top-left corner of the picture box. It is not a very long line just 15 units long.
Try changing the start and end coordinates of the line and see what happens. And notice what happens to allow the line to go diagonally!
The next stage is to draw a rectangle. This is done using the DrawRectangle Method.
To do this we need to specify a rectangle to draw.
Rectangle rect = new Rectangle(5, 20, 15, 10);
This creates a new Rectangle rect and specifies in order:
- X Coordinate of the Top Left corner of the rectangle
- Y Coordinate of the Top Left corner of the rectangle
- The width of the rectangle
- The Height of the rectangle
Now we just use the DrawRectangle Method.
e.Graphics.DrawRectangle(p, rect);
Now hit F5 and sit back and admire the very small rectangle you have created.
Exit the form, and try changing the coordinates and dimensions of the rectangle.
Next time I shall demonstrate drawing more complex shapes and filling shapes with colour.
The Full Code
(VB .Net)
Private Sub PictureBox1_Paint(ByVal sender As System.Object, ByVal e As System.Windows.Forms.PaintEventArgs) Handles PictureBox1.Paint
Dim p As New Pen(New SolidBrush(Color.Blue))
e.Graphics.DrawLine(p, New Point(5, 5), New Point(20, 5))
Dim rect As New Rectangle(5, 20, 15, 10)
e.Graphics.DrawRectangle(p, rect)
End Sub
(C#)
private void pictureBox1_Paint(object sender, PaintEventArgs e)
{
Pen p = new Pen(new SolidBrush(Color.Blue));
e.Graphics.DrawLine(p, new Point(5, 5), new Point(20, 5));
Rectangle rect = new Rectangle(5, 20, 15, 10);
e.Graphics.DrawRectangle(p, rect);
}
(C++/CLI)
private: System::Void pictureBox1_Paint(System::Object^ sender, System::Windows::Forms::PaintEventArgs^ e) {
Pen ^p = gcnew Pen(gcnew SolidBrush(Color::Blue));
e->Graphics->DrawLine(p,System::Drawing::PointF(5,5),System::Drawing::Point(20,5));
Rectangle rect = Rectangle(5,20,15,10);
e->Graphics->DrawRectangle(p,rect);
}
Colorized by http://puzzleware.net/CodeHtmler/default.aspx
). This just leaves us to set the selected texts font.