<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
		>
<channel>
	<title>Comments on: Setting the background fill color on a Halo TextArea control in Flex 4</title>
	<atom:link href="http://blog.flexexamples.com/2009/06/17/setting-the-background-fill-color-on-a-halo-textarea-control-in-flex-4/feed/" rel="self" type="application/rss+xml" />
	<link>http://blog.flexexamples.com/2009/06/17/setting-the-background-fill-color-on-a-halo-textarea-control-in-flex-4/</link>
	<description>Just a bunch of Adobe Flex Examples</description>
	<lastBuildDate>Sun, 12 Feb 2012 19:26:49 +0000</lastBuildDate>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
		<item>
		<title>By: Peter deHaan</title>
		<link>http://blog.flexexamples.com/2009/06/17/setting-the-background-fill-color-on-a-halo-textarea-control-in-flex-4/comment-page-1/#comment-6122</link>
		<dc:creator>Peter deHaan</dc:creator>
		<pubDate>Sat, 24 Oct 2009 23:07:10 +0000</pubDate>
		<guid isPermaLink="false">http://blog.flexexamples.com/2009/06/17/setting-the-background-fill-color-on-a-halo-textarea-control-in-flex-4/#comment-6122</guid>
		<description>Re-posted (and expanded) at &lt;a href=&quot;http://blog.flexexamples.com/2009/10/24/setting-a-gradient-background-fill-on-a-spark-textarea-control-in-flex-4/&quot; rel=&quot;nofollow&quot;&gt;&quot;Setting a gradient background fill on a Spark TextArea control in Flex 4&quot;&lt;/a&gt;.

Peter</description>
		<content:encoded><![CDATA[<p>Re-posted (and expanded) at <a href="http://blog.flexexamples.com/2009/10/24/setting-a-gradient-background-fill-on-a-spark-textarea-control-in-flex-4/" rel="nofollow">&#8220;Setting a gradient background fill on a Spark TextArea control in Flex 4&#8243;</a>.</p>
<p>Peter</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Peter deHaan</title>
		<link>http://blog.flexexamples.com/2009/06/17/setting-the-background-fill-color-on-a-halo-textarea-control-in-flex-4/comment-page-1/#comment-6120</link>
		<dc:creator>Peter deHaan</dc:creator>
		<pubDate>Sat, 24 Oct 2009 18:37:54 +0000</pubDate>
		<guid isPermaLink="false">http://blog.flexexamples.com/2009/06/17/setting-the-background-fill-color-on-a-halo-textarea-control-in-flex-4/#comment-6120</guid>
		<description>Re-posted at &lt;a href=&quot;http://blog.flexexamples.com/2009/10/24/setting-a-gradient-background-fill-on-a-halo-textarea-control-in-flex-4/&quot; rel=&quot;nofollow&quot;&gt;&quot;Setting a gradient background fill on a Halo TextArea control in Flex 4&quot;&lt;/a&gt;.

Peter</description>
		<content:encoded><![CDATA[<p>Re-posted at <a href="http://blog.flexexamples.com/2009/10/24/setting-a-gradient-background-fill-on-a-halo-textarea-control-in-flex-4/" rel="nofollow">&#8220;Setting a gradient background fill on a Halo TextArea control in Flex 4&#8243;</a>.</p>
<p>Peter</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Peter deHaan</title>
		<link>http://blog.flexexamples.com/2009/06/17/setting-the-background-fill-color-on-a-halo-textarea-control-in-flex-4/comment-page-1/#comment-6108</link>
		<dc:creator>Peter deHaan</dc:creator>
		<pubDate>Fri, 23 Oct 2009 17:47:38 +0000</pubDate>
		<guid isPermaLink="false">http://blog.flexexamples.com/2009/06/17/setting-the-background-fill-color-on-a-halo-textarea-control-in-flex-4/#comment-6108</guid>
		<description>And this is easy to do dynamically with the Spark TextArea (still trying to figure out how/if you can do this easily at runtime using ActionScript with the Halo/MX TextArea):
&lt;pre lang=&quot;mxml&quot;&gt;
&lt;?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;?&gt;
&lt;s:Application name=&quot;Spark_TextArea_skin_background_test&quot;
        xmlns:fx=&quot;http://ns.adobe.com/mxml/2009&quot;
        xmlns:s=&quot;library://ns.adobe.com/flex/spark&quot;
        xmlns:mx=&quot;library://ns.adobe.com/flex/halo&quot;&gt;
    &lt;s:controlBarContent&gt;
        &lt;s:Button id=&quot;btn&quot;
                label=&quot;Set TextArea background gradient&quot;
                click=&quot;btn_click(event);&quot; /&gt;
    &lt;/s:controlBarContent&gt;

    &lt;fx:Script&gt;
        &lt;![CDATA[
            import mx.graphics.GradientEntry;
            import mx.graphics.LinearGradient;
            import mx.utils.ObjectUtil;
            import spark.skins.spark.TextAreaSkin;

            protected function btn_click(evt:MouseEvent):void {
                var grad1:GradientEntry = new GradientEntry(0xFF0000);
                var grad2:GradientEntry = new GradientEntry(0xFF00FF);

                var linearGrad:LinearGradient = new LinearGradient();
                linearGrad.entries = [grad1, grad2];
                linearGrad.rotation = 90;

                TextAreaSkin(ta.skin).background.fill = linearGrad;
            }
        ]]&gt;
    &lt;/fx:Script&gt;

    &lt;s:TextArea id=&quot;ta&quot;
            text=&quot;The quick brown fox jumps over the lazy dog&quot;
            verticalScrollPolicy=&quot;on&quot;
            horizontalCenter=&quot;0&quot; verticalCenter=&quot;0&quot; /&gt;

&lt;/s:Application&gt; 
&lt;/pre&gt;

Peter</description>
		<content:encoded><![CDATA[<p>And this is easy to do dynamically with the Spark TextArea (still trying to figure out how/if you can do this easily at runtime using ActionScript with the Halo/MX TextArea):</p>

<div class="wp_syntax"><div class="code"><pre class="mxml" style="font-family:monospace;"><span style="color: #000000;">&lt;?xml version=<span style="color: #ff0000;">&quot;1.0&quot;</span> encoding=<span style="color: #ff0000;">&quot;utf-8&quot;</span>?<span style="color: #7400FF;">&gt;</span></span>
<span style="color: #000000;"><span style="color: #7400FF;">&lt;s:Application</span> name=<span style="color: #ff0000;">&quot;Spark_TextArea_skin_background_test&quot;</span></span>
<span style="color: #000000;">        xmlns:fx=<span style="color: #ff0000;">&quot;http://ns.adobe.com/mxml/2009&quot;</span></span>
<span style="color: #000000;">        xmlns:s=<span style="color: #ff0000;">&quot;library://ns.adobe.com/flex/spark&quot;</span></span>
<span style="color: #000000;">        xmlns:mx=<span style="color: #ff0000;">&quot;library://ns.adobe.com/flex/halo&quot;</span><span style="color: #7400FF;">&gt;</span></span>
    <span style="color: #000000;"><span style="color: #7400FF;">&lt;s:controlBarContent</span><span style="color: #7400FF;">&gt;</span></span>
        <span style="color: #000000;"><span style="color: #7400FF;">&lt;s:Button</span> id=<span style="color: #ff0000;">&quot;btn&quot;</span></span>
<span style="color: #000000;">                label=<span style="color: #ff0000;">&quot;Set TextArea background gradient&quot;</span></span>
<span style="color: #000000;">                click=<span style="color: #ff0000;">&quot;btn_click(event);&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
    <span style="color: #000000;"><span style="color: #7400FF;">&lt;/s:controlBarContent</span><span style="color: #7400FF;">&gt;</span></span>
&nbsp;
    <span style="color: #000000;"><span style="color: #7400FF;">&lt;fx:Script</span><span style="color: #7400FF;">&gt;</span></span>
        <span style="color: #000000;">&lt;!<span style="color: #66cc66;">&#91;</span>CDATA<span style="color: #66cc66;">&#91;</span></span>
<span style="color: #000000;">            import mx.graphics.GradientEntry;</span>
<span style="color: #000000;">            import mx.graphics.LinearGradient;</span>
<span style="color: #000000;">            import mx.utils.ObjectUtil;</span>
<span style="color: #000000;">            import spark.skins.spark.TextAreaSkin;</span>
&nbsp;
<span style="color: #000000;">            protected function btn_click<span style="color: #66cc66;">&#40;</span>evt:MouseEvent<span style="color: #66cc66;">&#41;</span>:void <span style="color: #66cc66;">&#123;</span></span>
<span style="color: #000000;">                var grad1:GradientEntry = new GradientEntry<span style="color: #66cc66;">&#40;</span>0xFF0000<span style="color: #66cc66;">&#41;</span>;</span>
<span style="color: #000000;">                var grad2:GradientEntry = new GradientEntry<span style="color: #66cc66;">&#40;</span>0xFF00FF<span style="color: #66cc66;">&#41;</span>;</span>
&nbsp;
<span style="color: #000000;">                var linearGrad:LinearGradient = new LinearGradient<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;</span>
<span style="color: #000000;">                linearGrad.entries = <span style="color: #66cc66;">&#91;</span>grad1, grad2<span style="color: #66cc66;">&#93;</span>;</span>
<span style="color: #000000;">                linearGrad.rotation = <span style="color: #cc66cc;">90</span>;</span>
&nbsp;
<span style="color: #000000;">                TextAreaSkin<span style="color: #66cc66;">&#40;</span>ta.skin<span style="color: #66cc66;">&#41;</span>.background.fill = linearGrad;</span>
<span style="color: #000000;">            <span style="color: #66cc66;">&#125;</span></span>
<span style="color: #000000;">        <span style="color: #66cc66;">&#93;</span><span style="color: #66cc66;">&#93;</span><span style="color: #7400FF;">&gt;</span></span>
    <span style="color: #000000;"><span style="color: #7400FF;">&lt;/fx:Script</span><span style="color: #7400FF;">&gt;</span></span>
&nbsp;
    <span style="color: #000000;"><span style="color: #7400FF;">&lt;s:TextArea</span> id=<span style="color: #ff0000;">&quot;ta&quot;</span></span>
<span style="color: #000000;">            text=<span style="color: #ff0000;">&quot;The quick brown fox jumps over the lazy dog&quot;</span></span>
<span style="color: #000000;">            verticalScrollPolicy=<span style="color: #ff0000;">&quot;on&quot;</span></span>
<span style="color: #000000;">            horizontalCenter=<span style="color: #ff0000;">&quot;0&quot;</span> verticalCenter=<span style="color: #ff0000;">&quot;0&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
&nbsp;
<span style="color: #000000;"><span style="color: #7400FF;">&lt;/s:Application</span><span style="color: #7400FF;">&gt;</span></span></pre></div></div>

<p>Peter</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Peter deHaan</title>
		<link>http://blog.flexexamples.com/2009/06/17/setting-the-background-fill-color-on-a-halo-textarea-control-in-flex-4/comment-page-1/#comment-6107</link>
		<dc:creator>Peter deHaan</dc:creator>
		<pubDate>Fri, 23 Oct 2009 15:47:54 +0000</pubDate>
		<guid isPermaLink="false">http://blog.flexexamples.com/2009/06/17/setting-the-background-fill-color-on-a-halo-textarea-control-in-flex-4/#comment-6107</guid>
		<description>@AV,

You can set a gradient Halo/MX TextArea background in Flex 4 by creating a custom border skin and setting a LinearGradient background fill, as seen in the following example:

&lt;pre lang=&quot;mxml&quot;&gt;
&lt;?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;?&gt;
&lt;s:Application name=&quot;Halo_TextArea_SparkSkin_background_test&quot;
        xmlns:fx=&quot;http://ns.adobe.com/mxml/2009&quot;
        xmlns:s=&quot;library://ns.adobe.com/flex/spark&quot;
        xmlns:mx=&quot;library://ns.adobe.com/flex/halo&quot;&gt;

    &lt;mx:TextArea id=&quot;ta&quot;
            text=&quot;{Capabilities.serverString}&quot;
            borderSkin=&quot;skins.TextAreaBorderSkin&quot;
            verticalScrollPolicy=&quot;on&quot;
            width=&quot;300&quot; height=&quot;200&quot;
            horizontalCenter=&quot;0&quot; verticalCenter=&quot;0&quot; /&gt;

&lt;/s:Application&gt;
&lt;/pre&gt;

And the custom border skin, &lt;em&gt;skins/TextAreaBorderSkin.mxml&lt;/em&gt;, is as follows:
&lt;pre lang=&quot;mxml&quot;&gt;
&lt;?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;?&gt;
&lt;local:SparkSkinForHalo name=&quot;TextAreaBorderSkin&quot;
        xmlns:fx=&quot;http://ns.adobe.com/mxml/2009&quot;
        xmlns:s=&quot;library://ns.adobe.com/flex/spark&quot;
        xmlns:local=&quot;mx.skins.spark.*&quot;
        implements=&quot;mx.core.IRectangularBorder&quot;&gt;

    &lt;fx:Script&gt;
        &lt;![CDATA[
            import mx.core.EdgeMetrics;
            import mx.core.IUIComponent;
            import mx.graphics.RectangularDropShadow;

            /* Define the skin elements that should not be colorized. */
            static private const exclusions:Array = [&quot;background&quot;];
            override public function get colorizeExclusions():Array {return exclusions;}

            /* Define the content fill items that should be colored by the &quot;contentBackgroundColor&quot; style. */
            static private const contentFill:Array = [];
            override public function get contentItems():Array {return contentFill};

            /* Define the border item. */
            static private const borderItem:Array = [&quot;borderStroke&quot;];
            override protected function get borderItems():Array {return borderItem;}
            override protected function get defaultBorderItemColor():uint {return getStyle(&quot;borderColor&quot;);}
            override protected function get defaultBorderAlpha():Number {return getStyle(&quot;borderAlpha&quot;);}

            static private const metrics:EdgeMetrics = new EdgeMetrics(1, 1, 1, 1);

            [Bindable]
            public var cornerRadius:Number = 0;

            private var dropShadow:RectangularDropShadow;

            public function get borderMetrics():EdgeMetrics {
                if (getStyle(&quot;borderVisible&quot;) == false &#124;&#124;
                    getStyle(&quot;borderStyle&quot;) == &quot;none&quot;) {
                    return EdgeMetrics.EMPTY
                }
                return metrics;
            }

            public function get backgroundImageBounds():Rectangle {
                return null;
            }

            public function set backgroundImageBounds(value:Rectangle):void {
            }

            public function get hasBackgroundImage():Boolean {
                return false;
            }

            public function layoutBackgroundImage():void {
            }

            override protected function initializationComplete():void {
                useBaseColor = true;
                super.initializationComplete();
            }

            override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {
                // Force a redraw to clear any existing shadow, and to force a redraw of the
                // border/background.
                redrawRequested = true;

                if (getStyle(&quot;borderVisible&quot;) == false &#124;&#124; getStyle(&quot;borderStyle&quot;) == &quot;none&quot;) {
                    border.visible = false;
                    background.left = background.top = background.right = background.bottom = 0;
                } else {
                    border.visible = true;
                    background.left = background.top = background.right = background.bottom = 1;
                }

                border.radiusX = cornerRadius;
                background.radiusX = cornerRadius;

                super.updateDisplayList(unscaledWidth, unscaledHeight);

                if (parent &amp;&amp; parent is IUIComponent &amp;&amp; !IUIComponent(parent).enabled) {
                    alpha = 0.5;
                } else {
                    alpha = 1;
                }

                // Draw drop shadow, if needed
                if (getStyle(&quot;dropShadowVisible&quot;) == false &#124;&#124; width == 0 &#124;&#124; height == 0) {
                    return;
                }

                // Create a RectangularDropShadow object, set its properties,
                // and draw the shadow
                if (!dropShadow) {
                    dropShadow = new RectangularDropShadow();
                }

                dropShadow.distance = 5;
                dropShadow.angle = 90;
                dropShadow.color = 0;
                dropShadow.alpha = 0.8;
                dropShadow.blurX = 20;
                dropShadow.blurY = 20;

                // Clear out any pending line style
                graphics.lineStyle();
                dropShadow.drawShadow(graphics, 0, 0, width, height);
            }

            private function getDropShadowAngle(distance:Number, direction:String):Number
            {
                if (direction == &quot;left&quot;) {
                    return distance &gt;= 0 ? 135 : 225;
                } else if (direction == &quot;right&quot;) {
                    return distance &gt;= 0 ? 45 : 315;
                } else { // direction == &quot;center&quot;
                    return distance &gt;= 0 ? 90 : 270;
                }
            }
        ]]&gt;
    &lt;/fx:Script&gt;

    &lt;!-- border --&gt;
    &lt;s:Rect left=&quot;0&quot; right=&quot;0&quot; top=&quot;0&quot; bottom=&quot;0&quot; radiusX=&quot;0&quot; id=&quot;border&quot;&gt;
        &lt;s:stroke&gt;
            &lt;s:SolidColorStroke id=&quot;borderStroke&quot; /&gt;
        &lt;/s:stroke&gt;
    &lt;/s:Rect&gt;

    &lt;!-- fill --&gt;
    &lt;s:Rect id=&quot;background&quot; left=&quot;1&quot; right=&quot;1&quot; top=&quot;1&quot; bottom=&quot;1&quot; radiusX=&quot;0&quot;&gt;
        &lt;s:fill&gt;
            &lt;s:LinearGradient rotation=&quot;90&quot;&gt;
                &lt;s:GradientEntry color=&quot;haloGreen&quot; /&gt;
                &lt;s:GradientEntry color=&quot;haloSilver&quot; /&gt;
            &lt;/s:LinearGradient&gt;
        &lt;/s:fill&gt;
    &lt;/s:Rect&gt;

&lt;/local:SparkSkinForHalo&gt;
&lt;/pre&gt;

Peter</description>
		<content:encoded><![CDATA[<p>@AV,</p>
<p>You can set a gradient Halo/MX TextArea background in Flex 4 by creating a custom border skin and setting a LinearGradient background fill, as seen in the following example:</p>

<div class="wp_syntax"><div class="code"><pre class="mxml" style="font-family:monospace;"><span style="color: #000000;">&lt;?xml version=<span style="color: #ff0000;">&quot;1.0&quot;</span> encoding=<span style="color: #ff0000;">&quot;utf-8&quot;</span>?<span style="color: #7400FF;">&gt;</span></span>
<span style="color: #000000;"><span style="color: #7400FF;">&lt;s:Application</span> name=<span style="color: #ff0000;">&quot;Halo_TextArea_SparkSkin_background_test&quot;</span></span>
<span style="color: #000000;">        xmlns:fx=<span style="color: #ff0000;">&quot;http://ns.adobe.com/mxml/2009&quot;</span></span>
<span style="color: #000000;">        xmlns:s=<span style="color: #ff0000;">&quot;library://ns.adobe.com/flex/spark&quot;</span></span>
<span style="color: #000000;">        xmlns:mx=<span style="color: #ff0000;">&quot;library://ns.adobe.com/flex/halo&quot;</span><span style="color: #7400FF;">&gt;</span></span>
&nbsp;
    <span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:TextArea</span> id=<span style="color: #ff0000;">&quot;ta&quot;</span></span>
<span style="color: #000000;">            text=<span style="color: #ff0000;">&quot;{Capabilities.serverString}&quot;</span></span>
<span style="color: #000000;">            borderSkin=<span style="color: #ff0000;">&quot;skins.TextAreaBorderSkin&quot;</span></span>
<span style="color: #000000;">            verticalScrollPolicy=<span style="color: #ff0000;">&quot;on&quot;</span></span>
<span style="color: #000000;">            width=<span style="color: #ff0000;">&quot;300&quot;</span> height=<span style="color: #ff0000;">&quot;200&quot;</span></span>
<span style="color: #000000;">            horizontalCenter=<span style="color: #ff0000;">&quot;0&quot;</span> verticalCenter=<span style="color: #ff0000;">&quot;0&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
&nbsp;
<span style="color: #000000;"><span style="color: #7400FF;">&lt;/s:Application</span><span style="color: #7400FF;">&gt;</span></span></pre></div></div>

<p>And the custom border skin, <em>skins/TextAreaBorderSkin.mxml</em>, is as follows:</p>

<div class="wp_syntax"><div class="code"><pre class="mxml" style="font-family:monospace;"><span style="color: #000000;">&lt;?xml version=<span style="color: #ff0000;">&quot;1.0&quot;</span> encoding=<span style="color: #ff0000;">&quot;utf-8&quot;</span>?<span style="color: #7400FF;">&gt;</span></span>
<span style="color: #000000;"><span style="color: #7400FF;">&lt;local:SparkSkinForHalo</span> name=<span style="color: #ff0000;">&quot;TextAreaBorderSkin&quot;</span></span>
<span style="color: #000000;">        xmlns:fx=<span style="color: #ff0000;">&quot;http://ns.adobe.com/mxml/2009&quot;</span></span>
<span style="color: #000000;">        xmlns:s=<span style="color: #ff0000;">&quot;library://ns.adobe.com/flex/spark&quot;</span></span>
<span style="color: #000000;">        xmlns:local=<span style="color: #ff0000;">&quot;mx.skins.spark.*&quot;</span></span>
<span style="color: #000000;">        implements=<span style="color: #ff0000;">&quot;mx.core.IRectangularBorder&quot;</span><span style="color: #7400FF;">&gt;</span></span>
&nbsp;
    <span style="color: #000000;"><span style="color: #7400FF;">&lt;fx:Script</span><span style="color: #7400FF;">&gt;</span></span>
        <span style="color: #000000;">&lt;!<span style="color: #66cc66;">&#91;</span>CDATA<span style="color: #66cc66;">&#91;</span></span>
<span style="color: #000000;">            import mx.core.EdgeMetrics;</span>
<span style="color: #000000;">            import mx.core.IUIComponent;</span>
<span style="color: #000000;">            import mx.graphics.RectangularDropShadow;</span>
&nbsp;
<span style="color: #000000;">            /* Define the skin elements that should not be colorized. */</span>
<span style="color: #000000;">            static private const exclusions:Array = <span style="color: #66cc66;">&#91;</span><span style="color: #ff0000;">&quot;background&quot;</span><span style="color: #66cc66;">&#93;</span>;</span>
<span style="color: #000000;">            override public function get colorizeExclusions<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:Array <span style="color: #66cc66;">&#123;</span>return exclusions;<span style="color: #66cc66;">&#125;</span></span>
&nbsp;
<span style="color: #000000;">            /* Define the content fill items that should be colored by the <span style="color: #ff0000;">&quot;contentBackgroundColor&quot;</span> style. */</span>
<span style="color: #000000;">            static private const contentFill:Array = <span style="color: #66cc66;">&#91;</span><span style="color: #66cc66;">&#93;</span>;</span>
<span style="color: #000000;">            override public function get contentItems<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:Array <span style="color: #66cc66;">&#123;</span>return contentFill<span style="color: #66cc66;">&#125;</span>;</span>
&nbsp;
<span style="color: #000000;">            /* Define the border item. */</span>
<span style="color: #000000;">            static private const borderItem:Array = <span style="color: #66cc66;">&#91;</span><span style="color: #ff0000;">&quot;borderStroke&quot;</span><span style="color: #66cc66;">&#93;</span>;</span>
<span style="color: #000000;">            override protected function get borderItems<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:Array <span style="color: #66cc66;">&#123;</span>return borderItem;<span style="color: #66cc66;">&#125;</span></span>
<span style="color: #000000;">            override protected function get defaultBorderItemColor<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:uint <span style="color: #66cc66;">&#123;</span>return getStyle<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;borderColor&quot;</span><span style="color: #66cc66;">&#41;</span>;<span style="color: #66cc66;">&#125;</span></span>
<span style="color: #000000;">            override protected function get defaultBorderAlpha<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:Number <span style="color: #66cc66;">&#123;</span>return getStyle<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;borderAlpha&quot;</span><span style="color: #66cc66;">&#41;</span>;<span style="color: #66cc66;">&#125;</span></span>
&nbsp;
<span style="color: #000000;">            static private const metrics:EdgeMetrics = new EdgeMetrics<span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;">1</span>, <span style="color: #cc66cc;">1</span>, <span style="color: #cc66cc;">1</span>, <span style="color: #cc66cc;">1</span><span style="color: #66cc66;">&#41;</span>;</span>
&nbsp;
<span style="color: #000000;">            <span style="color: #66cc66;">&#91;</span>Bindable<span style="color: #66cc66;">&#93;</span></span>
<span style="color: #000000;">            public var cornerRadius:Number = <span style="color: #cc66cc;">0</span>;</span>
&nbsp;
<span style="color: #000000;">            private var dropShadow:RectangularDropShadow;</span>
&nbsp;
<span style="color: #000000;">            public function get borderMetrics<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:EdgeMetrics <span style="color: #66cc66;">&#123;</span></span>
<span style="color: #000000;">                if <span style="color: #66cc66;">&#40;</span>getStyle<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;borderVisible&quot;</span><span style="color: #66cc66;">&#41;</span> == false ||</span>
<span style="color: #000000;">                    getStyle<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;borderStyle&quot;</span><span style="color: #66cc66;">&#41;</span> == <span style="color: #ff0000;">&quot;none&quot;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></span>
<span style="color: #000000;">                    return EdgeMetrics.EMPTY</span>
<span style="color: #000000;">                <span style="color: #66cc66;">&#125;</span></span>
<span style="color: #000000;">                return metrics;</span>
<span style="color: #000000;">            <span style="color: #66cc66;">&#125;</span></span>
&nbsp;
<span style="color: #000000;">            public function get backgroundImageBounds<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:Rectangle <span style="color: #66cc66;">&#123;</span></span>
<span style="color: #000000;">                return null;</span>
<span style="color: #000000;">            <span style="color: #66cc66;">&#125;</span></span>
&nbsp;
<span style="color: #000000;">            public function set backgroundImageBounds<span style="color: #66cc66;">&#40;</span>value:Rectangle<span style="color: #66cc66;">&#41;</span>:void <span style="color: #66cc66;">&#123;</span></span>
<span style="color: #000000;">            <span style="color: #66cc66;">&#125;</span></span>
&nbsp;
<span style="color: #000000;">            public function get hasBackgroundImage<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:Boolean <span style="color: #66cc66;">&#123;</span></span>
<span style="color: #000000;">                return false;</span>
<span style="color: #000000;">            <span style="color: #66cc66;">&#125;</span></span>
&nbsp;
<span style="color: #000000;">            public function layoutBackgroundImage<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:void <span style="color: #66cc66;">&#123;</span></span>
<span style="color: #000000;">            <span style="color: #66cc66;">&#125;</span></span>
&nbsp;
<span style="color: #000000;">            override protected function initializationComplete<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:void <span style="color: #66cc66;">&#123;</span></span>
<span style="color: #000000;">                useBaseColor = true;</span>
<span style="color: #000000;">                super.initializationComplete<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;</span>
<span style="color: #000000;">            <span style="color: #66cc66;">&#125;</span></span>
&nbsp;
<span style="color: #000000;">            override protected function updateDisplayList<span style="color: #66cc66;">&#40;</span>unscaledWidth:Number, unscaledHeight:Number<span style="color: #66cc66;">&#41;</span>:void <span style="color: #66cc66;">&#123;</span></span>
<span style="color: #000000;">                // Force a redraw to clear any existing shadow, and to force a redraw of the</span>
<span style="color: #000000;">                // border/background.</span>
<span style="color: #000000;">                redrawRequested = true;</span>
&nbsp;
<span style="color: #000000;">                if <span style="color: #66cc66;">&#40;</span>getStyle<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;borderVisible&quot;</span><span style="color: #66cc66;">&#41;</span> == false || getStyle<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;borderStyle&quot;</span><span style="color: #66cc66;">&#41;</span> == <span style="color: #ff0000;">&quot;none&quot;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></span>
<span style="color: #000000;">                    border.visible = false;</span>
<span style="color: #000000;">                    background.left = background.top = background.right = background.bottom = <span style="color: #cc66cc;">0</span>;</span>
<span style="color: #000000;">                <span style="color: #66cc66;">&#125;</span> else <span style="color: #66cc66;">&#123;</span></span>
<span style="color: #000000;">                    border.visible = true;</span>
<span style="color: #000000;">                    background.left = background.top = background.right = background.bottom = <span style="color: #cc66cc;">1</span>;</span>
<span style="color: #000000;">                <span style="color: #66cc66;">&#125;</span></span>
&nbsp;
<span style="color: #000000;">                border.radiusX = cornerRadius;</span>
<span style="color: #000000;">                background.radiusX = cornerRadius;</span>
&nbsp;
<span style="color: #000000;">                super.updateDisplayList<span style="color: #66cc66;">&#40;</span>unscaledWidth, unscaledHeight<span style="color: #66cc66;">&#41;</span>;</span>
&nbsp;
<span style="color: #000000;">                if <span style="color: #66cc66;">&#40;</span>parent &amp;&amp; parent is IUIComponent &amp;&amp; !IUIComponent<span style="color: #66cc66;">&#40;</span>parent<span style="color: #66cc66;">&#41;</span>.enabled<span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></span>
<span style="color: #000000;">                    alpha = <span style="color: #cc66cc;">0.5</span>;</span>
<span style="color: #000000;">                <span style="color: #66cc66;">&#125;</span> else <span style="color: #66cc66;">&#123;</span></span>
<span style="color: #000000;">                    alpha = <span style="color: #cc66cc;">1</span>;</span>
<span style="color: #000000;">                <span style="color: #66cc66;">&#125;</span></span>
&nbsp;
<span style="color: #000000;">                // Draw drop shadow, if needed</span>
<span style="color: #000000;">                if <span style="color: #66cc66;">&#40;</span>getStyle<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;dropShadowVisible&quot;</span><span style="color: #66cc66;">&#41;</span> == false || width == <span style="color: #cc66cc;">0</span> || height == <span style="color: #cc66cc;">0</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></span>
<span style="color: #000000;">                    return;</span>
<span style="color: #000000;">                <span style="color: #66cc66;">&#125;</span></span>
&nbsp;
<span style="color: #000000;">                // Create a RectangularDropShadow object, set its properties,</span>
<span style="color: #000000;">                // and draw the shadow</span>
<span style="color: #000000;">                if <span style="color: #66cc66;">&#40;</span>!dropShadow<span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></span>
<span style="color: #000000;">                    dropShadow = new RectangularDropShadow<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;</span>
<span style="color: #000000;">                <span style="color: #66cc66;">&#125;</span></span>
&nbsp;
<span style="color: #000000;">                dropShadow.distance = <span style="color: #cc66cc;">5</span>;</span>
<span style="color: #000000;">                dropShadow.angle = <span style="color: #cc66cc;">90</span>;</span>
<span style="color: #000000;">                dropShadow.color = <span style="color: #cc66cc;">0</span>;</span>
<span style="color: #000000;">                dropShadow.alpha = <span style="color: #cc66cc;">0.8</span>;</span>
<span style="color: #000000;">                dropShadow.blurX = <span style="color: #cc66cc;">20</span>;</span>
<span style="color: #000000;">                dropShadow.blurY = <span style="color: #cc66cc;">20</span>;</span>
&nbsp;
<span style="color: #000000;">                // Clear out any pending line style</span>
<span style="color: #000000;">                graphics.lineStyle<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;</span>
<span style="color: #000000;">                dropShadow.drawShadow<span style="color: #66cc66;">&#40;</span>graphics, <span style="color: #cc66cc;">0</span>, <span style="color: #cc66cc;">0</span>, width, height<span style="color: #66cc66;">&#41;</span>;</span>
<span style="color: #000000;">            <span style="color: #66cc66;">&#125;</span></span>
&nbsp;
<span style="color: #000000;">            private function getDropShadowAngle<span style="color: #66cc66;">&#40;</span>distance:Number, direction:String<span style="color: #66cc66;">&#41;</span>:Number</span>
<span style="color: #000000;">            <span style="color: #66cc66;">&#123;</span></span>
<span style="color: #000000;">                if <span style="color: #66cc66;">&#40;</span>direction == <span style="color: #ff0000;">&quot;left&quot;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></span>
<span style="color: #000000;">                    return distance <span style="color: #7400FF;">&gt;</span></span>= 0 ? 135 : 225;
                } else if (direction == &quot;right&quot;) {
                    return distance &gt;= 0 ? 45 : 315;
                } else { // direction == &quot;center&quot;
                    return distance &gt;= 0 ? 90 : 270;
                }
            }
        ]]&gt;
    <span style="color: #000000;"><span style="color: #7400FF;">&lt;/fx:Script</span><span style="color: #7400FF;">&gt;</span></span>
&nbsp;
    <span style="color: #000000;"><span style="color: #808080; font-style: italic;">&lt;!-- border --&gt;</span></span>
    <span style="color: #000000;"><span style="color: #7400FF;">&lt;s:Rect</span> left=<span style="color: #ff0000;">&quot;0&quot;</span> right=<span style="color: #ff0000;">&quot;0&quot;</span> top=<span style="color: #ff0000;">&quot;0&quot;</span> bottom=<span style="color: #ff0000;">&quot;0&quot;</span> radiusX=<span style="color: #ff0000;">&quot;0&quot;</span> id=<span style="color: #ff0000;">&quot;border&quot;</span><span style="color: #7400FF;">&gt;</span></span>
        <span style="color: #000000;"><span style="color: #7400FF;">&lt;s:stroke</span><span style="color: #7400FF;">&gt;</span></span>
            <span style="color: #000000;"><span style="color: #7400FF;">&lt;s:SolidColorStroke</span> id=<span style="color: #ff0000;">&quot;borderStroke&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
        <span style="color: #000000;"><span style="color: #7400FF;">&lt;/s:stroke</span><span style="color: #7400FF;">&gt;</span></span>
    <span style="color: #000000;"><span style="color: #7400FF;">&lt;/s:Rect</span><span style="color: #7400FF;">&gt;</span></span>
&nbsp;
    <span style="color: #000000;"><span style="color: #808080; font-style: italic;">&lt;!-- fill --&gt;</span></span>
    <span style="color: #000000;"><span style="color: #7400FF;">&lt;s:Rect</span> id=<span style="color: #ff0000;">&quot;background&quot;</span> left=<span style="color: #ff0000;">&quot;1&quot;</span> right=<span style="color: #ff0000;">&quot;1&quot;</span> top=<span style="color: #ff0000;">&quot;1&quot;</span> bottom=<span style="color: #ff0000;">&quot;1&quot;</span> radiusX=<span style="color: #ff0000;">&quot;0&quot;</span><span style="color: #7400FF;">&gt;</span></span>
        <span style="color: #000000;"><span style="color: #7400FF;">&lt;s:fill</span><span style="color: #7400FF;">&gt;</span></span>
            <span style="color: #000000;"><span style="color: #7400FF;">&lt;s:LinearGradient</span> rotation=<span style="color: #ff0000;">&quot;90&quot;</span><span style="color: #7400FF;">&gt;</span></span>
                <span style="color: #000000;"><span style="color: #7400FF;">&lt;s:GradientEntry</span> color=<span style="color: #ff0000;">&quot;haloGreen&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
                <span style="color: #000000;"><span style="color: #7400FF;">&lt;s:GradientEntry</span> color=<span style="color: #ff0000;">&quot;haloSilver&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
            <span style="color: #000000;"><span style="color: #7400FF;">&lt;/s:LinearGradient</span><span style="color: #7400FF;">&gt;</span></span>
        <span style="color: #000000;"><span style="color: #7400FF;">&lt;/s:fill</span><span style="color: #7400FF;">&gt;</span></span>
    <span style="color: #000000;"><span style="color: #7400FF;">&lt;/s:Rect</span><span style="color: #7400FF;">&gt;</span></span>
&nbsp;
<span style="color: #000000;"><span style="color: #7400FF;">&lt;/local:SparkSkinForHalo</span><span style="color: #7400FF;">&gt;</span></span></pre></div></div>

<p>Peter</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: AV</title>
		<link>http://blog.flexexamples.com/2009/06/17/setting-the-background-fill-color-on-a-halo-textarea-control-in-flex-4/comment-page-1/#comment-6106</link>
		<dc:creator>AV</dc:creator>
		<pubDate>Fri, 23 Oct 2009 14:42:24 +0000</pubDate>
		<guid isPermaLink="false">http://blog.flexexamples.com/2009/06/17/setting-the-background-fill-color-on-a-halo-textarea-control-in-flex-4/#comment-6106</guid>
		<description>Hi Peter..

How to apply gradient background colors dynamically to the Halo TextArea?</description>
		<content:encoded><![CDATA[<p>Hi Peter..</p>
<p>How to apply gradient background colors dynamically to the Halo TextArea?</p>
]]></content:encoded>
	</item>
</channel>
</rss>

