使用自定义皮肤调整Flex火花控件的大小

Question

我在Catalyst中为TextInput火花控件制作了自定义外观。

问题是，在Flash Builder的设计视图中，我无法调整应用自定义外观的TextInput控件的大小。我希望只能调整TextInput的长度，使其保持相同的字体指标和皮肤比例，因此我可以对短，中，长TextInput使用相同的外观。

同样，在运行时期间，我想将控件停靠在父容器的右侧和/或底部，从而创建类似可调整大小的Web窗体。

我做了一个丑陋的，但简单TextInput外观的这个例子：

<?xml version="1.0" encoding="utf-8"?> 
<s:Skin xmlns:s="library://ns.adobe.com/flex/spark" xmlns:fx="http://ns.adobe.com/mxml/2009"> 
<fx:Metadata>[HostComponent(spark.components.TextInput)]</fx:Metadata> 
<s:states> 
     <s:State name="normal"/> 
     <s:State name="disabled"/> 
</s:states> 
<s:Group x="0" y="0"> 
     <s:Rect height="31" radiusX="5" width="182" x="0.5" y="0.5"> 
      <s:stroke> 
       <s:SolidColorStroke caps="none" color="#000000" joints="miter" miterLimit="4" weight="1"/> 
      </s:stroke> 
      <s:fill> 
       <s:SolidColor color="#FF90CD"/> 
      </s:fill> 
     </s:Rect> 
     <s:RichEditableText color="#2B4381" fontFamily="Arial" fontSize="12" tabStops="S0 S50 S100" x="11" y="11" width="161" heightInLines="1" id="textDisplay"/> 
</s:Group> 
</s:Skin> 

我首先想到的是，它是通过使用9分片进行，但找不到任何例子。

由于提前， 斯托

Answer 1

你需要改变你的定位/被明确到是相对于边缘施胶，这样的事情：

<?xml version="1.0" encoding="utf-8"?> 
<s:Skin xmlns:s="library://ns.adobe.com/flex/spark" xmlns:fx="http://ns.adobe.com/mxml/2009"> 
 <fx:Metadata>[HostComponent(spark.components.TextInput)]</fx:Metadata> 
 <s:states> 
      <s:State name="normal"/> 
      <s:State name="disabled"/> 
 </s:states> 
 <s:Rect left="0" right="0" top="0" bottom="0"> 
      <s:stroke> 
           <s:SolidColorStroke caps="none" color="#000000" joints="miter" miterLimit="4" weight="1"/> 
      </s:stroke> 
      <s:fill> 
           <s:SolidColor color="#FF90CD"/> 
      </s:fill> 
 </s:Rect> 
 <s:RichEditableText left="11" right="11" top="11" bottom="11" color="#2B4381" fontFamily="Arial" fontSize="12" tabStops="S0 S50 S100" heightInLines="1" id="textDisplay"/> 
</s:Skin> 

（我还没有编译或试过这个，只作为例子编辑。）