TextArea используется как itemEditor неправильно себя ведет при нажатии клавиши ввода

Question

У меня есть TextArea внутри компонента itemEditor, проблема в том, что при вводе текста в TextArea, если нажата клавиша ввода, itemEditor сбрасывает себя, скорее всего перемещая курсор на следующую строку, как и ожидалось:

  <mx:List width="100%" editable="true" >

    <mx:dataProvider>
      <mx:ArrayCollection>
        <mx:Array>
          <mx:Object title="Stairway to Heaven" />
        </mx:Array>
      </mx:ArrayCollection>
    </mx:dataProvider>

    <mx:itemRenderer>
      <mx:Component>
        <mx:Text height="100" text="{data.title}"/>
      </mx:Component>                       
    </mx:itemRenderer>

    <mx:itemEditor>
      <mx:Component>
        <mx:TextArea height="100" text="{data.title}"/>
      </mx:Component>                       
    </mx:itemEditor>

  </mx:List>

</mx:Application>

Может ли кто-нибудь посоветовать, как мне обойти это странное поведение и заставить клавишу ввода работать так, как ожидалось?

Спасибо

Chris

Answer 1

Хитрость заключается в том, чтобы прослушивать событие ITEM_EDIT_END и предотвращать поведение списка по умолчанию, если причиной является NEW_ROW. Смотрите пример ниже:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" applicationComplete="onComplete();">
    <mx:Script><![CDATA[
        import mx.events.ListEvent;
        import mx.events.ListEventReason;
        import mx.controls.TextArea;

        private function onComplete():void
        {
            list.addEventListener(ListEvent.ITEM_EDIT_END, onEndEdit);
        }
        private function onEndEdit(e:ListEvent):void
        {
            if (e.reason == ListEventReason.NEW_ROW)
                e.preventDefault();
            else
                list.editedItemRenderer.data.title = TextArea(e.currentTarget.itemEditorInstance).text;
        }
    ]]></mx:Script>
    <mx:List width="100%" editable="true" id="list">

        <mx:dataProvider>
            <mx:Object title="Stairway to Heaven" />
        </mx:dataProvider>

        <mx:itemRenderer>
            <mx:Component>
                <mx:Text height="100" text="{data.title}"/>
            </mx:Component>                       
        </mx:itemRenderer>

        <mx:itemEditor>
            <mx:Component>
                <mx:TextArea height="100" text="{data.title}"/>
            </mx:Component>                       
        </mx:itemEditor>

    </mx:List>

</mx:Application>

Answer 2

Думаю, вы можете использовать «editorUsesEnterKey» List.as (строка 544 Flex3.5)

Флаг, указывающий, использует ли редактор элементов клавишу ввода.

Answer 3

Похоже, что нажатие клавиши [enter] обрабатывается функцией списков по умолчанию, а не средствами визуализации элементов. Не уверен, какой именно код это исправить, но я думаю, вам нужно будет расширить элемент управления списком, который бы отключал функцию, когда пользователь нажимает [enter]