Question

我有一个mx：TextArea，我希望它的高度与其内容高度相同。没有什么特别的 - 只是一个不可编辑的文本区域和文本。我需要一种简单可靠的方法来使控件适合并显示所有文本而不需要垂直滚动 - 就像自动调整大小一样。此外，我的控件的文本将只设置一次，不会更改，因为它不可编辑。

<mx:TextArea id="myTextArea"
             editable="false"
             width="100%"
             verticalScrollPolicy="off" >
   <mx:text>
      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id lorem 
      quis ante pulvinar auctor at eget risus. Nulla facilisi. Morbi ultricies 
      dignissim lorem, quis suscipit felis ullamcorper et.
   </mx:text>
</mx:TextArea>

在同一主题上还有一个帖子here，但它与我无关，因为它的设置更复杂，因为它包括样式和绑定。

Answer 1

使用textHeight的{{1}}只读属性，并将TextArea的高度设置为TextArea.textHeight + TextArea使用的任何垂直填充加上顶部和底部边框（检查TextArea组件并找出它们）。此过程应在您添加到TextArea的{{1}}事件的处理程序中进行。

Answer 2

如果您想坚持使用火花文本区域组件，请使用以下代码：

<s:TextArea 
   id="myTextArea"
   editable="false"
   width="100%"
   verticalScrollPolicy="off"
   change="myTextArea.height = myTextArea.scroller.viewport.contentHeight + 2;">
    <s:text>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id lorem 
        quis ante pulvinar auctor at eget risus. Nulla facilisi. Morbi ultricies 
        dignissim lorem, quis suscipit felis ullamcorper et.
    </s:text>
</s:TextArea>

或者您可以将更改处理程序放在函数中。

Answer 3

我在Jack Moore's Autosize script上取得了巨大的成功。它轻巧，只需一行即可在您的所有文本区域上实现：autosize($('.MyTextAreaClass'));

Answer 4

除了滚动政策之外，我建议使用“wordWrap ='true'”。

如何将TextArea高度设置为其内容高度

4 个答案: