Spark TextArea или RichText авторазмер

Question

Я много занимался поиском по этому вопросу, но, похоже, что я нахожу устаревшим или просто не похоже на работу.

С TextFields в прошлом, вы могли установить TextFieldдо определенной ширины, установите для wordWrap значение true, и в результате вы получите текстовое поле, которое изменило высоту в соответствии с добавленным текстом.

Теперь я пытаюсь сделать это с помощью Spark TextArea или RichText.

Я пробовал это HeightInLines = NAN, но это, кажется, устарело.

Я также пробовал эту процедуру:

var totalHeight:uint = 10;
this.validateNow();
var noOfLines:int = this.mx_internal::getTextField().numLines;
for (var i:int = 0; i < noOfLines; i++) 
{
     var textLineHeight:int = 
                     this.mx_internal::getTextField().getLineMetrics(i).height;
     totalHeight += textLineHeight;
}
this.height = totalHeight;

Но mx_internal отсутствует в компонентах Spark.

Я пытаюсь сделать это с AS3, а не с MXML.Если у кого-нибудь есть какие-либо предложения или ссылки, которые могут помочь мне понять это с помощью AS3, я был бы очень признателен.

Answer 1

Боролся с этим весь день. Но похоже, что компонент RichEditableText будет автоматически изменять размер, если вы установите его ширину и оставите его высоту неопределенной.

Answer 2

Это прекрасно работает:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:s="library://ns.adobe.com/flex/spark" 
    xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
    <s:TextArea updateComplete="event.currentTarget.heightInLines = NaN" />
</s:Application>

Найдено в комментариях здесь .Вы можете сделать то же самое в ActionScript, используя то же самое событие updateComplete.

Answer 3

Вы можете удалить скроллеры из скина TextArea, и он станет автоматически изменяемым. Вы можете скачать готовый скин здесь: http://www.yumasoft.com/node/126

Answer 4

Вот как я устанавливаю высоту TextArea, чтобы она соответствовала его содержимому при использовании внутри ItemRenderer (например, для компонента List):

private function onUpdateComplete( e: Event ): void
{
    // autoresize the text area
    if ( theText ) {
      var actualNumOfLines: int = theText.textFlow.flowComposer.numLines;
      theText.heightInLines = actualNumOfLines; 

      invalidateSize();
    }
}

ItemRenderer должен иметь это свойство установленным:

<s:ItemRenderer ... updateComplete="onUpdateComplete(event)>

Возможно, событие updateComplete не является оптимальным триггером для действий с автоматическим изменением размера, но у меня работает нормально.

Answer 5

Мне кажется, это работает:

<s:TextArea id="testTextArea"
            change="testTextArea_changeHandler(event)" 
            updateComplete="testTextArea_updateCompleteHandler(event)"/>

<fx:Script>
    <![CDATA[
        protected function testTextArea_changeHandler(event:TextOperationEvent):void
        {
            testTextArea.height = RichEditableText(testTextArea.textDisplay).contentHeight + 2;
        }

        protected function testTextArea_updateCompleteHandler(event:FlexEvent):void
        {
            testTextArea.height = RichEditableText(testTextArea.textDisplay).contentHeight + 2;
        }
    ]]>
</fx:Script>

Answer 6

Вот решение для текстовых областей с искрой (оно работает как текстовые области mx):

var ta_height:int;
for(var i:int=0; i < StyleableTextField(myTextArea.textDisplay).numLines; i++) {
        ta_height += StyleableTextField(myTextArea.textDisplay).getLineMetrics(i).height;
}
myTextArea.height = ta_height;

Answer 7

Делал ту же самую головку, что и Text: s, а затем обнаружил, что это выполняет работу:

<s:RichEditableText id="txtArea" left="0" right="0" backgroundColor="#F7F2F2"
                    change="textChanged()" />