Question

我有以下代码（textinput）。

<s:TextInput id="label"                                                             
   text="just testing" 
   width="100%" 
   height="200"
   contentBackgroundColor="#aaaaaa"
   styleName="normalText">
</s:TextInput>

我很难找到如何将文本（“只是测试”）对齐到顶部。我检查了Adobe文档，但似乎没有可用于此属性的垂直对齐属性。

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/mx/controls/TextInput.html

我意识到有一个textarea组件可用，但由于性能原因，我需要使用textinput。

topPadding似乎适用于mx

 <mx:TextInput 
  id="txt" 
  paddingTop="5" 
  text="I am Vertically aligned text" 
  textAlign="center" 
  width="250" 
  height="250">
</mx:TextInput>

任何提示都将不胜感激。

谢谢！

Answer 1

快速版

如果字体大小永远不变，只需使用paddingBottom即可。因为默认情况下，垂直对齐设置为middle，单独减少paddingTop不足以使文本充分移动;无论如何，它默认设置为1px。您还必须增加paddingBottom。我无法给出确切的数字：这取决于字体的大小，因此您必须稍微调整一下这些值。

<s:TextInput paddingBottom="6"/>

可重复使用的版本

如果您希望您的解决方案可以使用任何类型的字体重复使用，那么您必须为TextInput创建自定义外观。幸运的是，这并不太难：

找到spark.skins.spark.TextInputSkin
复制并给它一个新名称，比如my.skins.TopTextInputSkin
找到ID为RichEditableText的{{1}}代码（位于底部）
将其textDisplay属性设置为verticalAlign
应用新皮肤：top

如何在textinput（as3）中垂直对齐顶部？

1 个答案:

快速版

可重复使用的版本