Effects for TextArea letters (Flex) - actionscript-3

Question

How do I add effects (shadow, glow) to all letters in the component TextArea (Spark 4)?

Answer 1

I see it is an old question, but since i fell in the same problem today i'm posting my solution.
You can access to the RichEditableText component of the TextArea using textDisplay as stated here:
The RichEditableText can be accessed as textDisplay and the Scroller
as scroller
RichEditableText is extended from UIComponent, so filters, which can be applied to UIComponents ("You can apply filters to any visual component that is derived from UIComponent"), can be applied to it.
In order to apply, for example, a DropShadowFilter to all letters in the component myTextArea:TextArea i have used the following lines of code:
var richTextComponent:UIComponent = myTextArea.textDisplay as UIComponent;
var shadow:spark.filters.DropShadowFilter = new spark.filters.DropShadowFilter;
richTextComponent.filters = [shadow];
Hope this helps someone :-)

Answer 2

I don't think you can do it using Flex (or at least I never have). You would need to do it using AS3
<s:Label id="label1" text="Shadow Me" />
<fx:Script>
<![CDATA[
import flash.filters.*;
private function creationComplete():void{
var dropshadow:DropShadowFilter = new DropShadowFilter( 3,90,0x000000,.5,4,4,3,3 );
this.label1.filters = [ dropshadow ];
}
]]>
</fx:Script>

Answer 3

contentBackgroundAlpha="0" borderVisible="false"

Answer 4

By using Filter class we can apply shadow glow effect for a s:TextArea component. The sample code is:
<s:TextArea contentBackgroundAlpha="0" borderAlpha="0">
<s:filters>
<s:DropShadowFilter distance="5" angle="45" color="#666666"/>
</s:filters>
<s:content>
Testing text area content
</s:content>
</s:TextArea>
Refer the link http://www.roseindia.net/tutorial/flex/flex4/components/filters.html for applying more filters (DropShadowFilter, GlowFilter, BlurFilter and BevelFilter).

Answer 5

Just add a skin to your TextArea component then add a shadow to the RichEditableText inside the skin.
<fx:Declarations>
<s:DropShadowFilter id="shadow2"/>
</fx:Declarations>
<s:RichEditableText id="textDisplay" heightInLines="10" widthInChars="15" filters="{[shadow2]}"/>
It worked for me, you have just to adjust the shadow to have a nice look.