Flex textInput图角特效

Flex textInput图角特效原理其实比较简单，但是实现起来略微比较麻烦，为了减少查找internet的时候，我这里整理了项目中用到的方法。分享给大家，如下所示：

1. 首先编写皮肤类

<?xml version="1.0" encoding="utf-8"?>
<s:Skin
	xmlns:fx="http://ns.adobe.com/mxml/2009"
	xmlns:s="library://ns.adobe.com/flex/spark">
	
	<s:states>
		<s:State name="normal"/>
		<s:State name="disabled"/>
	</s:states>
	
	<!---@private -->
	<s:Rect id="border" left="0" right="0" top="0" bottom="0"
			radiusX="{getStyle('cornerRadius')}" radiusY="{getStyle('cornerRadius')}">
		<s:stroke>          
			<!---@private -->
			<s:SolidColorStroke id="borderStroke" color="{getStyle('borderColor')}"/>
		</s:stroke>
		<s:fill>
			<!---@private -->
			<s:SolidColor id="bgFill" color="{getStyle('contentBackgroundColor')}"/>
		</s:fill>
	</s:Rect>
</s:Skin>

2.在fx:style标签下申明：

.loginTextInput_4? ｛
    corner-radius:5; ?
?? ?borderStyle: solid; ?
?? ?borderSkin: ClassReference("cn.ac.iscas.gz.sems.skin.TextInputSkin");? 

｝

<mx:TextInput width="244" height="32" textAlign="left" 
										  styleName="loginTextInput_4"
										  id="userName" text="admin" color="white" focusInEffect="{glow}"   />