WPF Line, path ..etc Drawing style

Question

Hi

In WPF is there a way that you can modify the way any path is drawn APART from "Dash-Dot" sequences? Say I want draw a triple line for any path I am drawing or small triangles,waves..etc on the drawing path itself. I have tried Brushes but it will not follow the Path. Pl help

thx

Answer 1

There is no supported method for doing this in WPF. The solution is going to involve either composite Path objects or fancy code-behind gymnastics. Are you specificly looking for a triple-line path implementation?

Answer 2

WPF's Geometry classes have all the primitives you need to accomplish this easily, but you will need to do it in code. When I need to do custom lines I usually construct a Drawing based on the Geometry, but in your case you can simply build a Geometry that has three lines in parallel and stroke that.

1. Start with PathGeometry.CreateFromGeometry() to get a PathGeometry for the input path
2. Use GetWidenedPathGeometry(), passing in the desired spacing, to get a new geometry whose edges correspond to the side lines
3. (optional) Remove segments at the end of the widened geometry, if desired
4. Combine the side line geomerty with original geometry using a CombinedGeometry
5. Stroke the combined geometry to get a triple line

More explanation on step 3: The widened geometry has line segments at the end of the original line. This causes a line to be drawn across the end of your line, which actually looks aesthetically pleasing in many situations. If your situation would look better without it, remove it by iterating the side line geometry and removing all line segments that pass through the endpoints of the original path.

The above takes about 8 lines of code if you don't strike off the ends, or 15 if you do.

A trick to make this convenient is to create an attached property which effectively coerces the Data property of the Path control it is attached to. With such an attached property, all you need to write is:

<Path TripleStroke.Enable="true" Data="..." />

If you know how to implement attached properties and register handlers in them, this is a piece of cake. If not, plan on spending several hours learning how to code attached properties to simulate value coercion before implementing the attached property approach.

Update

The basic technique I describe above can also be extended to allow an arbitrary pattern to be applied along a path. For an example, see custom brushes in the Expression Design tool. There is nothing built into WPF to do this for you, however, so you'll need to create it yourself, and I can tell you from experience that it is a lot of work. Here are the basic steps:

First create a method that takes a Geometry an existing Drawing, and some parameters for end caps, etc and creates a new Drawing that repeats the given Drawing along the path given by the Geometry. Then it is easy to draw a stroked path: Create a Drawing to describe the custom stroke, then display the stroke using a DrawingVisual that contains a Binding with a converter that calls your conversion method.

To actually implement the conversion method:

1. Convert the source drawing into a set of GeometryDrawing objects (I also supported ImageDrawing but that is more complicated since you need to use the 3D system to stretch the images). This is done by recursing through DrawingGroup objects, keeping track of transforms as you go, and constructing GeometryDrawings with appropriate transform.
2. Remove portions of geometry in the "end cap" areas of the original drawing and set them aside.
3. Iterate along the path, duplicating the GeometryDrawing objects repeatedly with appropriate coordinate transformations applied to all coordinates in the geometry.
4. Process the "end cap" sections of the geometry using the same procedure.

Also note in step 1 that any GlyphRunDrawings are handled using FormattedText.BuildGeometry to create an equivalent GeometryDrawing.