Creating a solid color fill on a Spark Ellipse object in Flex 4

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/11/26/creating-a-solid-color-fill-on-an-ellipse-object-in-flex-gumbo/ -->
<s:Application name="Spark_Ellipse_fill_solidColor_test"
        xmlns:fx="http://ns.adobe.com/mxml/2009" 
        xmlns:s="library://ns.adobe.com/flex/spark" 
        xmlns:mx="library://ns.adobe.com/flex/mx">
    <s:controlBarContent>
        <mx:Form>
            <mx:FormItem label="color:">
                <mx:ColorPicker id="colorPicker" />
            </mx:FormItem>
            <mx:FormItem label="alpha:">
                <s:HSlider id="slider"
                        minimum="0.0"
                        maximum="1.0"
                        value="1.0"
                        snapInterval="0.1"
                        stepSize="0.1" />
            </mx:FormItem>
        </mx:Form>
    </s:controlBarContent>
 
    <s:Ellipse id="ellipse"
            width="300" height="200"
            horizontalCenter="0" verticalCenter="0">
        <s:fill>
            <s:SolidColor color="{colorPicker.selectedColor}"
                    alpha="{slider.value}" />
        </s:fill>
    </s:Ellipse>
 
</s:Application>

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/11/26/creating-a-solid-color-fill-on-an-ellipse-object-in-flex-gumbo/ -->
<s:Application name="Spark_Ellipse_fill_solidColor_test"
        xmlns:fx="http://ns.adobe.com/mxml/2009" 
        xmlns:s="library://ns.adobe.com/flex/spark" 
        xmlns:mx="library://ns.adobe.com/flex/mx">
 
    <fx:Script>
        <![CDATA[
            import mx.events.ColorPickerEvent;
 
            protected function colorPicker_changeHandler(evt:ColorPickerEvent):void {
                solidColor.color = evt.color;
            }
 
            protected function slider_changeHandler(evt:Event):void {
                solidColor.alpha = evt.currentTarget.value;
            }
        ]]>
    </fx:Script>
 
    <s:controlBarContent>
        <mx:Form>
            <mx:FormItem label="color:">
                <mx:ColorPicker id="colorPicker"
                        change="colorPicker_changeHandler(event);" />
            </mx:FormItem>
            <mx:FormItem label="alpha:">
                <s:HSlider id="slider"
                        minimum="0.0"
                        maximum="1.0"
                        value="1.0"
                        snapInterval="0.1"
                        stepSize="0.1"
                        change="slider_changeHandler(event);"/>
            </mx:FormItem>
        </mx:Form>
    </s:controlBarContent>
 
    <s:Ellipse id="ellipse"
            width="300" height="200"
            horizontalCenter="0" verticalCenter="0">
        <s:fill>
            <s:SolidColor id="solidColor" />
        </s:fill>
    </s:Ellipse>
 
</s:Application>

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/11/26/creating-a-solid-color-fill-on-an-ellipse-object-in-flex-gumbo/ -->
<s:Application name="Spark_Ellipse_fill_solidColor_test"
        xmlns:fx="http://ns.adobe.com/mxml/2009" 
        xmlns:s="library://ns.adobe.com/flex/spark" 
        xmlns:mx="library://ns.adobe.com/flex/mx"
        initialize="init();">
 
    <fx:Script>
        <![CDATA[
            import mx.containers.Form;
            import mx.containers.FormItem;
            import mx.controls.ColorPicker;
            import mx.events.ColorPickerEvent;
            import mx.graphics.SolidColor;
            import spark.components.HSlider;
            import spark.primitives.Ellipse;
 
            protected var colorPicker:ColorPicker;
            protected var slider:HSlider;
            protected var ellipse:Ellipse;
            protected var solidColor:SolidColor;
 
            protected function init():void {
                colorPicker = new ColorPicker();
                colorPicker.addEventListener(ColorPickerEvent.CHANGE, colorPicker_changeHandler);
 
                slider = new HSlider();
                slider.minimum = 0.0;
                slider.maximum = 1.0;
                slider.value = 1.0;
                slider.snapInterval = 0.1;
                slider.stepSize = 0.1;
                slider.addEventListener(Event.CHANGE, slider_changeHandler);
 
                var formItem1:FormItem = new FormItem();
                formItem1.label = "color:";
                formItem1.addElement(colorPicker);
 
                var formItem2:FormItem = new FormItem();
                formItem2.label = "alpha:";
                formItem2.addElement(slider);
 
                var form:Form = new Form();
                form.addElement(formItem1);
                form.addElement(formItem2);
 
                this.controlBarContent = [form];
 
                solidColor = new SolidColor(colorPicker.selectedColor, slider.value);
 
                ellipse = new Ellipse();
                ellipse.fill = solidColor;
                ellipse.width = 300;
                ellipse.height = 200;
                ellipse.horizontalCenter = 0;
                ellipse.verticalCenter = 0;
                addElement(ellipse);
            }
 
            protected function colorPicker_changeHandler(evt:ColorPickerEvent):void {
                solidColor.color = evt.color;
            }
 
            protected function slider_changeHandler(evt:Event):void {
                solidColor.alpha = evt.currentTarget.value;
            }
        ]]>
    </fx:Script>
 
</s:Application>