In the 2014.2 versions of our controls for the WPF, Silverlight, and WinRT/XAML platforms we've been adding several new shape controls to our Shared Library that can be very handy in setting up unique interfaces in your apps.
Yesterday's post examined the new Triangle shape. For today's post, we'll take a look at a new ZigZag shape that is coming in the next 2014.2 maintenance release.
The zig-zag shape renders straight lines that cross from one edge of the shape to the other, and back again. The apex side and the number of apexes to render can be specified. It's also possible to set whether the "inside" (fill) of the shape is inverted, or moved to the other side of the apexes.
Standard fill and stroke properties can be used to give the shape varied appearances. The example on the right above is particularly interesting because it shows how an "inverted" zig-zag provides the left side of the red ribbon. It is aligned next to a rectangle (behind the "New!") text, which allows it to generate a complex composited shape.
Zig-zag shapes are great for use when content requires a separator.
Instead of always using a linear horizontal or vertical rule to separate content, the zig-zag shape adds some variety to the user interface.
Although shapes like zig-zags are small primitive controls, they can be very helpful in creating modern interesting user interfaces that don't rely purely on squares and rectangles.