Flex Examples
The following example shows how you can easily create a drop shadow effect on a TextInput control using the dropShadowEnabled style (instead of creating a DropShadowFilter), as well as control the drop shadow effect’s color, direction, and distance (using the dropShadowColor, shadowDirection, and shadowDistance styles, respectively).
Full code after the jump.
<?xml version="1.0" encoding="utf-8"?> <!-- http://blog.flexexamples.com/2007/08/30/creating-drop-shadows-on-the-flex-textinput-control/ --> <mx:Application name="TextInput_dropShadowEnabled_test" xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" backgroundColor="white"> <mx:ApplicationControlBar dock="true"> <mx:Grid> <mx:GridRow> <!-- dropShadowEnabled --> <mx:GridItem> <mx:CheckBox id="checkBox" label="dropShadowEnabled:" selected="true" labelPlacement="left" /> </mx:GridItem> <!-- dropShadowColor --> <mx:GridItem> <mx:Label text="dropShadowColor:" /> <mx:ColorPicker id="colorPicker" /> </mx:GridItem> </mx:GridRow> <mx:GridRow> <!-- shadowDirection --> <mx:GridItem> <mx:Label text="shadowDirection:" /> <mx:ComboBox id="comboBox" selectedIndex="1"> <mx:dataProvider> <mx:String>left</mx:String> <mx:String>center</mx:String> <mx:String>right</mx:String> </mx:dataProvider> </mx:ComboBox> </mx:GridItem> <!-- shadowDistance --> <mx:GridItem> <mx:Label text="shadowDistance:" /> <mx:HSlider id="slider" minimum="-10" maximum="10" value="2" liveDragging="true" snapInterval="1" tickInterval="1" dataTipPrecision="0" /> </mx:GridItem> </mx:GridRow> </mx:Grid> </mx:ApplicationControlBar> <mx:TextInput id="textInput" dropShadowEnabled="{checkBox.selected}" dropShadowColor="{colorPicker.selectedColor}" shadowDirection="{comboBox.selectedItem}" shadowDistance="{slider.value}" /> </mx:Application>
View source is enabled in the following example.
Peter deHaan
Peter deHaan currently works for Adobe on the Flex SDK QA team. While not working on Flex, Flash, and ColdFusion applications, Peter enjoys making up bios and writing in 3rd person. Peter's rarely updated blog can be found at blogs.adobe.com/pdehaan/, actionscriptexamples.com, airexamples.com, and coldfusionexamples.com.
Share
is there a way to change text input color dynamically?
@Anonymous,
You mean the text color itself? If so, then yes — you can set the
colorstyle to change the text color.Peter