CodeGuru content and product recommendations are editorially independent. We may make money when you click on links to our partners. Learn More.
Introduction
Since the implementation of the GraphicsPath class in .NET, life has become so much easier. The GraphicsPath class forms part of the System.Drawing.Drawing2D namespace. The definition on MSDN states that the GraphicsPath class represents a series of connected lines and curves. That doesn’t say much, unfortunately.
I will define the GraphicsPath class as follows: The name says it all. It is a path to be used with graphics. Graphics, in this case, mean any drawings, whether it be oddly shaped or a standard shape such as a Rectangle or Ellipse. The GraphicsPath class will enable you to follow a certain drawing’s path and manipulate it. A manipulation can be to fill the drawing with colors, to outline a shape with a darker borderline, or to be able to select a drawing (or part thereof) and move it, or delete it, or replace it.
A path can be composed of any number of sub paths (or figures). Each sub path can be a sequence of lines and curves that are connected or a geometric primitive. Common primitives in 2D and 3D drawing include points, line segments, planes, circles and ellipses, triangles, arbitrary polygons, spline curves, spheres, cubes or boxes, toroids, cylinders, pyramids, triangle meshes, or polygon meshes.
The GraphicsPath class has plenty of methods, but I will only demonstrate a few.
The AddArc Method
This method adds an elliptical arc to the figure to be used upon. Code like the following produces a drawing such as shown in Figure 1.
private void Form1_Paint(object sender, PaintEventArgs e)
{
GraphicsPath myPath = new GraphicsPath();
Rectangle rect = new Rectangle(100, 150, 70, 100);
myPath.StartFigure();
myPath.AddArc(rect, 0, 150);
myPath.CloseFigure();
e.Graphics.DrawPath(new Pen(Color.Blue, 2), myPath);
}
Figure 1: AddArc
The AddBezier Method
This method adds a Bezier curve to the path. This is shown with the code segment below as well in Figure 2.
private void Form1_Paint(object sender, PaintEventArgs e)
{
GraphicsPath myPath = new GraphicsPath();
myPath.StartFigure();
myPath.AddBezier(100, 100, 140, 0, 200, 240, 300, 100);
myPath.CloseFigure();
e.Graphics.DrawPath(new Pen(Color.Green, 2), myPath);
}
Figure 2: AddBezier
The AddClosedCurve Method
Adds a closed curve.
private void Form1_Paint(object sender, PaintEventArgs e)
{
Point[] myArray =
{
new Point(20,100),
new Point(40,150),
new Point(60,125),
new Point(40,100),
new Point(60,75),
new Point(40,50)
};
GraphicsPath myPath = new GraphicsPath();
myPath.AddClosedCurve(myArray, .3f);
Pen myPen = new Pen(Color.Orange, 2);
e.Graphics.DrawPath(myPen, myPath);
}
Figure 3: AddClosedCurve
The AddLines Method
Connects a sequence of lines, such as a triangle.
private void Form1_Paint(object sender, PaintEventArgs e)
{
Point[] myArray =
{
new Point(60,60),
new Point(120,120),
new Point(0,120),
new Point(60,60)
};
GraphicsPath myPath = new GraphicsPath();
myPath.AddLines(myArray);
Pen myPen = new Pen(Color.Pink, 3);
e.Graphics.DrawPath(myPen, myPath);
}
Figure 4: AddLines
The AddPie Method
Adds an outline pie shape to the path.
private void Form1_Paint(object sender, PaintEventArgs e)
{
GraphicsPath myPath = new GraphicsPath();
myPath.AddPie(40, 40, 140, 140, -45, 90);
Pen myPen = new Pen(Color.Black, 2);
e.Graphics.DrawPath(myPen, myPath);
}
Figure 5: AddPie
The Warp Method
Applies a warp transform to the path.
private void Form1_Paint(object sender, PaintEventArgs e)
{
GraphicsPath gPath = new GraphicsPath();
RectangleF srcRect = new RectangleF(0, 0, 200, 350);
gPath.AddRectangle(srcRect);
e.Graphics.DrawPath(Pens.Green, gPath);
PointF p1 = new PointF(200, 200);
PointF p2 = new PointF(400, 250);
PointF p3 = new PointF(240, 400);
PointF[] destPoints = { p1, p2, p3 };
Matrix tMatrix = new Matrix();
tMatrix.Translate(100, 0);
gPath.Warp(destPoints, srcRect, tMatrix,
WarpMode.Perspective, 0.5f);
e.Graphics.DrawPath(new Pen(Color.Red, 2), gPath);
}
Figure 6: Warp
The Widen Method
Replaces graphics path with curves which enclose filled areas.
private void Form1_Paint(object sender, PaintEventArgs e)
{
GraphicsPath myPath = new GraphicsPath();
myPath.AddEllipse(50, 50, 200, 200);
myPath.AddEllipse(200, 0, 200, 200);
e.Graphics.DrawPath(Pens.Purple, myPath);
Pen widenPen = new Pen(Color.Green, 10);
Matrix widenMatrix = new Matrix();
widenMatrix.Translate(100, 100);
myPath.Widen(widenPen, widenMatrix, 1.0f);
e.Graphics.FillPath(new SolidBrush(Color.Orange), myPath);
}
Figure 7: Widen
The Flatten Method
Converts all curves into a sequence of connected lines.
private void Form1_Paint(object sender, PaintEventArgs e)
{
GraphicsPath myPath = new GraphicsPath();
Matrix translateMatrix = new Matrix();
translateMatrix.Translate(0, 20);
Point point1 = new Point(40, 200);
Point point2 = new Point(140, 20);
Point point3 = new Point(260, 400);
Point point4 = new Point(360, 200);
Point[] points = { point1, point2, point3, point4 };
myPath.AddCurve(points);
e.Graphics.DrawPath(new Pen(Color.Yellow, 3), myPath);
myPath.Flatten(translateMatrix, 10f);
e.Graphics.DrawPath(new Pen(Color.Blue, 2), myPath);
}
Figure 8: Flatten
Conclusion
The GraphicsPath class is probably one of my favourite classes in the System.Drawing.Drawing2D namespace. As you can see, it is quite versatile and easy to work with. Keep playing with it, and you will discover even more nifty tricks.
