Как отменить редактирование в компонентах Halo / Spark TextInput и TextArea - PullRequest
Новая
       34

Как отменить редактирование в компонентах Halo / Spark TextInput и TextArea

4 голосов
/ 02 июня 2011

Я использую Flex 4, ActionScript 3.

В компоненте AdvancedDataGrid, когда вы находитесь в режиме редактирования в ячейке, вы можете нажать клавишу Escape, чтобы отменить редактирование (то есть вернуться к предыдущему значению в ячейке).

Я ожидал такого же поведения в режиме редактирования в компонентах Halo и Spark TextInput и TextArea, и с удивлением обнаружил, что это не так.

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

Это то, что нужно кодировать?

1 Ответ

3 голосов
/ 02 июня 2011

Да, это то, что должно быть закодировано. Вот подход, который я бы выбрал:

  1. Создание пользовательского компонента, расширяющего TextInput. Давайте назовем это UndoTextInput.
  2. Добавить новую переменную в UndoTextInput для хранения исходного текста TextInput. Мы назовем это originalText.
  3. Добавить прослушиватель событий для события focusIn. В обработчике события focusIn сохраните текущее текстовое значение в переменной originalText.
  4. Добавить событие в событие focusOut. В событии focusOut установите значение originalText обратно в пустую строку.
  5. Добавить прослушиватель событий для события keyDown. В прослушивателе событий проверьте, была ли нажата кнопка Escape (Keyboard.ESCAPE). Если это так, сбросьте текст обратно к тому, что было сохранено в originalText.

Надеюсь, это поможет!

UPDATE:

Вот краткий пример того, как сделать это с помощью класса Actionscript. Не стесняйтесь изменять по мере необходимости. 

package
{
    import flash.events.FocusEvent;
    import flash.events.KeyboardEvent;
    import flash.ui.Keyboard;

    import spark.components.TextInput;

    public class UndoTextInput extends TextInput
    {
        private var originalText:String = "";

        public function UndoTextInput()
        {
            super();
            this.addEventListener(FocusEvent.FOCUS_IN, focusInEventHandler);
            this.addEventListener(FocusEvent.FOCUS_OUT, focusOutEventHandler);
            this.addEventListener(KeyboardEvent.KEY_DOWN, checkKeyPress);
        }

        protected function focusOutEventHandler(event:FocusEvent):void
        {
            this.originalText = "";
        }

        protected function focusInEventHandler(event:FocusEvent):void
        {
            this.originalText = this.text;
        }

        protected function checkKeyPress(event:KeyboardEvent):void
        {
            if (event.keyCode == Keyboard.ESCAPE)
            {
                event.stopImmediatePropagation();
                this.text = this.originalText;
            }
        }
    }
}
...