Render handler introduction

Information for writing new render handlers.

The most important thing about drawing Flash shapes is to understand how their fill styles work. A single Flash character can contain any number shapes that use any number of different fill styles and line styles. The shapes of a character are defined by a number of "paths". Some important things about paths:

• A path is a list of connected straight lines and (quadratic bezier) curves (=edges). Interesting to note is that in the Flash world there are no primitive objects like circles, rectangles or similar. These objects are always translated to lines and curves (a circle is a set of eight curves).
• All paths together must by definition always build a fully closed shape. You can't draw a rectangle with three edges, for example, contrary to most graphics library polygon routines that connect the last anchor to the first. However, a single path does not have to be closed. The missing parts may be defined by other paths (you will see this makes sense).
• Each path has up to two fill styles and no or one line style. The line style should be obvious. The two fill styles define the fill to the left (fill style zero) and to the right (fill style one) of the path if you think of it like a vector. The fill style is defined by a index to a list of previously defined fill style definitions. Index 0 means "no style" and is equal to a fully transparent fill style ("hole", if you wish).

• Paths are never self-intersecting.

  Simple examples to understand this concept:

  • A rectangle that contains another rectangle. Only the area between the two rectangles is filled (so it looks like a "o"). In this case Flash fill create two paths (one for each rectangle) and one fill style. Assume both paths come in clockwise order, then the outer rectangle will have fillstyle0=0 and fillstyle1=1. The inner rectangle will have fillstyle0=1 and fillstyle1=0.

+--------------------------------+
|XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX|
|XXX+------------------------+XXX|
|XXX|                        |XXX|
|XXX+------------------------+XXX|
|XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX|
+--------------------------------+

• A rectangle is divided vertically in two halves, both having different colors:

+-------A-------+-------B--------+
|...............|################|
A...............C################B
|...............|################|
+-------A-------+-------B--------+

   Flash will probably produce three paths (A,B,C) and two fill styles.
   Paths "A" and "B" will have just one fill style (fillstyle1 will be 
   zero) while path "C" (which contains only one straight line!!) will
   have two fill styles. To be exact the horizontal edges would not even
   be necessary to render this shape (for a scanline based renderer) but 
   they are necessary then the character is about to be rotated.

Now, these are simple examples but complex graphics can be compressed very efficiently this way. Also, this method was most probably intended for a renderer engine that can produce the final character in just one pass (like the AGG backend does too).