Path In WPF

Introduction

A graphics path is a set of connected lines, curves, and other simple graphics objects, including rectangles, ellipses, and text. A path works as a single graphics object, so an effect applied to the graphics path will be applied to all the components of the path. For example, if a graphics path contains a line, a rectangle, and an ellipse and we draw the path using a red stroke, all three components (line, rectangle, and ellipse) of the graphics path will be drawn with the red stroke.

The Path object represents a path shape and draws a path. The Path object draws both closed and open paths. A closed path is a shape that has the same start and end points and an open path is a shape that has different start and end points.

The Fill property fills the interior of an ellipse. The Stroke property sets the color and StrokeThickness represents the width of the outer line of an ellipse.

The Data property of the Path object defines a shape or a collection of shapes in form of Geometry.

The following code snippet creates an arc shape using a path.

The output looks like Figure 8.

Figure 8

Before I discuss paths any further, we need to understand the Geometry class, its members, and its related classes.

Understanding Geometry

The Geometry class that defines the geometry of a shape plays a vital role in creating paths. This class cannot be used directly but used in the forms of its derived classes LineGeometry, RectangleGeometry, EllipseGeometry, GroupGeometry, PathGeometry, CombinedGeometry, and StreamGeometry. These geometry objects can be used for clipping, hit-testing, and rendering complex shapes.

The LineGeometry class represents the geometry of a line. The StartPoint and EndPoint properties of the LineGeometry class define the start and end points of a line. The following code snippet creates geometry of a line.

The RectangleGeometry class represents the geometry of a rectangle. The Rect property of the RectangleGeomerty defines the starting points, width, and height of a rectangle. The following code snippet creates geometry of a rectangle.

The EllipseGeometry class represents the geometry of an ellipse. The Center property of the EllipseGeomerty defines the center of an ellipse. The RadiusX and RadiusY define the width and height of an ellipse. The following code snippet creates geometry of an ellipse.

The GeometryGroup is creates a composite geometry that is a combination of multiple Geometry objects.

The code listed in Listing 8 creates a GeometryGroup with three geometry shapes – a line, an ellipse, and a rectangle and sets the Data property of a path.