Как сохранить фокус и курсор в TextInput Flex после нажатия клавиши ВВОД?

Я новичок в Flex и тестирую небольшое приложение, имитирующее тележку. (Он основан на прекрасном образце Якова Файна из Farata Systems). Примечание. Я использую бета-версию Flash Builder 4 для написания кода приложения.

Здесь у вас есть ссылка на снимок экрана: Снимок экрана

(Извините, я не могу вставить изображение скриншота прямо здесь, поскольку stackoverflow не позволяет новым пользователям использовать теги изображений.)

Приложение очень простое. Вы вводите продукт в элемент управления TextInput, а затем нажимаете кнопку «Добавить в корзину», чтобы добавить его в «корзину», которая представлена ​​TextArea внизу.

Это нормально работает.

Проблема в том, что я также хочу, чтобы пользователь мог продолжать добавлять товары в корзину, не нажимая кнопку «Добавить в корзину». Итак, я добавил код для обработки события ввода TextInput путем вызова той же функции-обработчика, которая запускается событием Click «Добавить в корзину».

Если вы введете какой-либо контент, а затем нажмете кнопку «Добавить в корзину», элемент управления TextInput получит фокус и курсор, так что вы можете ввести снова. Однако, если вы нажмете клавишу ввода, вместо нажатия кнопки элемент управления TextInput останется в фокусе, и вы увидите луч курсора, но вы не сможете ввести текст, пока не нажмете где-нибудь еще и не вернетесь к элементу управления.

Ниже вы можете увидеть соответствующую часть кода с определением компонента, который группирует три элемента управления вверху (Label, TextInput, Button).

¿Есть предложения?

<?xml version="1.0" encoding="utf-8"?>


<fx:Script>
    <![CDATA[           
        protected function newItemHandler():void
        {
            import cart.ItemAddedEvent; 
            var e : ItemAddedEvent = new ItemAddedEvent( "->" + textInputItemDescription.text );    
            textInputItemDescription.text = ""; 
            textInputItemDescription.setFocus();
            textInputItemDescription.setSelection(0,0); 
            dispatchEvent( e ); // Bubble to parent = true
            trace( "I just dispatched AddItemEvent " + e.toString() + "\n Content = " + e.itemDescription );
        }
    ]]>
</fx:Script>

<fx:Metadata>
    [Event(name="ItemAddedEvent",type="cart.ItemAddedEvent",bubbles=true)]
</fx:Metadata>
<mx:Label text="Item description:"/>
<s:TextInput id="textInputItemDescription" enter="newItemHandler() "/>
<s:Button click="newItemHandler()"  label="Add to cart"/>


setfocus actionscript-3 apache-flex
person Community    schedule 23.07.2009    source источник

Ответы (3)


arrow_upward
1
arrow_downward

сначала спасибо Дэну за его ответ. Я попробовал, и ничего не вышло.

Однако пост Дана указал мне правильное направление.

Во-первых, чтобы лучше понять контекст, позвольте мне показать основной файл mxml (SimpleCart.mxml):

<?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/halo" 
               xmlns:ctrl="controls.*"
               xmlns:cart="cart.*"
               minWidth="1024" minHeight="768" >
    <s:layout>
        <s:BasicLayout/>
    </s:layout>
    <fx:Style source="SimpleCart.css"/>
    <ctrl:NewItem id="buttonAddItem" x="9" y="15" width="394" height="27"/>     
    <cart:SmartShoppingCart  x="8" y="47" width="378"/>         
</s:Application>

Я думаю, проблема в том, что компонент, объединяющий Label, TextInput и Button, называемый NewItem, не получил фокуса, хотя элемент управления TextInput сделал это.

Итак, я просто добавил вызов this.SetFocus, чтобы установить фокус на компонент NewItem, прежде чем устанавливать фокус на элемент управления TextInput.

Вот исходный код рабочей версии NewItem (найдите изменения в комментариях // Решение):

<?xml version="1.0" encoding="utf-8"?>
<s:HGroup xmlns:fx="http://ns.adobe.com/mxml/2009" 
          xmlns:s="library://ns.adobe.com/flex/spark" 
          xmlns:mx="library://ns.adobe.com/flex/halo" >

    <fx:Script>
        <![CDATA[   

            protected function newItemHandler():void
            {
                import cart.ItemAddedEvent; 
                import flash.external.ExternalInterface; 

                var e : ItemAddedEvent = new ItemAddedEvent( "->" + textInputItemDescription.text );    
                textInputItemDescription.text = "";

                // *** Solution begins here                     
                this.setFocus();
                // *** Solution ends here

                textInputItemDescription.setFocus();
                textInputItemDescription.setSelection(0,0); 
                dispatchEvent( e ); // Bubble to parent = true
            }
        ]]>
    </fx:Script>

    <fx:Metadata>
        [Event(name="ItemAddedEvent",type="cart.ItemAddedEvent",bubbles=true)]
    </fx:Metadata>

    <mx:Label text="Item description:"/>
    <s:TextInput id="textInputItemDescription" enter="newItemHandler() "/>
    <s:Button click="newItemHandler()"  label="Add to cart"/>
</s:HGroup>
person Community    schedule 27.07.2009

arrow_upward
0
arrow_downward

Я думаю, что ваша проблема в том, что после того, как вы нажмете клавишу ввода, курсор вернет страницу на HTML. Итак, пока игрок показывает прямоугольник фокуса вокруг правильного элемента управления, браузер снова получил фокус курсора. Решение состоит в том, чтобы заставить браузер вернуть управление проигрывателю, вызвав простой javascript, описанный здесь:

http://carrythezero.net/blog/2009/01/20/flex-textinput-focus-issues/

person dan    schedule 24.07.2009

arrow_upward
0
arrow_downward

Ответ jfc сработал для меня. У меня есть Mate ListenerInjector, вызывающий эту процедуру, чтобы установить фокус на TextInput с помощью id="answerText". Без this.setFocus(), предложенного jfc, TextInput будет отображать синий контур, как если бы он был в фокусе, но без курсора, и ввод там не отображается.

public function readyForNextAnswer(e:Event) : void {
    this.setFocus()
    answerText.setFocus() // Tried focusManager.setFocus(answerText), too
}
person x77686d    schedule 04.09.2012