понедельник, 19 сентября 2011 г.

Урок 5. События клавиатуры

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

Событие клавиатуры:
Событие будет происходить при нажатии клавиши клавиатуры.
Существует два типа событий клавиатуры: KeyboardEvent.KEY_DOWN и KeyboardEvent.KEY_UP

KeyboardEvent.KEY_DOWN – пользователь нажал на клавишу
KeyboardEvent.KEY_UP – пользователь отпустил клавишу

Событие клавиатуры используется практически в любой игре. Самый простой пример - передвижение персонажа по экрану. Этим мы сейчас и займёмся  сделав вот такую флешку.
P.S.: Управлять пчелкой можно как стрелками, так и WASD.

Итак преступим! 1. Создайте новый AS3 документ. 2. Создайте вашего персонажа, и дайте ему имя player.
3. Всё, подготовительный этап закончен! Теперь можно приступать к написанию кода!
// переменные определяющие в какую сторону лететь.
var up,down,left,right = 0;
// слушатель событий нажатия клавиш.
stage.addEventListener(KeyboardEvent.KEY_DOWN,keyDownF);
// слушатель событий отпускания клавиш.
stage.addEventListener(KeyboardEvent.KEY_UP,keyUpF);
// ENTER_FRAME =)
stage.addEventListener(Event.ENTER_FRAME,updatePosF);

// функция выполняющаяся при нажатии клавиш.
function keyDownF(e:KeyboardEvent):void
{
 if (e.keyCode == Keyboard.UP)
 {
  //если верно, то присвоить переменной up значение 1.
  up = 1;
 }
 if (e.keyCode == Keyboard.DOWN)
 {
  //если верно, то присвоить переменной down значение 1.
  down = 1;
 }
 if (e.keyCode == Keyboard.RIGHT)
 {
  //если верно, то присвоить переменной right значение 1.
  right = 1;
 }
 if (e.keyCode == Keyboard.LEFT)//аналогично.
 {
  left = 1;
 }
}

// функция выполняющаяся при отпускании клавиш.
function keyUpF(e:KeyboardEvent):void
{
 if (e.keyCode == Keyboard.UP)
 {
  //если верно, то присвоить переменной up значение 0.
  up = 0;
 }
 if (e.keyCode == Keyboard.DOWN)// аналогично
 {
  down = 0;
 }
 if (e.keyCode == Keyboard.RIGHT)// аналогично
 {
  right = 0;
 }
 if (e.keyCode == Keyboard.LEFT)// аналогично
 {
  left = 0;
 }
}

// а вот и функция которая проверяет не вышел 
// ли игрок за пределы экрана, и в какую сторону надо лететь.
function updatePosF(e:Event):void
{
 if (up == 1)// если up = 1, то лететь вверх
 {
  player.y -=  5;
 }
 if (down == 1)// если down = 1, то лететь вниз
 {
  player.y +=  5;
 }
 if (left == 1)// если left = 1, то лететь влево
 {
  player.x -=  5;
 }
 if (right == 1)// если right = 1, то лететь вправо
 {
  player.x +=  5;
 }
//----------------------------------
// запрет на передвижение, если пчелка возле краёв экрана
 
 if (player.y <=player.height/2)
 {
  up = 0;
 }
 if (player.y >= stage.stageHeight-player.height/2)
 {
  down = 0;
 }
 if (player.x <= player.width/2)
 {
  left = 0;
 }
 if (player.x >= stage.stageWidth-player.width/2)
 {
  right = 0;
 }
//-------------------------------
}
Ну вот собственно и всё, что я хотел сегодня рассказать. Желаю удачи в выполнении урока, и конечно-же ДЗ =) ДЗ: сделать так, что-бы пчелка летала как в примере (и на стрелках и на клавишах WASD).

17 комментариев:

  1. Думаю блоки лучше поменять местами сначала проверка на допустимость действия, а потом уже действие

    ОтветитьУдалить
  2. Вторая строка выполняется неправильно, у меня все переменные равны нулю только если их по отдельности прописать

    ОтветитьУдалить
  3. Ты бы добавил спрайтов к уроку,ато приходится в интернете искать.

    ОтветитьУдалить
    Ответы
    1. каких спрайтов? вся графика в этом уроке не с интернета, а личного производства

      Удалить
  4. а почему у тебя во флешке есть код запрет на передвижение, если пчелка возле краёв экрана но объект все-равно выходит за рамки????

    ОтветитьУдалить
    Ответы
    1. хм... а ведь и правда, как-то не заметил...

      Удалить
    2. во всяком случае у вас всё должно быть нормально, если следовать всем пунктам урока.

      Удалить
  5. а то что летают облака и пчелка махает, это гифы используешь? или на них надо отдельный код писать?

    ОтветитьУдалить
    Ответы
    1. объясните как сделать так чтобы гиф файл состоящий из 5 кадров работал на коде, составленном на 1 кадре? что делать чтобы не было ошибки?

      Удалить
  6. все просто супер! Но у меня один вопрос вопрос. После публикации создается документ для браузера. и если открыть его или муви браузером, то пчелка не летает. не подскажите, что делать?)

    ОтветитьУдалить
  7. Ну, кстати, проверка на выход за границы вообще элементарна.
    Пример:
    if (player.y <= stage.y)
    {
    up = 0;
    //или player.y = 0;
    }

    или даже еще проще:
    function keyDownF(e:KeyboardEvent):void
    {
    switch(e.keyCode)
    {
    case Keyboard.UP:
    if(player.y <= stage.y)
    player.y = 0;
    else
    player.y -= 5;
    break;
    }
    }

    ОтветитьУдалить
  8. Ни код в теме, ни коды в комментариях не останавливают объект возле края экрана... Печаль

    ОтветитьУдалить
  9. Дело в том, что нужно отлавливать коордианты объекта по отношению к объекту scene

    ОтветитьУдалить
  10. чтоб не вылетало за пределы:
    //----------------------------------
    // запрет на передвижение, если пчелка возле краёв экрана

    if (player.y <=player.height/2)
    {
    up = 0;
    player.y +=5;
    }
    if (player.y >= stage.stageHeight-player.height/2)
    {
    down = 0;
    player.y -=5;
    }
    if (player.x <= player.width/2)
    {
    left = 0;
    player.x+=5;
    }
    if (player.x >= stage.stageWidth-player.width/2)
    {
    right = 0;
    player.x-=5;
    }
    //-------------------------------
    }

    ОтветитьУдалить
  11. А какой код, что бы летали облака? Я просто новичок в этом деле.

    ОтветитьУдалить
  12. Ответ на вопрос
    (все просто супер! Но у меня один вопрос вопрос. После публикации создается документ для браузера. и если открыть его или муви браузером, то пчелка не летает. не подскажите, что делать?) )
    кликни мышой по игровой области, поверь, заработае

    ОтветитьУдалить
  13. ответ на вопрс
    (как сдклать чтоб летали облака?А анимацыя пчелы это гиф?)
    Вся анимацыя делается в предела флеша.Там кроме рисования и прогримирования есть и самое главное в программе - анимацыя

    ОтветитьУдалить