The world of two-dimensional computer graphics is generally divided between vector graphics and raster graphics—a graphics of lines and a graphics of pixels—a graphics of draw programs and a graphics of paint programs—a graphics of cartoons and a graphics of photographs.
Vector graphics is the visual realization of analytic geometry. Two-dimensional coordinate points in the form (x, y) define straight lines and curves. In Silverlight, these curves can be arcs on the circumference of an ellipse
or Bezier curves, either in the customary cubic form or in a simplified
quadratic form. You can “stroke” these lines with a pen of a desired
brush, width, and style. A series of connected lines and curves can also
define an enclosed area that can be filled with a brush.
1. The Shapes Library
A Silverlight program that needs to draw vector graphics uses classes defined in the System.Windows.Shapes namespace, commonly referred to as the Shapes library. This namespace consists of an abstract class named Shape and six sealed classes that derive from Shape:
Object
DependencyObject (abstract)
FrameworkElement (abstract)
Shape (abstract)
Rectangle (sealed)
Ellipse (sealed)
Line (sealed)
Polyline (sealed)
Polygon (sealed)
Path (sealed)
The Shape class derives from FrameworkElement,
which means that these objects get touch input, participate in layout,
and can have transforms. In Silverlight there is insufficient
information to allow you to derive a class from Shape itself.
You’ve already seen Rectangle and Ellipse, but these are really two oddball classes in the realm of vector graphics because they don’t contain any coordinate points. You can just stick an Ellipse in a UserControl and it fills the whole control. You can size the element, but positioning it at an arbitrary point requires a Margin or Padding property, or a RenderTransform, or putting it on a Canvas and using the Left and Top attached properties.
The other four classes of Shape are different; these allow you to position the elements with actual coordinate points. Although I’ll discuss the Path class last, it is so versatile that it is pretty much the only class you need for all your vector graphics jobs. If you need to draw an arc or a Bezier spline, you’ll be using the Path class.
Shape defines 11 settable properties that are inherited by all its descendants:
Fill of type Brush
Stroke of type Brush
StrokeThickness of type double
StrokeStartLineCap and StrokeEndLineCap of type PenLineCap
StrokeLineJoin of type PenLineJoin
StrokeMiterLimit of type double
StrokeDashArray of type DoubleCollection
StrokeDashCap of type PenLineCap
StrokeDashOffset of type double
Stretch property of type Stretch
You’ve already seen the first three properties in connection with Rectangle and Ellipse. The Fill property specifies the Brush used to fill the interior of the figure; the Stroke property is the Brush used to color the outline of the figure, and StrokeThickness is the width of that outline.
All the other properties can be used with Rectangle and Ellipse as well. Although the two enumerations (PenLineCap and PenLineJoin) allude to a Pen, there is no Pen class in Silverlight. Conceptually, the properties beginning with the word Stroke together comprise an object traditionally regarded as a pen.