One of the first areas of Degrafa I started working on was a revamp of the current Repeater objects. Jason had some cool ideas on what we could do to make repeaters more concise, flexible, and powerful. After a couple of IM chats I had a reasonably good idea of what we wanted to accomplish and I rolled up my sleeves to see what I could do. You can see the most current rev in our
Dev branch at Google Code, although I suspect we will end up cleaning up some of the name spacing and move the new GeometryRepeater class somewhere else.
One of the challenges the current Degrafa Beta 2 suffers from is that we have a myriad of specific geometry repeater classes like Line, Circle, Rectangle, etc… Not only does this clutter up our core class libraries, but it is also much less flexible than it can be.
The new architecture we are developing takes a different approach, instead of creating gemoetry specific repeater classes we wanted to create an abstract repeater engine. This is accomplished through our GeometryRepeater class which inherits from Geometry and implements the IRepeaterModifier interface via its modifiers array. Okay, so what does this all mean?
1. You define the geometry you want repeated with any number of Degrafa geometry objects, which can be separate objects or complex compositions. You are no longer limited to the current repeater classes, but can easily repeat ANY Degrafa geometry you create.
2. You define HOW the geometry repeats via one or more IRepeaterModifiers. Initially we have created a PropertyModifier that allows you to target one or more geometry objects within your GeometryRepeater and an associated property you want to modify. You can have as many RepeaterModifiers as you want to create composited repetitions. Over time we may add additional core modifiers, or you can create your own by implementing the IRepeaterModifier interface.
Below you can see how one might implement a Circle repeater that repeats along a horizontal Axis:
<GeometryRepeater>
<Circle radius=”30″ centerX=”10″ centerY=”10)”/>
<modifiers>
<PropertyModifier property=”centerX” offset=”10″ offsetOperator=”add”/>
</modifiers>
</GeometryRepeater>
For a more complex example you can check out this demo that has view source enabled.
When you look at the demo you will see a simple circle geometry that is being repeated 30 times with multiple property modifiers being applied to it. If you look at the code there are some interesting things to note here about the PropertyModifier class.
1. We support targeting common properties across multiple targets via just one repeater like are doing here with the myCircle and myRect in the targets properties. We also support not only direct object properties, but also descendent properties via a dot notation (look at the property=”fill.alpha”) setting for example:
<PropertyModifier targets=”{[myCircle,myRect]}” property=”fill.alpha” offset=”.01″ offsetOperator=”add”/>
2. We support built in static operators as well as offset functions.
Not only can you provide static offset amounts (as in the example above) with fixed operators like add, subtract, or none you can also provide offsets as an array that will behave like a modulo function against the iteration number as in the radius modifier below. Additionally you can also provide offsets as dynamic functions as in the fill.color modifier that uses the custom colorOffset function found in the sample source files.
<PropertyModifier targets=”{[myCircle]}” property=”radius” offset=”[5,4,3,2,-2,-3,-4,-5]” offsetOperator=”add”/>
<PropertyModifier targets=”{[myCircle,myRect]}” property=”fill.color” offset=”{colorOffset}” offsetOperator=”add”/>
There are many more advanced features, but I will wait until we have pinned down the exact functionality for our Beta 3 release before delving into it further. Please check out the sample, and use view source to get an idea of what is possible.
This log scale also gets applied with the alert ranges, and the skin leverages the now public caclulateAngleFromValue() function exposed by the control itself – which takes into account the min/max value range, the min/max angle range, AND the linear or log scale. (code changes in control)
