<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" backgroundGradientColors="[#ffffff, #ffffff]"
backgroundColor="0xffffff" viewSourceURL="srcview/index.html">
<mx:Script>
<![CDATA[
import com.wordpress.ricoonflex.CustomShape;
import mx.controls.ColorPicker;
private var colors:Array = [0x65C9E0, 0xEDF69C, 0xEC9D34, 0xA0CE28, 0xBEDB3D, 0xDC7A2B,
0x938E6E, 0xF0F2B7, 0x2F2B22, 0xFDC53D, 0x635D49, 0xF9F181];
private const TIMER_DELAY:uint = 25;
private function createRandomShape(target:Canvas):void {
var colorIndex:uint = Math.random() * (colors.length);
colorIndex = Math.round(colorIndex);
var wh:uint = Math.random() * (sizeSlider.values[1] - sizeSlider.values[0]);
wh = Math.round(wh) + sizeSlider.values[0];
var x:uint = Math.random() * target.width;
x = Math.round(x);
var y:uint = Math.random() * target.height;
y = Math.round(y);
var rot:uint = Math.random() * 180;
var a:Number = Math.random() * (alphaSlider.values[1] - alphaSlider.values[0]);
a = alphaSlider.values[0] + Math.round(a);
var color:uint = ColorPicker(colorsCanvas.getChildAt(colorIndex)).selectedColor;
var scolor:uint = strokeColor.selectedColor;
var sthickness:Number = Math.random() * (strokeThickness.values[1] - strokeThickness.values[0]);
sthickness = strokeThickness.values[0] + Math.round(sthickness);
var salpha:Number = Math.random() * (strokeAlpha.values[1] - strokeAlpha.values[0]);
salpha = strokeAlpha.values[0] + Math.round(salpha);
var c:CustomShape = new CustomShape();
if (addCustomShapes.selected) {
var shapes:Array = [CustomShape.CUSTOM_SHAPE, CustomShape.ROUND_RECT];
var randShapeIndex:Number = Math.random() * shapes.length;
randShapeIndex = Math.round(randShapeIndex);
if (customShapesOnly.selected) {
c.draw(CustomShape.CUSTOM_SHAPE, wh, wh, color, a/100, scolor, sthickness, salpha/100);
} else {
c.draw(shapes[randShapeIndex], wh, wh, color, a/100, scolor, sthickness, salpha/100);
}
} else {
c.draw(CustomShape.ROUND_RECT, wh, wh, color, a/100, scolor, sthickness, salpha/100);
}
shapesHolder.addChild(c);
c.move(x + target.x, y + target.y);
c.rotation = rot;
}
private function generate(shapes:uint):void {
var t:Timer = new Timer(TIMER_DELAY, shapes);
t.addEventListener(TimerEvent.TIMER, function():void {
createRandomShape(canvas1);
createRandomShape(canvas2);
createRandomShape(canvas3);
});
t.start();
}
private function clear():void {
shapesHolder.removeAllChildren();
}
private function reset():void {
sizeSlider.values = [45, 95];
alphaSlider.values = [20, 100];
numShapes.value = 20;
showBoundingBox.selected = true;
addCustomShapes.selected = true;
customShapesOnly.selected = false;
for (var i:uint = 0; i < colors.length; i++) {
ColorPicker(colorsCanvas.getChildAt(i)).selectedColor = colors[i];
}
strokeColor.selectedColor = 0x2f2b22;
strokeAlpha.values = [25, 30];
strokeThickness.values = [1, 2];
}
]]>
</mx:Script>
<mx:Canvas x="0" y="0" width="100%" height="100%" id="shapesHolder" horizontalScrollPolicy="off" verticalScrollPolicy="off"/>
<mx:Canvas width="200" height="200" id="canvas1" clipContent="false" buttonMode="true" x="374" y="391"
borderColor="#c0c0c0" borderStyle="solid" visible="{showBoundingBox.selected}"
mouseDown="canvas1.startDrag()" mouseUp="canvas1.stopDrag()"/>
<mx:Canvas width="150" height="150" id="canvas2" clipContent="false" buttonMode="true" x="561" y="254"
borderColor="#c0c0c0" borderStyle="solid" visible="{showBoundingBox.selected}"
mouseDown="canvas2.startDrag()" mouseUp="canvas1.stopDrag()"/>
<mx:Canvas width="222" height="75" id="canvas3" clipContent="false" buttonMode="true" x="702" y="189"
borderColor="#c0c0c0" borderStyle="solid" visible="{showBoundingBox.selected}"
mouseDown="canvas3.startDrag()" mouseUp="canvas1.stopDrag()"/>
<mx:Panel x="10" y="10" width="250" height="650" layout="absolute" title="Customize Your Artwork">
<mx:Label x="10" y="8" text="Shape Size" fontWeight="bold"/>
<mx:HRule x="10" y="24" width="210"/>
<mx:HSlider x="10" y="34" thumbCount="2" minimum="10" maximum="200" values="[45, 95]" id="sizeSlider"
snapInterval="1" tickInterval="19" height="28" width="210"/>
<mx:Label x="10" y="79" text="Fill Alpha" fontWeight="bold"/>
<mx:HRule x="10" y="95" width="210"/>
<mx:HSlider x="10" y="105" thumbCount="2" minimum="10" maximum="100" values="[20, 100]" id="alphaSlider"
snapInterval="1" tickInterval="10" height="28" width="210"/>
<mx:Label x="10" y="149" text="Number of Shapes" fontWeight="bold"/>
<mx:HRule x="10" y="165" width="210"/>
<mx:HSlider x="10" y="175" minimum="1" maximum="200" values="20" id="numShapes"
snapInterval="1" tickInterval="10" height="28" width="210"/>
<mx:CheckBox x="10" y="211" label="Add Custom Shapes" selected="true" id="addCustomShapes"/>
<mx:CheckBox x="10" y="254" label="Custom Shapes Only (no circles)" selected="false" id="customShapesOnly"
visible="{addCustomShapes.selected}"/>
<mx:CheckBox x="10" y="280" label="Show Boxes" selected="true" id="showBoundingBox"/>
<mx:Label x="10" y="313" text="Colors" fontWeight="bold"/>
<mx:HRule x="10" y="329" width="210"/>
<mx:Canvas x="10" y="339" width="210" height="60" id="colorsCanvas" creationComplete="reset()">
<mx:ColorPicker x="0" y="0"/>
<mx:ColorPicker x="30" y="0"/>
<mx:ColorPicker x="60" y="0"/>
<mx:ColorPicker x="90" y="0"/>
<mx:ColorPicker x="120" y="0"/>
<mx:ColorPicker x="150" y="0"/>
<mx:ColorPicker x="0" y="30"/>
<mx:ColorPicker x="30" y="30"/>
<mx:ColorPicker x="60" y="30"/>
<mx:ColorPicker x="90" y="30"/>
<mx:ColorPicker x="120" y="30"/>
<mx:ColorPicker x="150" y="30"/>
</mx:Canvas>
<mx:Label x="10" y="423" text="Stroke" fontWeight="bold"/>
<mx:HRule x="10" y="439" width="210"/>
<mx:Label x="151" y="449" text="Color:"/>
<mx:ColorPicker x="198" y="449" id="strokeColor" selectedColor="#2f2b22"/>
<mx:Label x="10" y="449" text="Thickness:"/>
<mx:HSlider x="10" y="474" thumbCount="2" minimum="0" maximum="10" values="[1, 2]" id="strokeThickness"
snapInterval="1" tickInterval="1" height="28" width="210"/>
<mx:Label x="8" y="510" text="Alpha:"/>
<mx:HSlider x="10" y="536" thumbCount="2" minimum="10" maximum="100" values="[25, 30]" id="strokeAlpha"
snapInterval="1" tickInterval="10" height="28" width="210"/>
<mx:Label x="9" y="228" text="(Uncheck this to draw circles only)" fontSize="9" color="#c0c0c0"/>
<mx:ControlBar horizontalAlign="center">
<mx:Button x="10" y="154" label="Generate" click="generate(numShapes.value)"/>
<mx:Button x="97" y="154" label="Clear" click="clear()"/>
<mx:Button x="97" y="154" label="Reset" click="reset()"/>
</mx:ControlBar>
</mx:Panel>
<mx:Label x="268" y="10" text="The boxes are used for positioning the objects."/>
</mx:Application>