ActionScript 3: Обработка нажатия кнопок на клавиатуре

Чтобы flash-приложение было интерактивным, у пользователя должна быть возможность воздействовать и управлять им, для этого используются мышь и клавиатура, события которых нужно обрабатывать при помощи кода ActionScript 3.

В данном уроке рассмотрим, как обрабатывать события нажатий кнопок на клавиатуре:

  1. Основные прослушиватели событий клавиатуры и их добавление
  2. Получение данных о нажатии кнопок клавиатуры в функции-обработчике
  3. Свойства обработчика события KeyboardEvent и получение информации о нажатой кнопке клавиатуры
  4. Получение данных о конкретной нажатой кнопке клавиатуры
  5. Отслеживание нажатия комбинаций клавиш на клавиатуре

Основные прослушиватели событий клавиатуры и их добавление при помощи кода ActionScript 3

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

Основной обработчик, который проверяет, нажата ли какая-либо клавиша:

addEventListener(KeyboardEvent.KEY_DOWN, on_keyDown);

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

addEventListener(KeyboardEvent.KEY_UP, on_keyUp);

Слушатель нужно добавлять к тому объекту, в пределах которого будет происходить опрос нажатия кнопок с клавиатуры. Обычно слушатель регистрируется на объект stage, например:

stage.addEventListener(KeyboardEvent.KEY_DOWN, on_keyDown);

Примечание. Реагировать на события клавиатуры могут экранные объекты, которые наследуют модель взаимодействия от класса InteractiveObject.

Получение данных о нажатии кнопок клавиатуры в функции-обработчике

Эти слушатели работают при возникновении нажатия на кнопки клавиатуры и отпуска после нажатия, но для того, чтобы знать какая именно кнопка была нажата, надо получать эти данные в функции-обработчике. Давайте рассмотрим такую функцию нажатия клавиш для слушателя KeyboardEvent.KEY_DOWN:

stage.addEventListener(KeyboardEvent.KEY_DOWN, on_keyDown);
function on_keyDown(e:KeyboardEvent):void{
  trace("Key Pressed");
}

Свойства обработчика события KeyboardEvent и получение информации о нажатой кнопке клавиатуры

Чтобы узнать, какая клавиша была нажата, нужно использовать свойства обработчика события KeyboardEvent:

keyCode — возвращает код нажатой или клавиши, которую нажали, а потом отпустили;

charCode — возвращает значение кода символа для клавиши (набор символов по умолчанию — UTF-8 с поддержкой ASCII);

Примечание. Разница между keyCode и charCode в том, что значение кода клавиши представляет конкретную клавишу на клавиатуре («1» на боковой клавиатуре отличается от «1» в верхнем ряду, но клавиша, с помощью которой вводятся «1» и «!», одна и та же), а значение кода символа (charCode) — это конкретный символ («R» и «r» — разные символы).

ctrlKey — возвращает true, если клавиша Ctrl нажата, и false если не нажата (свойство будет полезным, если нужно создать сочетание клавиш, например, клавиша + ctrl);

shiftKey — возвращает true, если клавиша Shift нажата, и false если не нажата (свойство будет полезным, если нужно создать сочетание клавиш, например, клавиша + Shift);

altKey — возвращает true, если клавиша Alt нажата, и false если не нажата (свойство будет полезным, если нужно создать сочетание клавиш, например, клавиша + Alt);

keyLocation — указывает положение клавиши (используется когда надо различить клавиши, которые дублируются на клавиатуре, например, ctrl, shift, alt).

stage.addEventListener(KeyboardEvent.KEY_DOWN, on_keyDown);
function on_keyDown(e:KeyboardEvent):void{
  trace(e.keyCode);
  trace(e.charCode);
}

Запустите flash-приложение в режиме среды разработки AdobeFlash, и нажмите какую-нибудь клавишу, в окне output должна появиться информация о том, какая кнопка нажата.

Обратите внимание, что в окне output не выходит информация о некоторых нажатых клавишах, это связано с тем, что при тестировании приложения в среде разработки AdobeFlash эти кнопки используются для других целей самой программой. Чтобы обойти эту проблему можно создать текстовое поле и передавать туда данные о нажатой кнопке.

text_field.text = String(e.keyCode);

Получение данных о конкретной нажатой кнопке клавиатуры

Теперь, давайте отследим нажатие конкретной кнопки. Напишем следующий код:

stage.addEventListener(KeyboardEvent.KEY_DOWN, on_keyDown);
function on_keyDown(e:KeyboardEvent):void{
  if (e.keyCode == Keyboard.SPACE){
    trace("нажата кнопка");
  }
}

Как вы заметили, мы использовали константу при проверке кода клавиши if (e.keyCode == Keyboard.SPACE), хотя могли бы написать так if (e.keyCode == 32). Использование констант кода клавиш очень удобно. Все коды и константы для кнопок клавиатуры вы можете посмотреть на официальном сайте AdobeFlash по следующей ссылке: коды клавиш и их константы в ActionScript 3.

Отслеживание нажатия комбинаций клавиш на клавиатуре

Точно таким же образом можно отследить нажатие и других клавиш. Рассмотрим пример комбинации клавиш, когда зажата клавиша ctrl и клавиша вправо.

stage.addEventListener(KeyboardEvent.KEY_DOWN, on_keyDown);
function on_keyDown(e:KeyboardEvent):void{
  if (e.ctrlKey && e.keyCode == Keyboard.RIGHT){
    trace("нажата кнопка ctrl и кнопка вправо");
  }
}

Давайте немного усложним задачу и будем отслеживать нажатие левой клавиши ctrl и клавиши вправо. Напишем такой код:

stage.addEventListener(KeyboardEvent.KEY_DOWN, on_keyDown);
function on_keyDown(e:KeyboardEvent):void{
  if (e.ctrlKey && e.keyCode == Keyboard.RIGHT && e.keyLocation == 1){
    trace("нажата кнопка ctrl и кнопка вправо");
  }
}

Как видите, этот пример не работает. Дело в том что нажать в одну долю секунды одновременно две клавиши практически не возможно. А точнее, заставлять сделать это игрока — точно не стоит.

Поэтому нужно отдельно отловить событие нажатия одной клавиши, затем второй. Давайте так и сделаем:

var ctrlKey_left: Boolean;

stage.addEventListener(KeyboardEvent.KEY_DOWN, on_keyDown);
stage.addEventListener(KeyboardEvent.KEY_UP, on_keyUp);

function on_keyDown(e:KeyboardEvent):void{
  if (e.ctrlKey && e.keyLocation == 1){
    ctrlKey_left = true;
  }

  if (ctrlKey_left && e.keyCode == Keyboard.RIGHT) {
    trace("нажаты кнопки левый ctrl и вправо");
  }
}

function on_keyUp(e:KeyboardEvent):void{
  if (!e.ctrlKey) {
    ctrlKey_left = false;
  }
}

Запустите flash-приложение и проверьте его работу. Зажмите левую клавишу ctrl, а затем клавишу «вправо» на клавиатуре. В окне output должно появиться сообщение «нажаты кнопки левый ctrl и вправо».

Этот код неидеален и содержит небольшую ошибку. Запустите flash-приложение снова и зажмите клавишу «вправо», а затем левый ctrl. Обратите внимание, что ничего не происходит, сообщение не отображается. Чтобы исправить эту неточность давайте доработает код, нужно ввести еще одну переменную key_right, уже для клавиши «вправо» и отслеживать ее состояние нажатия.

var ctrlKey_left: Boolean = false;
var key_right: Boolean = false;

stage.addEventListener(KeyboardEvent.KEY_DOWN, on_keyDown);
stage.addEventListener(KeyboardEvent.KEY_UP, on_keyUp);

function on_keyUp(e:KeyboardEvent):void{
  if (!e.ctrlKey) {
    ctrlKey_left = false;
  }

  if (e.keyCode == Keyboard.RIGHT){
    key_right = false;
  }
}

function on_keyDown(e:KeyboardEvent):void{
  if (e.ctrlKey && e.keyLocation == 1){
    ctrlKey_left = true;
  }

  if (e.keyCode == Keyboard.RIGHT) {
    key_right = true;
  }

  if (ctrlKey_left && key_right) {
    trace("нажаты кнопки левый ctrl и вправо");
  }
}

Можно сказать, что работа с клавиатурой в ActionScript 3 не доведена до совершенства, поэтому если возникает необходимость точного отслеживания нажатия клавиш (особенно это касается их комбинаций), то приходится описывать некоторые моменты в функции-обоработчике, либо лучше всего воспользоваться сторонними разработками, которые расширяют данный функционал.

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

Автор: Jean Winters

Другие уроки AdobeFlash:

Adobe Flash: Простая анимацияAdobe Flash: Простая анимация


Создание кнопки в Adobe Flash CS5Создание кнопки в Adobe Flash CS5


Комментировать

Почта не публикуется.Обязательные поля отмечены *