Опубликован: 07.11.2006 | Доступ: свободный | Студентов: 3397 / 338 | Оценка: 3.94 / 3.71 | Длительность: 37:11:00
Лекция 7:

Интерфейсы AсtionScript

Программирование на основе событий

Теперь, когда вам вполне понятно, что onEnterFrame является полезным изобретением, перейдем к другим управляющим элементам. Здесь мы можем погрузиться в мир программирования на основе событий.

Помните, что все, что находится в функции управляющего элемента onEnterFrame, будет выполняться много раз в секунду. Приведем пример того, как это используется в некоторых случаях.

mc1_mc.onEnterFrame = function() {
    if (buttonStatus == "pressed") {
      // do some stuff here...
    }
  };

В некотором месте фильма имеется кнопка, нажатие которой устанавливает переменную buttonStatus на значение "pressed", т.е. "нажато". Здесь управляющий элемент события постоянно проверяет состояние этой переменной, ожидая его изменения. Напоминает дальнюю поездку с детьми в автомобиле, когда они засыпают вас вопросами "Мы уже приехали? Мы уже приехали? Мы уже приехали?".

Этот процесс называется опросом. Несмотря на то, что в каждом кадре мы выполняем только одно выражение if, реализация такого подхода в фильме весьма влияет на производительность. Я работал с несколькими сложными анимационными проектами, выполнявшимися корректно сами по себе. Но затем я поместил их в интерфейс, где было два блока кода обработки событий, который проверял статус некоторой переменной. Неожиданно моя анимация замедлилась и "подвисла". Я просмотрел нарушающие работу циклы, проверявшие определенное условие, и перепрограммировал их, после чего все заработало корректно.

Программирование на основе событий реализуется различными способами. Вместо постоянной проверки того, случилось ли что-то или еще нет, устанавливается управляющий элемент события, после чего можно "откинуться на спинку стула и расслабиться". Программа не выполняет никаких действий и занимает минимальное количество процессорного времени. Когда происходит нужное событие, она возвращается в активное состояние и приступает к выполнению действий.

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

Другие события

Ранее мы упоминали о том, что фильм является приемником события enterFrame. Ему известно, когда фильм сменил кадр и, если определен соответствующий метод поддержки события, он обработает это событие посредством выполнения функции. Итак, фильмы также являются приемниками для другого типа событий, называемых событиями мыши. В них входят события mouseMove, mouseDown и mouseUp. Хотя это очевидно, событие mouseDown происходит при каждом нажатии главной кнопки мыши, а событие mouseUp происходит, когда вы отпускаете кнопку мыши. Им соответствуют методы поддержки onMouseMove, onMouseDown и onMouseUp.

Не озадачивайте себя различием между, скажем, mouseMove и onMouseMove. mouseMove - это событие. Это то, что непосредственно происходит. onMouseMove - это управляющий элемент поддержки события. Это то, что нужно сделать при возникновении данного события. Это можно интерпретировать следующим образом: "Когда произойдет событие mouseMove, нужно сделать следующее:". Более того, вам никогда не придется вводить имена событий, например, mouseMove, mouseDown, enterFrame и т.д. Эти термины существуют лишь для упоминания о событиях в описании или рассказе о них. Они не являются ключевыми словами программирования AсtionScript.

Мы можем создавать и присваивать функции этим управляющим элементам точно так же, как мы это делали в случае с onEnterFrame. Когда произойдет событие, функция будет вызвана.

Здесь мы присвоим две функции управляющим элементам onMouseDown и onMouseUp фильма.

mc1_mc.onMouseDown = function() {
    this._xscale = 200;
    this._yscale = 200;
  };
  mc1_mc.onMouseUp = function() {
    this._xscale = 100;
    this._yscale = 100;
  };

Помните всемогущий "this"?! Несмотря на то, что мы присваиваем функцию непосредственно управляющему элементу, нам все равно нужно указывать this для ссылки на объект, вызывающий эту функцию.

При нажатии кнопки мыши управляющий элемент onMouseDown фильма mc1_mc вызывает и выполняет присвоенную ему функцию. Эта функция устанавливает размеры mc1_mc по x и y на значение 200%.

Когда вы отпустите кнопку, вызовется функция, присвоенная onMouseUp, установив размер обратно на 100. Вам также необходимо иметь в виду, что это не похоже на случай с кнопкой, когда вам нужно было находиться поверх фильма для регистрации щелчка. Все фильмы на рабочем столе будут принимать все события мыши, независимо от того, где они произошли.

Теперь проверим управляющий элемент onMouseMove. Это действие выполняется каждый раз при движении мыши. Здесь мы применим длинный метод, чтобы вы умели пользоваться и тем, и другим.

function move() {
    this._x = _root._xmouse;
    this._y = _root._ymouse;
  }
  mc1_mc.onMouseMove = move;

Добавив строку

Mouse.hide();

вы узнаете, как создать свой собственный курсор для фильмов Flash.

Управляющий элемент события кнопки

Во Flash 5, чтобы сделать фильм "перетаскиваемым", нужно было выполнить достаточно сложную процедуру по созданию невидимой кнопки внутри фильма, и присвоить ей действия, влияющие на фильм, в котором она находилась. Во Flash MX фильмы сами по себе могут выступать в роли кнопок. Приведем несколько новых управляющих элементов событий, которые применимы как к кнопкам, так и к фильмам.

  • onRollOver
  • onRollOut
  • onPress
  • onRelease
  • onReleaseOutside

Они работают таким же образом, как и управляющие элементы поддержки событий, с которыми мы уже ознакомились. Поддерживаемые ими события должны быть довольно простыми. Давайте посмотрим, насколько легко создавать перетаскиваемый фильм.

Так как фильм теперь может обрабатывать нажатия и отпускания кнопки, все, что нам нужно, это установить функцию на каждый управляющий элемент для начала и окончания перетаскивания. Это просто.

mc1_mc.onPress = function() {
    this.startDrag();
  };
  mc1_mc.onRelease = function() {
    this.stopDrag();
  };
  mc1_mc.onReleaseOutside = function() {
    this.stopDrag();
  };

Я всегда также обеспечиваю поддержку события onReleaseOutside. Это предотвращает "зацепление" фильма за указатель мыши, если вы случайно перетащили слишком быстро и отпустили кнопку в момент, когда указатель не находился в фильме. Так как функции этих двух событий в точности идентичны, можно использовать другой сокращенный подход.

mc1_mc.onPress = function() {
    this.startDrag();
  };
  mc1_mc.onRelease = mc1.onReleaseOutside = function() {
    this.stopDrag();
  };

Оба управляющих элемента присвоены одной функции.

При запуске этого файла обратите внимание на то, что указатель мыши, находясь в верхней части фильма, превращается в "руку", как если бы там находилась кнопка.

Игорь Хан
Игорь Хан

у меня аналогичная ситуация. Однако, если взять пример из приложения (ball_motion_04_click for trial.fla) то след остается. при этом заметил, что в моем проекте в поле "One item in library" виден кружок, в то время как в приложенном примере такого кружка нет.

Вопрос знатокам, что не так?

Александр Коргапольцев
Александр Коргапольцев

объект созданый мной упорно не желает оставлять след(единственное что добился, так это то что шарик резво гоняется за курсором) функция duplicateMovieClip остаётся не активной, т.е. следа от объекта не остаётся, но если я тоже самый код вбиваю в учебный файл всё работает, не могу понять где я ошибаюсь и почему в документе созданном заново, не работает код начиная от функции duplicateMovieClip?