Degrafa Dynamic Quadratic Bezier

This demo shows how to define a Degrafa quadratic Bezier in MXML without any control points.  The control points are graphically created via MXML components.  As the graphic markers are dragged, the actual Bezier control points are set via script.

Jason’s cool dashed-line decorator is used in another MXML component to draw the convex hull of the control points.

Defrafa Quadratic Bezier
Defrafa Quadratic Bezier

To use the demo, drag the ‘A’, ‘B’, and ‘C’ control points to alter the quadratic Bezier curve.  The MXML components in this demo will be used again in an upcoming discussion on arc length of the quad. Bezier.

View demo

View source

Note – I dumped everything in ‘view source’, so focus your attention on the src folder.  You will also want to download the Degrafa demo template (I did make some changes to the css file).


2 thoughts on “Degrafa Dynamic Quadratic Bezier

  1. awesome demo Jim! It would be cool to see the actual x0,y0,cx,cy,cx1,cy2,x1,y1 points being displayed.

    I like the (unintentional?) effect of the dashed line decorator animating when you click down on a control point.

  2. Tom – ‘A’ = (x0,y0), B = (cx,cy), and C = (x1,y1).

    The animating effect on the decorator is an artifact of that particular decorator – it is kind of cool 🙂


    – jim

Comments are closed.