WPF/Silverlight has quite a nice syntax for defining paths in XAML. The documentation explaining the syntax is quite verbose, which is a good thing, but i wrote this post to provide an at-a-glance summary of the various components:
Letter | Description | Syntax | Example |
M | Move | M startPoint | M 0,0 |
L | Line | L endPoint | L 20,30 |
H | Horizontal line | H x-coordinate | H 90 |
V | Vertical line | V y-coordinate | V 90 |
C | Cubic Bezier curve | C controlPoint1 controlPoint2 endPoint | C 1,2 2,4 3,2 |
Q | Quadratic Bezier curve | Q controlPoint endPoint | Q 1,2 3,2 |
S | Smooth cubic Bezier curve | S controlPoint2 endPoint | S 1,2 3,2 |
T | Smooth quadratic Bezier curve | T controlPoint endPoint | T 1,2 3,2 |
A | Elliptical arc | A size rotationAngle isLargeArcFlag sweepDirectionFlag endPoint | A 2 40 1 1 2,2 |
Z | Close the current figure | Z | Z |
Notes
- When sequentially entering more than one command of the same type, you can omit the duplicate command entry, eg - L 100,200 300,400 is equivalent to L 100,200 L 300,400
- An uppercase command letter denotes absolute values
- A lowercase command letter denotes relative values: the control points for that segment are relative to the end point of the preceding example
- Instead of a standard numerical, you can also use the following special values: Infinity, –Infinity, NaN
- You may also use scientific notation, eg - +1.e17
No comments:
Post a Comment