Элементы ActionScript для создания игр.
Урок 15. Контроль воспроизведений клипа
Урок 16. Управление свойствами клипа
Урок 17. Применение метода "Перетащи и положи" к клипам
Урок 18. Клипы и уровни
Урок 19. Копирование клипов
Урок 20. Управление несколькими клипами
Урок 21. Пересечение объектов
Урок 22. Изменения содержимого экрана с помощью клипов
Урок 23. Ввод команд с клавиатуры
Урок 24. Воспроизведение звука
Обработчики событий
Во Flash 5 единственным способом отслеживания таких событий, как, например, enterFrame, было использование обработчиков onClipEvent в сценариях клипа. В версии MX появилась возможность использовать обработчики прямо в сценарии кадра.
Вот простой пример. Этот сценарий помещен в кадр и посылает сообщение в окно Output при каждом обращении к кадру.
root.onEnterFrame = function() {
trace("enterFrame Event");
}
Вместо команды trace вы можете использовать другие команды аналогично тому, как это делалось на протяжении этого урока. Можно также определить имя для функции, обрабатывающей событие. Тогда предыдущий пример можно записать в таком виде:
root.onEnterFrame = myFunction;
function myFunction() {
trace("enterFrame Event");
}
С помощью этого приема можно обращаться к любым событиям, например onMouseUp, onKeyUp, onLoad и т.д. Полное описание процедур обращения к событиям вы можете найти в документации. Пример использования данной технологии можно найти в главе 13 начиная с игры "Найди картинку".
Создание клипа сценария
Единственным способом управлять несколькими клипами будет поместить код в точку, контролирующую их все. Например, если у вас есть 10 клипов, вы можете поместить код в первый клип, который будет контролировать все остальные.
Почему бы вместо того, чтобы возлагать контроль на один из клипов, нам не создать клип, специально для этого предназначенный? Данный распространенный прием позволяет легко запомнить, куда вы поместили ваш код. Я назвал такой клип "actions movie clip" (клип сценария).
такой клип удобно называть контроллером.
Начните с создания при помоши инструмента Text небольшого текстового окна на рабочем поле и напишите в нем слово "actions" для того, чтобы его можно было легче идентифицировать.
Перед окончательной пубикацией ролика лучше удалить надпись "actions" из клипа сценария, так как итоговый swf-файл должен занимать как можно меньше места
Затем, выделив текстовое окно, выберите команду Insert -> Convert to Symbol для преобразования его в клип под названием "actions".
Переместите его на серую область за пределами рабочего поля, так чтобы пользователь не видел слово "actions".
Данный клип используется для назначения сценария, который будет управлять роликом. Предположим, вам необходим ролик, создающий 10 копий эталона из библиотеки и немного поворачивающий их с каждым новым циклом.
Исходный файл:
actionsMC.fla
Прежде всего создайте эталон. В диалоговом окне Symbol Linkage Properties установите флажок Export This Symbol и укажите имя "sample" (см. файл actionsMCfla).
Код, написанный ниже, будет включен в клип "actions". Он будет находиться внутри программы обработки onClipEvent и состоять из двух частей. Первый обработчик будет отзываться на событие load. Событие load происходит при первом появлении клипа. Код выполняется один раз. В данном случае следует воспользоваться возможностью и создать 10 новых клипов:
OnClipEvent (load) {
// Создаем 10 клипов,
for(i=0;i
_root.attachMovie("sample","sample"+i,i);
// Устанавливаем координаты
_root["sample"+i]._x = i*50 + 50;
_root["sample"+i]._y = 100; } }
Координаты клипов задаются одновременно с их созданием. Значение по вертикали равно 100, координата по горизонтали может иметь различные значения от 50 до 500. Результат показан на рис 3.6.
Рисунок 3.6 Эти 10 клипов были созданы из эталона при помощи ActionScrip
Вторая часть кода находится в программе обработки onClipEvent (enterFrame). Код выполняется в каждом цикле клипа "actions". Если клип воспроизводится со скоростью 12 кадров в секунду, код будет выполняться также 12 раз в секунду.
onClipEvent (enterFrame) {
// Поворачиваем каждый клип в цикле,
for(i=0;i
_root["sample"+i]._rotation += 5;
}
}
Данный код циклически выполняется во всех клипах и поворачивает каждый их них на 5 градусов. В результате на рабочем поле будет 10 вращающихся клипов.
Исходный файл:
Gears.fla
Я также создал улучшенную версию ролика под названием Gears.fla. За исключением кода ролик ничем не отличается от предыдущего. В Gears.fla клипы расположены таким образом, что зубья шестеренок соприкасаются. Чтобы создать эффект работающего механизма, каждый ролик изначально повернут относительно предыдущего на 15 градусов. Соседние зубья каждой шестеренки расположены с интервалом в 30 градусов, поэтому зубъя соседних шестеренок сцепляются. Кроме того, каждая шестеренка вращается в направлении, отличном от направления врашения предыдущей. Вот как выглядит код:
onClipEvent (load) {
initialRotation = 0;
// Создаем 10 клипов,
for(i=0;i
/7 Присоединяем очередной клип.
_root'.attachMovie ("sample","sample"+i , i) ;
// Устанавливаем координаты
_root["sample" + i]._x = i * 37 ;
_root["sample"+i]._y = 100;
// Устанавливаем каждому следующему поворот
// на 15 градусов относительно предыдущего.
_root["sample"+l]._rotation = initialRotation;
initialRotation += 15;
onClipEvent (enterFrame) {
// Пробегаем все клипы через один.
for(i=0;i
// Поворачиваем по часовой стрелке.
_root [ "sample"+i] ._rotation += 5;
// Следующий поворот против часовой стрелки.
_root["sample"*(i+1)],_rotation -= 5;
}
}
Чтобы понять, как устроен код, откройте ролик Gears.fla и поработайте с ним. Этот, а также многие другие коды, которые вы встретите в данной книге, невозможно объяснить только теоретически. Для того чтобы до конца понять устройство и работу примеров, следует поработать с ними.
Контроль воспроизведений клипа
Исходный файл: Mcplayback.fla
Клипы представляют собой как бы небольшие ролики внутри основного Flash-ролика. Они включают полноценную временную шкалу со слоями, а также большинство элементов основного ролика. И основной Flash-ролик, и клипы можно контролировать при помощи команд play() и stop().
В библиотеке файла под названием Mcplayback.fla, находится клип "myMovieClip". Этот клип состоит из 10 кадров, промаркированных для того, чтобы вы знали, какой кадр клипа воспроизводится в данный момент.
Перетащив клип из библиотеки на рабочее поле, вы создадите его копию, которой можно и даже нужно присвоить имя. Для этого используйте панель Properties (Свойства), изображенную на рис. 3.1.
Рисунок 3.1 В панели Properties можно присвоить имя копии клипа
Вы наверняка заметили, что копия клипа имеет такое же имя, как и клип в библиотеке. Обычно это делается при создании одной копии клипа. Имя копии легче запомнить, если оно совпадает с именем объекта библиотеки.
Библиотека ролика, рассматриваемого в примере, также содержит пять кнопок. Они помешены на рабочее поле под копией клипа. Присваивать имена копиям кнопок необязательно, впрочем, вы и не сможете этого сделать. В любом случае код не может ссылаться на кнопку, поэтому в имени нет необходимости.
После добавления клипа и пяти кнопок рабочее поле будет иметь при мерно такой вид, как показано на рис. 3.2. Кнопки не только выглядят, но и используются как кнопки управления видеомагнитофоном.
Рисунок 3.2 Кнопки позволяют контролировать воспроизведение клипа
Пять кнопок позволяют полностью контролировать клип. Кнопка Play (Воспроизведение) запускает воспроизведение ролика. При достижении конца клипа воспроизведение начинается снова с первого кадра. Кнопка Stop (Стоп) останавливает воспроизведение ролика в текущем кадре. Кнопка Rewind (Перемотать) возвращает клип к первому кадру. Кнопки Previous (Предыдущий) и Next (Следующий) продвигают клип на один шаг соответственно назад или вперед.
Прежде чем передать контроль над клипом пользователю, необходимо остановить клип. Обычно клипы запускаются сразу же после своего появления на рабочем поле. Чтобы предотвратить это, в первый кадр главной временной шкалы был помещен следующий сценарий, останавливающий анимацию клипа, а также сам ролик:
myMovieClip.stop();
stop () ;
Точка в первой строке сценария показывает, что функция stop () будет выполнена для копии клипа "myMovieClip". Вторая строка не содержит имени копии, поэтому команда выполняется в месте расположения сценария - в данном случае в главной временной шкале.
В сценариях для кнопок команды клипу посылаются также при помоши точки. Вот сценарий кнопки Play, задающий воспроизведение клипа:
on (press) {
myMovieClip.play() ;}
Кнопка Stop посылает клипу команду stop () :
on (press) {
nyMovieClip.stop() ;}
Кнопка Rewind задает переход клипа к первому кадру и его остановку. Это действие выполняет команда gotoAndstop() с параметром 1.
on (press) {
myMovieClip.gotoAndStop(); }
Кнопки Previous и Next перемешают клип на один кадр вперед или назад. Эти действия выполняются при помоши команд prevFrame () И nextFrame():
on (press) {
myMovieClip.prevFrame () ;}
on (press) {myMovieClip.nextFrame ();}
Хотя целью данного урока было научить вас управлять воспроизведением клипов, вы можете использовать данный пример как руководство для воспроизведения анимации и даже слайд-шоу во Flash.
Применение метода "Перетащи и положи" к клипам
Исходный файл: Dragsimple.fla
Важным свойством интерфейса, будь то игра или приложение, являете возможность перетаскивать элементы по экрану. Во Flash это можно сде лать несколькими способами. Мы рассмотрим три из них.
Команда startDrag задает автоматическое следование клипа за курсором. Пример Dragsimple.fla демонстрирует самый простой способ применения данной команды.
Клип под названием "circle" с изображением круга был помешен на рабочее поле. Как только ролик запускается, нижеприведенная команда задает его движение следом за курсором. Она также задает остановку анимации главной временной шкалы, чтобы ролик не продолжал воспроизведение следующих кадров.
startDrag("circle", true);
stop () ;
В нашем примере команда startDrag использует два параметра. Первый - это имя перетаскиваемого клипа. Второй - ключевое слово true которое в данном случае задает привязку центра объекта к курсору. Ее второй параметр имеет значение false, за основу будет взято расстояние между курсором и центром клипа на момент выполнения командь startDrag. Ключевые слова true и false называются булевыми константами.
Они могут использоваться в случае, если атрибут либо действует, либо нет, а также отображать результат сравнения, например "а = = b.
В примере Dragsimple.fla клип "circle" следует за курсором. Однако чаше всего применяется другой способ перетаскивания: пользователь подводит курсор к объекту, нажимает кнопку мыши, перетаскивает объект в нужное место и отпускает кнопку.
Исходный файл: Dragcomplex.fla
Подобную манипуляцию можно осуществить с клипом, внутри которого содержится кнопка. В файле Dragcomplex.fla в тот же самый клип "circle" была помешена невидимая кнопка (в ней заполнен лишь один кадр "Hit"). Таким образом, клип circle включает такую же графику, как и в примере Dragsimple.fla, и, помимо этого, кнопку. Кнопке назначен следующий сценарий: когда пользователь нажимает кнопку, выполняется команда startDrag, когда отпускает - команда stopDrag.
on (press) {
startDrag("",false) ;
on (release) {
stopDrag();
}
Пустые кавычки внутри команды startDrag сообщают Flash, что перетаскиваться будет текущий клип. Кнопка находится внутри клипа "circle", поэтому перемещаться будет именно он. false в качестве второго параметра означает, что клип не будет привязан к центру курсора, а сохранит первоначальное расстояние между курсором и центром клипа. При этом будет создаваться впечатление, что курсор схватил круг в некоторой точке и перетаскивает его за нее.
Команда stopDrag не требует никаких параметров. Одновременно может перетаскиваться только один клип, поэтому команде необходимо лишь остановить текущее действие перемещения, благодаря чему клип вернется в неподвижное состояние.
Одним из недостатков команды startDrag является то, что одновременно может быть перемешен только один клип. Кроме того, клип перемешается автоматически, поэтому за его движением трудно проследить. По этой причине вам не помешает знать еше один способ перетаскивания клипа.
Исходный файл: Dragbetter.fla
Соответствующий код содержится в файле Dragbetter.fla. Ролик устроен аналогично ролику из примера Dragcomplex.fla, клип которого содержит невидимую кнопку. Однако данной кнопке назначен совершенно другой сценарий. Согласно данному сценарию, переменная drag получает значение true, когда пользователь нажимает на кнопку, и значение false, когда отпускает.
on (press) {
drag = true;
on (release) {
drag = false;
}
Переменная drag является глобальной переменной и совместно используется всем кодом клипа. В зависимости от значения drag сценарий определяет, должен ли клип следовать за курсором.
Сценарий устанавливает соответствие между переменными _х, _у перетаскиваемого клипа и _xmouse, _ymouse ролика. Два последних параметра описывают положение курсора мыши относительно рабочего поля основного ролика.
onClipEvent (enterFrame) {
if (drag) {
this._x = _root._xmouse;
this._y = _root._ymouse;
}
}
Ключевое слово this обозначает ссылку на текущий объект. Сценарий назначен клипу "circle", поэтому this относится к нему. В следующем разделе мы рассмотрим другие способы обращения к клипам на различных уровнях.
Клипы и уровни
Начинающему программисту на ActionScript будет трудно понять, каким образом устроены клипы и уровни. Клип можно представить как ролик внутри основного Flash-ролика. Этот клип имеет свои переменные и атрибуты, отличные от параметров и атрибутов основного ролика.
Каждый раз, когда вы помешаете клип на рабочее поле, вы создаете новый объект. Основной Flash-ролик является объектом, а клип - объектом внутри этого объекта.
Flash-ролик можно сравнить с коробкой, полной игрушек. Если вы раскрасите коробку в синий цвет, игрушки не станут синими. Каждая из них сохранит свой первоначальный цвет. С другой стороны, если вы перенесете коробку на другое место, остальные игрушки последуют за ней, сохранив при этом свои свойства, такие как цвет и положение внутри коробки.
Предположим, коробка с игрушками закрыта, и вы просите кого-то в комнате достать машинку. Если человек не знает, что игрушка находится внутри коробки, ему будет нелегко это сделать. Недостаточно просто сказать: "Достань машинку". Необходимо сказать: "Достань машинку, которая находится в коробке".
Подобным образом устроены и клипы. Если ваш клип расположен на главной временной шкале Flash-ролика, вы можете обратиться к нему по имени "toyTruck" ("игрушечный грузовик"). Однако, если ваш клип "toyTruck" расположен внутри другого клипа под названием "toyBox", к нему необходимо будет обратиться следующим образом: "игрушечный грузовик внутри коробки с игрушками", или "toyBox.toyTruck'.
Исходный файл: Levels.fla
На рис. 3.4 изображен похожий случай. Данный ролик в файле Levels.fla.
Рисунок 3.4 Клип "secondMC" включен в клип "firstMC", находящийся на рабочем поле
Файл Levels.fla содержит два клипа. Однако только файл "firstMC" находится на рабочем поле. Клип "secondMC" находится внутри "firstMC". Текстовое окно на рабочем поле и в каждом клипе связано с переменной testvariable Эти текстовые окна отображают значения переменной testvariable на рабочем поле и в клипах "firstMC" и "secondMC" соответственно.
То есть в каждом из клипов и на главной временной шкале (можно сказать в клипе _root) мы определили свою переменную и каждой из них присвоили имя testvariable.
Рабочее поле, а также каждый клип содержат кнопку, увеличивающую значение testvariable. Каждой кнопке назначен следующий код:
on (press) { testVariable++; }
Кнопка изменяет значение переменной testvariable. на уровне того клипа, в котором находится данная кнопка. Кнопка, расположенная на рабочем поле, изменяет переменную testvariable на главном уровне Кнопка в клипе "firstMC" изменяет переменную testvariable в "firstМС", кнопка в "secondMC" - переменную testvariable в "secondMC" .
Следует отметить, что три переменные с именем testvariable. являются тремя разными переменными. Находясь на разных уровнях, они как не связаны друг с другом.
Нажатие одной из кнопок меньшего размера изменяет значение переменной testvariable только на том уровне, где она расположена.
Вы можете изменять значение переменных не только на уровне, где не ходится код, но и на других уровнях при помоши синтаксиса ActionScript. Примером могут служить три кнопки большего размера, расположенные в нижней части экрана.
Все три кнопки находятся на рабочем поле, а не внутри клипов. Первая кнопка изменяет значение testvariable, не указывая определенна клип. В результате изменяется переменная testvariable рабочего поля.
Вторая кнопка указывает переменную testvariable внутри клипа "firstMC". Код выглядит следующим образом:
on (press) {
firstMC.testVariable++ ;
}
В результате изменяется переменная в клипе "firstMC". Для изменения переменной внутри клипа "secondMC", необходимо учитывать, что "secondMC" находится внутри "firstMC" и программе нужно это указать.
on (press) {
firstMC.secondMC.testVariable++;
}
Во всех приводимых до сих пор примерах имена копий клипов указывались прямо в коде. Существует и другой способ обращения к клипам - свойство _root:
_root["firstMC"].testVariable++;
Это удобно, если имя копии клипа содержит пробел, в таком случае данный метод является единственно возможным. Свойство _root используется также при создании более сложного кода, где надо представить имя клипа как строку для неявного указания этого имени. Применение данного метода будет рассмотрено в следующем разделе.
Копирование клипов
Важным аспектом создания игры является умение манипулировать клипами. Но сначала нужно научиться создавать клипы. Хотя во Flash это сделать несложно, вы, возможно, захотите, чтобы ваш код создавал клипы во время воспроизведения ролика.
Представьте себе игру, в которой космические корабли врага атакуют игрока. Приближается один корабль, за ним следующий и т. д. Вместо того чтобы заранее создавать сотни клипов, ваш код может создавать их по мере необходимости.
Существует два способа создания клипов: копирование существующего клипа и создание клипа из эталона, находящегося в библиотеке, но не используемого изначально на рабочем поле.
В первом случае используется функция duplicateMovieClip, при помоши которой создается дубликат существующего клипа. Приведем пример:
firstclip.duplicateMovieClip("newclip",0);
Функция duplicateMovieClip запускается копируемым клипом. Поэтому при ее использовании упоминается имя этого клипа, в данном случае "firstclip". Функция также содержит два параметра: имя новой копии клипа и уровень нового клипа.
Это может немного вас запутать. Термин "уровень" здесь (применительно к команде duplicateMovieClip) означает порядок расположения клипов. В предыдущем же разделе данный термин использовался для описания включения одного клипа в другой.
В случае, если клип создан на уровне 0, как в предыдущем примере, он располагается под клипом уровня 1. Клип уровня 1 находится под клипом уровня 2 и т. д.
Не беспокойтесь, что два клипа окажутся на одном уровне, Flash не позволит это сделать. Достаточно в каждой команде duplicateMovieClip указывать другой номер уровня.
Исходный файл: DuplicateMovieClip.fla
В примере DuplicateMovieClip.fla демонстрируется применение данной команды. В первом и единственном кадре главной временной шкалы пе ременная level имеет значение 0. На рабочем поле находится кнопа "new MC", а также клип "firstclip". Каждый раз при нажатии кнопки выполняется следующий код:
on (press) {
// Дублируем первый клип.
firstclip.duplicateMovieClip("newelip"+level,level);
// Помещаем его в случайную позицию.
_root["newclip"+level]._x = int(Math.random()*550);
_root["newclip"+level]._y = int(Math.random()*400);
// Увеличиваем счетчик.
level++;
}
Обратите внимание, что в коде ActionScript я в первый раз использовал комментарий. Строки комментария начинаются с двух косых черт. Содержание строки, следующей за косыми чертами, полностью игнорируется Flash и предназначено для того, чтобы вы понимали, какое действие выполняет код. Чем длиннее блоки вашего кода, тем больше они нуждаются во вспомогательных комментариях. Комментарии используются для последующего редактирования кода, а также для того, чтобы вашему коллеге было легче его понять.
В данной программе обработки переменная level используется по-разному. Во-первых, для присвоения имени новому клипу (сначала клипу присваивается имя newclip. Переменная также отображает уровень клипа В конце программы значение переменной level увеличивается на 1. Таким образом, следующий создаваемый клип будет называться level1 и располагаться на уровне 1. С помощью функции Math.random () мы задаем будущему клипу случайные координаты в пределах рабочего поля. Обратите внимание, ссылка на клип осуществляется при помощи синтаксической структуры _root []. Другой способ создания новых клипов - использование функции attachMovie. Для выполнения данной функции не требуется, чтобы клип находился на рабочем поле. Он должен просто быть в библиотеке. Однако, если клип находится в библиотеке и не используется на рабочем поле, Flash автоматически не включит его в конечный swf-файл. Для того чтобы клип был включен в конечный файл, его необходимо выбрать в библиотеке и настроить его параметры в диалоговом окне Symbol Linkage Properties, которое вызывается из меню Options. Диалоговое окно изображено на рис. 3.5.
Рисунок 3.5 Диалоговое окно Symbol Linkage Properties позволяет включать клип в swf-файл, даже если он не используется на рабочем поле
В окне следует установить флажок Export for ActionScript (Экспортировать для ActionScript). Затем вы должны придумать имя эталона, на которое будет ссылаться код. Я обычно использую имя эталона из библиотеки.
Исходный файл: AttachMovie.fla
Первым параметром функции attachMovie является имя из диалогового окна Symbol Linkage Properties. Второй параметр - это имя копии клипа на рабочем поле, третий - уровень клипа. Код данной кнопки, содержащийся в файле AttachMovie.fla, за исключением одной строки, полностью совпадает с кодом примера DuplicateMovieClip.fla.
on (press) {
// Дублируем первый клип.
attachMovie("myMovieClip","newclip"+level,level);
// Кладем в случайное место.
_root["newclip" + level]._x = int(Math.random!)*550);
_root["newclip"+level]._y = int(Math.random()*400);
// Увеличиваем счетчик, level++;
}
Исходный файл: RemoveMovieClip.fla
При помоши функции RemoveMovieClip вы можете удалять клипы с рабочего поля. Например, следующий код из файла RemoveMovieClip.fla перед созданием нового клипа удаляет предыдущий:
on (press) {
// Удаляем предыдущий клип.
_root["newclip"+(level-1)].removeMovieClip();
// Дублируем первый клип.
attachMovie("myMovieClip","newelip"+level,level);
// Кладем в случайное место.
_root["newelip"+level],_x=int(Math.random()*550);
_root["newclip"+level]._y=int(Math.randomf)*400);
// Увеличиваем счетчик.
level++;
}
Используя данные приемы, вы можете сделать так, чтобы ваши игры и приложения создавали свои собственные клипы, добавляя и удаляя их с рабочего поля по мере необходимости.
Управление несколькими клипами
Теперь, когда вы научились создавать клипы при помоши ActionScript, рассмотрим способы управления ими. Вы знаете, что можете управлять одним клипом с приписанным ему кодом, а если необходимо, управлять несколькими клипами? Что, если эти клипы ведут себя аналогичным образом?
Поместив клипы на рабочее поле, вы можете копировать код одного клипа и вставлять его в другие. Этот метод имеет несколько недостатков. Во-первых, необходимость копировать и вставлять. Затем, если вы захотите изменить код, вам придется сделать это во всех копиях клипа.
Пересечение объектов.
В игах часто происходят столкновения между различными объектами, причем иногда с весьма разрушительными последствиями. Давайте научимся создавать код, позволяющий отслеживать такие события, как пересечение двух объектов или, например, прохождение курсора над определенным объектом.
Основной способ обнаружения ситуации, в которой два объекта пересекаются или объект закрывает определенную точку экрана, - использовать функцию hitTest. Аргументом функции hitTest могут быть координаты какой-либо точки или ссылка на обьект, например клип, кнопку или текстовое поле.
Давайте начнем с проверки пересечения клипа с точкой. Предположим, вы хотите определить, находится ли курсор над определенным клипом на рабочем поле. Клипу следует назначить следующий код:
onClipEvent (enterFrame) {
if (this.hitTest(_root._xmouse,_root._ymouse,true)) {
this._x = int(Math.random()*550);
this._y = int(Math.random()*400);
}
}
Строка this.hitTest () обозначает, что функция hitTest применяется к текущему клипу. Она включает три параметра: горизонтальное и вертикальное положение мыши, а также булевый параметр (значения true/false). Последний параметр определяет, использует ли Flash для контроля пересечения прямоугольную область, в которой содержится данный клип, или точную форму изображения в клипе. Во втором случае параметр должен быть равен true.
Исходный файл: Runaway.fla
Вышеописанный код рассматривается в примере Runaway.fla. Если установить курсор над клипом, он переместится в случайную точку экрана.
Исходный файл: Collision.fla
Для того чтобы определить, пересекаются ли два клипа, вы можете использовать один параметр - указатель на второй клип. В ролике Collision.fla на рабочем поле находятся два клипа. Клип большего размера называется "target", меньшего - "bullet". За пределами рабочего поля расположен клип "actions" со следующим кодом:
onClipEvent (enterFrame) {
// Выясняем, попала ли пуля в мишень.
if (_root["target"].hitTest(_root["bullet"])) {
// Попадание, увеличиваем цель.
_root["target"]._xscale += 5;
_root["target"]._yscale += 5;
// Убираем пулю.
_root["bullet"]._x = 350;
} else {
// Нет попадания, пуля летит дальше.
_root [ "bullet" ] ._х -= 5;
}
}
Код задает перемещение снаряда на 5 пикселов. Если сталкиваются два клипа, мишень немного увеличивается за счет увеличения масштаба на 5%. Горизонтальная координата снаряда принимает первоначальное значение, и он может опять начинать свое перемещение. Вы научились изменять масштаб клипа и его положение. Далее вы узнаете другие способы, с помошью которых можно изменить внешний вид клипа.
Изменения содержимого экрана с помощью клипов
К сожалению, Flash не позволяет заменить один клип другам на рабочем поле. Единственным выходом будет удалить один клип и создать на его месте другой. Но если внешний вид клипа должен часто изменяться, необходим более быстрый способ.
Таким способом является создание клипа, который содержал бы все возможные состояния объекта. Например, если объектом является космический корабль, в ролик необходимо включить кадры, изображающие: космический корабль с выключенным двигателем, с включенным главным двигателем, включенным левым двигателем, с включенным правым двигателем, а также ряд кадров, представляющих взрывающийся космический корабль.
Исходный файл: Changingimages.fla
Данный пример демонстрируется в файле Changingimages.fla. Кнопки,расположенные слева от клипа, помогают выбрать отображаемую часть клипа. На рис. 3.7 изображен фрагмент ролика.
Рисунок 3.7 Ролик Changingimages.fla позволяет отображать различные вилы одного и того же объекта
Каждая кнопка ролика Changingimages.fla задает перемещение клипа в определенный кадр. Приведем пример кода кнопки Up:
on (press) {
ship.gotoAndStop("up") ;
}
Код кнопки Explode отличается от остальных, он использует команду gotoAndPlay, задающую перемещение клипа к кадру "explode" и продолжение воспроизведения:
on (press) {
ship.gotoAndPlay("explode") ;
}
Клип включает последовательность из восьми кадров, которая начинается с кадра "explode" и изображает взрыв. Последний кадр последовательности содержит команду stop, задающую остановку воспроизведения клипа после взрыва.
Просматривая ролик Changingimages.fla , обратите особое внимание на временную шкалу клипа "ship". Здесь кадры маркированы таким образом, что код использует не номера, а имена кадров.
Ввод команд с клавиатуры
В предыдущем примере каждой части клипа соответствовала одна из пяти кнопок. Хотя основным средством управления во Hash-роликах являются кнопки, иногда в играх используется и прямой ввод с клавиатуры.
Существует два способа ввода с клавиатуры. Первый подразумевает особый вариант использования кнопок. Второй способ предполагает только код, который проверяет нажатие клавиш в определенный момент времени.
Для применения кнопочного метода создайте обычную кнопку Flash. Она не должна представлять из себя ничего особенного, так как будет расположена за пределами рабочего поля. Если кнопке назначен следующий код, она будет реагировать на клавишу "r" и использовать ее для перемещения клипа:
on (keyPress "r") {
circle._x++;
}
Имейте в виду, что событие keyPress чувствительны к регистру. Это значит, что если кнопке назначена клавиша "r", она не будет реагировать на нажатие комбинации Shift+R.
Исходный файл: Keyboardbutton.fla
ДЛЯ обозначения движений лучше использовать клавиши с изображением стрелок, а не буквы. Для указания данных клавиш используется специальный синтаксис. Ниже приведен сценарий, позволяющий пользователю перемешать клип в четырех направлениях. Вы можете также найти данный сценарий в файле Keyboardbutton.fla.
on (keyPress "") {
circle._x++;
on (keyPress "") {
circle._x—-;
on (keyPress "") {
circle._y--;
on (keyPress "") {
circle. _у++;
} }
Клавиши не очень удобно использовать в ситуациях, требующих быстрых и плавных движений. В таких случаях при помощи кодового объекта Key вы сможете проверить, нажата ли кнопка.
Если для проверки нажатия клавиши используется кнопка, при удерживании клавиши пользователем действие будет повторяться. Это происходит потому, что большинство компьютеров запрограммировано на повторение при удерживании клавиши. Время между первым и вторым нажатием одной и той же кнопки, а также между последовательным нажатием разных кнопок определяется параметрами настройки клавиатуры системы пользователя. В играх, где пользователь может удерживать кнопку для повторения действия, не следует полагаться на функциональные возможности клавиатуры. Лучше применять функцию Key. isDown (), которая рассматривается в данном разделе.
Функция Key. isDown () позволяет проверить состояние клавиши. Например, чтобы проверить, нажата ли клавиша "r", используется следующий код:
if (Key.isDown("г") ) {
circle._x++;
}
Исходный файл: Keyisdown.fla
Такой код не может и не должен быть назначен кнопке. Он должен быть назначен клипу "actions", в данном случае в файле Keyisdown.fla. Код находится внутри программы обработки onClipEvent (enterFrame), поэтому проверка происходит в каждом кадре. Код проверяет нажатие клавиш с изображением стрелок, которые обозначаются специальными константами наподобие Key.RIGHT.
onClipEvent(enterFrame) {
if (Key.isDown(Key.RIGHT)) {
_root.circle._x++;
}
if (Key.isDown(Key.LEFT) {
_root.circle._x--;
}
if (Key.isDown(Key.UP)) {
_root.circle._y--;
}
if (Key.isDown(Key.DOWN) {
_root. circle._y++;
}
}
При запуске данного ролика вы обнаружите, что движения круга стали более плавными. Значение частоты смены кадров было увеличено до 120 кадр/сек, максимального количества, которое может обработать компьютер.
Итак, когда же отдать предпочтение кнопке, отзывающейся на нажатие клавиши, а когда объекту Key? Если нажатие клавиши необходимо только для активации события, используйте кнопку. Она будет реагировать на нажатие клавиши в 100% случаев. Функция Key.isDown() отреагирует на нажатие клавиши, только если она вызвана. Поэтому, если пользователь нажмет и тут же отпустит кнопку, нажатие может быть пропущено. Это часто происходит на медленных компьютерах.
Функцию Key.isDown() лучше использовать для контроля движения. В данном случае плавное движение будет продолжаться на протяжении всего времени удерживания клавиши. Функция может воспринимать одновременное нажатие нескольких клавиш, в то время как кнопка реагирует только на нажатие одной клавиши.
Воспроизведение звука
Завершая вводную часть нашего учебника по ActionScript, рассмотрим использование звука. Flash может воспроизводить звуки, помещая их временную шкалу ролика или клипа. Вы также можете запускать воспроизведение звука при помощи команд ActionScript.
Запуск звука из библиотеки представляет собой несколько более сложную процедуру, чем просто вызов одной команды. Прежде всего, необ холимо убедиться, что звук включен в конечный swf-файл. Это можно сделать в диалоговом окне Symbol Linkage Properties. Сам процесс был, рассмотрен на уроке 20 "Управление несколькими клипами". В данной случае предположим, что звук связан с именем "beep".
Воспроизведение звука задается при помощи нескольких строк кода. Сначала надо создать объект типа Sound. Затем объекту необходимо сообщить что "beep" - это звук, который должен воспроизводиться. Потом следует запустить звук. Вот как будет выглядеть код внутри сценария кнопки:
on (press) {
mySound = new Sound();
mySound.attachSound("beep");
mySound.start();
}
Функция start, которая используется со звуками, может включать два параметра. Первый - это задержка времени в секундах перед началом воспроизведения звука. В случае, если вы хотите пропустить первые три секунды, значение параметра будет 3. При обычном воспроизведении устанавливается 0. Вторым аргументом является количество циклов звука. Для воспроизведения 10 звуковых сигналов подряд используется значение 10.
Существует множество возможностей настройки звука. Наиболее важной из них является регулирование громкости. Если звук слишком громкий, вы можете изменить код ActionScript, а не переделывать звук. I
Для настройки громкости, значение которой варьируется от 0 до 100, используется функция setvolume. Ниже приведен тот же самый код, но с уменьшенным вполовину значением громкости:
on (press) {
mySound = new Sound();
mySound.attachSound("beep");
mySound.setVolume(50);
mySound.start();
}
Стоит также отметить функцию set Pan, которая может принимать значение от -100 до 100. Она позволяет контролировать баланс для стереозвуков, при этом -100 соответствует левой колонке, 100 - правой. При воспроизведении в режиме моно звук из одной колонки будет сильнее, чем из другой. Ниже приведен сценарий, задающий воспроизведение звука только из левой колонки:
on (press) {
mySound = new Sound();
mySound.attachSound("beep");
mySound.setPan(-100);
mySound.setVolume(100);
mySound.start();
}
Неудобно лишь то, что когда задается громкость или баланс, их значения остаются неизменными и при воспроизведении следующего звука. Поэтому данные параметры необходимо каждый раз настраивать заново. В противном случае новый звук будет воспроизводиться с настройками предыдущего.
Исходный файл: Sound.fla
Ролик Sound.fla содержит четыре кнопки. Большая кнопка в центре отвечает за обычное воспроизведение звука. Большие кнопки слева и справа предназначены для воспроизведения звука только из левой или из правой колонки. Маленькая кнопка в центре воспроизводит звук с громкостью 50%.
Вы узнаете больше о звуках в разделе "Музыкальный автомат" главы 6 "Игрушки и безделушки", а также в разделе "Музыкальный микшер" главы 7 "Игрушки-конструкторы".
На этом мы закончили изучение основ ActionScript. В следующей главе вы узнаете о таких приемах программирования, как планирование, отладка и тестирование. Затем, начиная с главы 5 "Создание визуальных эффектов", мы начнем рассматривать примеры программ.
Анализ задачи
Важно осознать, что если задача кажется слишком большой, чтобы с ней справиться, по-видимому, она таковой и является. Разбейте ее на более мелкие задачи, и вы найдете решение.
Достоинства
Flash имеет множество преимуществ над другими средами разработки игр. Несмотря на то, что программирование на языках низкого уровня, типа C++ или Java, более эффективно, оно не способно превзойти Flash в следующих областях:
• быстрая разработка - Flash позволяет создавать игры от начала до конца всего за несколько дней или даже часов;
• мультимедиа - Flash дает возможность импортировать и использовать различные типы графических изображений и звуковые форматы. Вы можете сотрудничать с художниками и звуковыми дизайнерами, не заботясь о необходимости конвертации файлов или каком-либо их изменении для использования в игре;
• простота использования - Flash очень прост в использовании. Такие функции как "drag and drop", меню команд ActionScript, панели и диалоговые окна позволяют быстро добавлять и изменять элементы и тратить минимум времени на утомительные процедуры;
• подача результатов вашей работы - несомненно, самым большим преимуществом Hash является способ подачи результатов вашей работы. Благодаря Flash-плагину для браузеров она может быть представлена на Web-странице для просмотра всеми желающими. Кроме того, вы можете создавать автономные проекты (просто отдельные swf-файлы), которые могут быть просмотрены практически на любом компьютере Мае или PC.
Более важно осознать недостатки, а не достоинства Flash. Вы не сможете создать очередной Quake или Age of Empires. С другой стороны, ваша игра будет иметь более широкую аудиторию и возможность более легкого распространения, чем эти крупнобюджетные игры.
Flash и игры
Изначально программа Flash предназначалась не для создания игр, а для подготовки анимаций и интерфейсов Web-сайтов. Возможность создания настоящих игр во Flash появилась только с введением ActionScript.
Фон
В некоторых играх графические изображения занимают весь экран. Другие игры занимают только часть экрана, при этом остается место для красочного фона.
Участниками большинства игр, рассматриваемых в данной книге, являются лисенок и его друзья. В качестве окружающей лисенка обстановки используется фон, изображающий лес и отдельные деревья.
Процесс создания игры.
Flash и игры
Элементы игры
Программирование
Вопросы авторских прав
Изменение игр, рассматриваемых в данной главе
Распространенные ошибки
Глобальные и локальные переменные
Имейте в виду, что если перед первым использованием переменной в функции не стоит ключевое слово var, то переменная является глобальной. В случае использования аналогичного имени переменной в другом месте функции ее значение может заменить значение предыдущей переменной. Допустим, вы используете переменную i в цикле for, а затем внутри данного цикла вызываете другую функцию, которая использует переменную i для своего цикла for. В таком случае значения переменных будут наложены друг на друга, и для того чтобы избежать этого, используйте разные имена переменных или синтаксическую структуру var.
Вы узнали много об ActionScript из глав 2 и 3, а также об общих приемах программирования из данной главы. Теперь вы готовы перейти к главе 5 "Создание дизайнерских эффектов при помоши ActionScript" и далее, к более сложным примерам программ на ActionScript.
Имена клипов
Каждый клип, расположенный на рабочем поле, имеет два имени. Имя под которым он включен в библиотеку, не имеет никакого значения вашего кода. В отличие от него имя экземпляра клипа на рабочем поле является крайне важным. Часто разработчики вообще забывают присвоить имена экземплярам клипа.
Изменение графики
Простейшим способом изменения игр для последующего размещения на Web-сайте является изменение графики. Вы можете использовать различные эталоны библиотеки и перерисовывать графические изображения или копировать изображения из ранее созданных Flash-роликов. Не изменяя код и не выполняя программирования, вы можете создавать довольно приличные игры.
Изменение игр, рассматриваемых в данной главе
Одна из причин, по которым стоило купить данную книгу, - тот факт, что вы можете использовать рассматриваемые в ней игры для создания своих собственных. Вы наверняка захотите изменить игры таким образом, чтобы они лучше подходили для вашей задачи и отражали ваш стиль.
Изменение кода ActionScript
В конце большинства примеров данной книги вы найдете советы по улучшению соответствующего проекта. Можно считать их своего рода упражнениями в ходе изучения программирования на ActionScript. Конечно, вы можете использовать и свои идеи по изменению игр.
Однако учтите, что добавление функциональных возможностей или изменение игры требует среднего или продвинутого уровня знаний. В случае, если вы не знаете, как внести необходимое изменение, не спешите продолжать и изучите необходимую информацию. В противном случае игра может не получиться.
Недостатки
Конечно, Flash не является идеальной средой для разработки игр. Ниже приведены причины, усложняющие программирование игр:
• построение вокруг временной шкалы - Flash-ролики представляют собой последовательность кадров на временной шкале. Хотя Flash является идеальной средой для создания анимаций, структура игр противоречит прямолинейному движению по временной шкале от кадра к кадру;
• медленная работа - по сравнению со своим старшим братом, Macromedia Director, Flash недопустимо медленная программа для разработчиков. Это ограничивает применение Flash для создания парных игр и игр-аркад с небольшим количеством простых элементов;
• двумерность - Flash не предусматривает создания трехмерной графики, а большинство игр сейчас использует именно 3D-rpaфику. Хотя некоторые программы способны импортировать 3D. графику во Flash, фактически результат все равно содержит лишь плоские изображения, прорисованные с трехмерных фигур. В настоящее время 3D является общепринятым графическим стандартом для игр. Тем не менее данный стандарт не распространяется на сетевые игры, которые обычно создаются с помощью Flash;
• ограниченный набор свойств - предположим, вы хотите добавить в игру какую-либо функцию и обнаружили, что Flash не может ее обработать. Если бы вы составляли программу на языке программирования более низкого уровня, например C++ или Java, у вас была бы возможность добавить эту новую функцию. Однако Flash - это Flash. Только Macromedia может включать новые функции во Flash. Это значит, что при создании игры необходимо идти на компромисс, особенно если ваша игра выходит за пределы возможностей Flash.
Нижнее подчеркивание
Небольшой ошибкой является пропуск нижнего подчеркивания (_) перед большинством встроенных параметрово Flash. Допустим, у вас есть клип под названием "myMovieClip". Тогда myMovieClip._x будет обозначать его горизонтальное положение, но myMovieClip.х - просто переменную х внутри клипа "myMovieClip".
Объединение игр
Обычным приемом программистов является объелинение двух уже существующих игр целью создания новой. Вы можете попробовать создат такую игру, используя игры данной книги. Однако эта задача требует опыта программирования, поэтому не расстраивайтесь, если все сразу не получится.
Следующий раздел поможет всем, кто собирается изменять игры, избежать распространенных ошибок.
Окно загрузки
Ролики Flash загружаются в браузер пользователя потоком. Это значит, что их воспроизведение начинается только после загрузки первой части ролика и с таким расчетом, что ко времени начала воспроизведения второй части он уже будет полностью загружен. Все происходит aтоматически, хотите вы этого или нет.
Автоматическая загрузка данных хороша для анимации, но не всегда для игр. В большинстве случаев ActionScript контролирует появление элементов на рабочем поле и не контролирует анимационную временную шкалу. Flash недостаточно умная программа, чтобы понимать, какие элементы вам нужны в первую очередь, и часто не загружает их во время передачи данных.
По этой причине в играх следует избегать автоматической загрузки. Лучше сделайте первый кадр или сцену ролика окном загрузки. Окно загрузки отображает сообщение для пользователя и не переходит дальше, пока не будет загружен весь ролик. Это предоставляет вам полный контроль над элементами, которые видит пользователь и не ставит вас в зависимость от того, какие элементы загружены, а какие нет.
Более подробно о создании окон загрузки рассказано в главе "Сложные приемы" .
Окно завершения игры
Очень часто конец игры оформляется в виде специального окна. В некоторых играх в случае выигрыша загружается одно окно, в случае проигрыша - другое. Необязательно игры заканчиваются выигрышем или, проигрышем, некоторые из них завершаются в случае, если игрок истратил все боеприпасы, жизни или время. Иногда окно завершения игры отображает список игроков, набравших самое большое количество очков, и дает игроку возможность внести свое имя в данный список. Создание списка победителей рассматривается в главе "Сложные приемы".
Отладка
Всем программистам приходится отлаживать создаваемые ими программы. Невозможно добиться безупречной работы программы при ее первом запуске. Хороший специалист должен уметь отлаживать программу.
Помимо использования отладчика ActionScript, отладку можно производить различными способами. При пробном воспроизведении ролика в окне Output могут появляться сообщения об ошибках. Иногда этого достаточно, чтобы вы поняли, в каком месте кода у вас проблемы.
Информация о программе может также размещаться в окне Output при помоши команды trace. Она поможет вам отследить определенные моменты программы и значение некоторых переменных в эти моменты.
Если же вы хотите воспользоваться программой отладки, советуем вам изучить соответствующую информацию в руководстве по Flash MX. Программа отладки является простым инструментом, позволяющим отображать значения переменных во время воспроизведения Flash-ролика. Однако она не в состоянии творить чудеса; программа отладки может только помочь вам разобраться в собственном проекте.
Правила
Важным элементом игры являются правила. Во многие игры можно играть и без правил, однако о них стоит позаботиться, так как некоторым людям нравится их читать.
В других играх правила могут располагаться в отдельном окне. Если игра сложная, правила иногда излагаются в нескольких окнах, представляющих своего рода учебник.
Еше один вариант - вообще не включать правила в игру. Правила некоторых моих игр содержатся на отдельной HTML-странице Web-сайта. При этом пользователь получает возможность открыть правила в отдельном окне и просматривать их, не отвлекаясь от игры. Это также позволяет предоставлять правила на других языках.
Правила программирования
Во время изучения программирования следует придерживаться некоторых правил, которые помогут облегчить вашу работу. Эти правил выполняют программисты всего мира, использующие все языки программирования:
• комментарии - следует приобрести привычку добавлять к коду комментарии. Даже строки, кажущиеся ясными в данный момет могут стать непонятными, если вы вернетесь к ним через месяц;
• имена переменных - используйте имена переменных, отражюшие их назначение. Они дополнят комментарии и помогут понять код, когда вы вернетесь к нему позднее;
• имена функций - все вышесказанное относится и к именам функций. Они должны описывать выполняемые ими действия;
• чем короче, тем лучше - во Flash нет ограничения на длину функции. Тем не менее, если вы напишите функцию длиной в 100 строк, позднее вам будет непросто ее редактировать. Лучше разбить функцию на задачи и поместить каждую задачу в отдельную функцию;
• включайте в код многократно используемые функции - во время программирования не забудьте подумать о том, как можно применить ту или иную функцию к схожей или аналогичной задач другой части вашей программы. Допустим, вам необходима функция, добавляющая одно очко к счету игрока. Постарайтесь использовать в ней параметр , позволяющий добавлять к счету не только одно, но и любое другое количество очков;
• старайтесь обходиться без жесткого кодирования - под жестким кодированием подразумевается включение в ваш код конкретных чисел. Допустим, для описания правой стороны рабочего поля в вашем коде используется значение 550, оно будет жестко закодировано в программу. Если вы решите расширить рабочее поле ас 600 пикселов, вам придется изменять каждое употребление значения 550 в коде. Лучше в самом начале задать переменной под названием screenRightSide значение 550 и использовать эту переменную на протяжении всей программы;
• хорошая организация - хороший программист, несомненно, должен уметь организовывать различные элементы программы. На-пример, функции следует помешать не в разные кадры, а в один кадр вашего ролика. Кроме этого, старайтесь сгруппировать функции согласно выполняемым ими задачам.
Программирование
Не думайте, что изучив главу "Введение в ActionScript" и главу "Элементы ActionScript" для создания игр", вы уже научились программировать. Существует разница между умением создавать код на ActionScript и опытом программирования.
Большинству людей программирование дается трудно, мне легко. Но у меня научная степень по вычислительной технике и я занимаюсь программированием уже 18 лет. Не имея аналогичного опыта, не следует ожидать быстрых результатов.
Вот некоторые принципы, руководствуясь которыми, вы сможете научиться программировать. Как и любой навык, программирование требует времени для изучения. Вы обнаружите, что чем больше вы программируете, тем легче оно вам дается.
Распространенные ошибки
Независимо от того, изменяете ли вы игру или создаете свою собственную, время от времени вы будете сталкиваться с ошибками. Обычно это несерьезные ошибки, которые легко обнаружить и исправить. Вот некоторые ошибки, с которыми я столкнулся при создании игр во Flash.
Splice и Slice
Еше одна ошибка - случайное использование в массиве функции slice вместо функции splice, предназначенной для удаления элемента массива. Пропущенное "р" может ускользнуть от вашего взгляда, а разница выполняемых функций приведет к возникновению ошибок.
Свойства связи
Если для создания копий эталона используется команда attachMovie, необходимо выполнить соответствующие настройки в диалоговом окне Symbol Lynkage Properties, в том числе присвоить ему имя. Таким образом, присвоить клипу имя можно тремя способами: в библиотеке, в копии клипа на рабочем поле, а также в диалоговом окне Symbol Linkage Properties.
Тестирование
Следующим этапом отладки является тестирование ваших игр другими людьми. Тестирование является важным аспектом, особенно, если игра разрабатывается вами на профессиональном уровне. Будучи программистом, вы не сможете объективно оценить работу своего детища и его недостатки.
Вы наверняка узнаете много нового, когда кто-нибудь в первый раз начнет играть в вашу игру. Вы даже и не представляли себе, что он будет щелкать по таким элементам. Он может перетаскивать элементы за пределы рабочего поля или помешать туда, где их не должно быть.
Обычно перед официальным представлением широкой аудитории игра проходит два этапа проверки. На первом этапе (альфа-тестирование) игра тестируется вашими коллегами или друзьями. Бета-тестирование осуществляется людьми, не имеющими отношения к вашей компании или сети. На обоих этапах вы должны получать сообщения об обнаруженных проблемах и по мере их исправления выпускать обновленные варианты игры.
К сожалению, часто при синтаксически верном коде программа выдает неожиданные результаты. Например, поскольку Flash не нуждается в специальном объявлении переменных, то он запросто съест имя несуществующего объекта (вы вполне могли ошибиться при вводе имени) и будет честно выполнять все назначенные ему действия
Дефектами программы считаются не только ошибки, но и несоответствуюшее содержание игры, и отсутствующие функции. Постарайтесь максимально усовершенствовать свою игру, прежде чем заявлять о том, что она закончена.
Титульное окно
Титульное окно представляет собой красочную заставку, представляющую игру пользователю. Иногда я позволяю своим иллюстраторам вволю поэкспериментировать, чтобы создать действительно эффектную заставку.
Вспомните старые игровые автоматы 80-х. Хотя графика самой игры могла отображаться большими пикселами, автомат обычно был оформлен детально и красочно. Это один способ представления статичных элементов титульного окна.
Другой способ - расположить часть графических изображений и клипов игры вокруг названия. Используя для заставки графику из игры, вы сможете избежать увеличения размера файла игры.
Уровни клипа
Еще одной распространенной проблемой является место расположения переменной. Например, если переменная включена в сценарий, назначенный клипу, она будет находиться на уровне этого клипа, а не на уровне главной временной шкалы. Для обрашения ко всем переменным вашего ролика используется точечный синтаксис, однако место расположения переменной можно легко забыть.
Вопросы авторских прав
Теперь, зная основы ActionScript, вы планируете заново создать вашу любимую игру 80-х, я прав? А вы когда-нибудь задумывались о том, что она может охраняться авторским правом?
Разместив что-либо на своем Web-сайте или сайте вашей компании, вы становитесь издателем. В издательском деле принято защищать свою работу от копирования. Если вы воссоздадите существующую игру и разместите ее на Web-сайте, на вас могут подать в суд за нарушение закоь об авторских правах.
К вопросу авторских прав разные компании относятся по-разному. Некоторые заявляют о своих правах даже на идеи популярных жанров компьютерных игр. Другие компании не беспокоятся о том, что их игры копируются и даже имеют в точности такие же названия, как и оригиналы.
Если вы считаете, что ваша игра похожа на одну из ранее опубликованных, проконсультируйтесь с юристом. Судя по моему опыту, юристы дают один из двух советов. Они могут объяснить вам, что это непростой вопрос, и вы должны быть осторожны. Вряд ли этот совет принесет пользу. Другим советом будет не рисковать и вообще не публиковат игру. Здесь есть здравый смысл, поскольку вы спрашиваете юриста о том, как избежать проблем, и он советует вам, как это сделать. Тем не менее данный совет не решит вашей проблемы в случае, если вы собираетесь создавать игры.
Первым делом необходимо ознакомиться с игрой, которую вы собираете создавать. Например, разработчиком игры "Othello" является производитель игрушек, которому наверняка не понравится, если вы создадите под тем же названием. Однако игра "Reversy" - это та же игра. "Reversy" считается игрой старого образца, наподобие "Chess" или "Checkers", Вопрос с другими играми более очевиден: "Scabble" запрещено копировать,если у вас нет разрешения владельца. "Backgammon" может свободно распространяться и копироваться. Другое дело - игра "Yahtzee", принадлежашая компании Milton Bradley, хотя ей предшествуют аналогичные игры "Poker Dice Yacht", считающиеся эталоном.
Задача данного раздела - поставить вас в известность о существовании подобной проблемы. Тем не менее, я не могу предложить другого выхода, кроме обращения к юристу.
Имейте в виду, что игры, рассматриваемые в данной книге, предназначены для использования в этом и других вариантах на вашем Web-сайте и в других проектах. Все эти игры являются общими концепциями, наподобие головоломок.
Добавление ребер
Восемь точек куба создают довольно точную иллюзию трехмерного объекта, но вы можете усовершенствовать модель. Если добавить линии для каждого ребра фигуры, она приобретет еше больше сходства с кубом даже когда не вращается.
Во Flash динамические линии создаются на основе библиотечного эталона, содержащего простую линию. Линия начинается в центре клипа и тянется вправо и вниз. Она простирается ровно на 100 пикселов по горизонтали и по вертикали. В панели Properties необходимо установить толщину линии как hairline. На рис. 5.11 изображено основное окно Flash, которое содержит такую линию. Обратите внимание, что шаг сетки составляет 50x50 пикселов.
Рисунок 5.11 Клип простой линии используется для создания динамических линий на рабочем поле
У куба 12 граней, следовательно, вам необходимо 12 линий. Вместо того чтобы задавать координаты х, у и z обоих концов каждой линии, вы можете использовать две точки, уже имеющиеся в массиве points. Каждая линия имеет два параметра: p1 и р2.
// Создаем массив из 12 линий для граней куба,
function makeLinesO {
lines = new Array ();
lines[0] = {pi: 0, p2: 1};
lines[1] = {pi: 1, p2: 2};
lines[2] = {pi: 2, p2: 3};
lines[3] = {pi: 3, p2: 0};
lines[4] = {pi: 4, p2: 5};
lines[5] = {pi: 5, p2: 6};
lines [6] = {pi: 6, p2: 7};
lines[7] = {pi: 7, p2: 4};
iines[8] = {pi: 0, p2: 5};
lines[9] = {pi: 1, p2: 6};
lines [10] = {pi: 2, p2: 7J} ;
lines [11] = {pi: 3, p2: 4J];
for(i=0;i<lines.length;i++) {
attachMovie("line","1ine"+i,50+i)
}
}
Вышеописанная функция создает 12 клипов. Каждый клип получает имя linex, где х - номер линии в массиве lines.
Чтобы динамически нарисовать во Flash линию, надо задать положение клипа, который ее содержит, в первой точке, затем измененить масштаб клипа и определить положение конца линии во второй точке. Так как начало линии находится в центре клипа, в первой точке задается ее верхний левый угол. Масштаб определяет протяженность линии по горизонтали и вертикали, поэтому, задав его значение равным разнице координат х и у начальной и конечной точек, вы разместите линию нужным образом.
К примеру, если вы хотите, чтобы ваша линия начиналась в точке с координатами (50,80) и заканчивалась в точке с координатами (170,210), то надо задать первую точку, присвоив переменным _х и _Y значения 50 80 соответственно. Затем вы должны вычислить разницу координат по горизонтали: 170 - 50 = 120. Разница координат по вертикали будет следующей: 210 - 80 = 130. Задав значения переменных _xscale и _yscale равными 120 и 130 соответственно, вы получите линию с начальными координатами (50,80) и конечными координатами (170,210).
// Рисуем грани куба,
function drawLines() {
for(i-0;i
loci = plotPoint(points[lines[i].pi]);
Ioc2 = plotPoint(points[lines[i].p2]);
this["line"+ij._x = locl.x;
this [ "line"+i] ._y = locl.y;
this["line"+i]._xscale = loc2.x-locl.x;
this["line"+i]._yscale = loc2.y-locl.y;
this["line"+i]._alpha = loc1.z+100;
}
}
Важно, чтобы высота и ширина клипа линии была равна 100 пикселам. Тогда масштаб 100% будет соответствовать 100 пикселам по ширине и высоте, 200% - 200 пикселам и т. а. Параметр толщины линии должен быть определен как "hairline", чтобы масштабирование не оказывало никакого влияния на ее толщину. Линия любой другой толщины, например 1, изменит свой масштаб соответственно изменению переменных _xscale и _yscale.
Все, что осталось сделать для того, чтобы к кубу были добавлены грани, - это задать вызов функции makeLines при запуске ролика, а также функцию drawLines из функции reposition. На рис. 5.12 показан полученный результат. Весь ролик вы можете увидеть, запустив файл 3Dcube.fla.
Рисунок 5.12 Трехмерный куб, состоящий из точек и пиний
Другие возможности
Изменив оператор += на -= в последней строке кода, вы заставите спираль вращаться в обратном направлении. Вы можете также изменить способ смены цветов, изменив значения красной, зеленой и синей составляющих.
Вы можете поместить на экран дополнительные пятна, скопировав клип пятна и убедившись, что ему назначен аналогичный сценарий. На экране может быть столько пятен, сколько вы хотите.
На экране также может быть две и более царапины. Различные части вашей анимации могут содержать различное количество царапин и пятен в зависимости от того, лучшего или худшего качества пленку вы хотите сымитировать.
Для создания следа за курсором вы также можете использовать клипы содержащие собственную анимацию. Таким образом вы можете попробовать получить эффект сверкающего пламени или дыма.
Создание визуальных эффектов.
Увеличение кнопок
Вращающаяся и изменяющая цвета спираль
Случайность и эффект старого кино
Перемещение букв
След от курсора
Эффект трехмерности
Эффект трехмерности
Исходные файлы: 3d.fla, 3dcubepoints.fla, 3dcube.fla, 3dspaceship.fla
Другим часто применяемым специальным эффектом Flash является моделирование небольшого трехмерного объекта. Некоторые разработчики говорят, что Flash не позволяет создавать настоящую трехмерную графику, но это не может сделать ни одна компьютерная программа поскольку компьютерные мониторы двумерные.
Вся компьютерная трехмерная графика - это всего лишь иллюзия. Хотя Flash и ActionScript не могут похвастаться большими возможностями для создания трехмерных объектов, с их помощью нетрудно создать некоторые специальные эффекты. Используя законы тригонометрии, вы можете преобразовать трехмерные координаты в двумерные на экране и смоделировать простые объекты наподобие куба.
К сведению
Частота смены кадров ролика определяет скорость вращения спирали и смены цветов. Максимальная частота во Flash MX -120 кадр/с. Однако следует иметь в виду, что частота смены кадров напрямую зависит от быстродействия компьютера.
Рисунок 5.4 Спираль изменяет цвет и вращается
И пятна и линию лучше поместить справа, за пределами рабочего поля, чтобы их не было видно при запуске ролика. Затем они будут периодически появляться в случайных местах.
Убедитесь в том, что сценарии находятся на своих местах. При воссоздании ролика не стоит полностью полагаться на текст данной книги. В вашем распоряжении имеются примеры. Поскольку ролик состоит из различных элементов, таких как копии клипов, местоположение сценария и имена объектов, рекомендуем вам вначале подготовить ролик на основе примера , и только после этого создавать его самостоятельно с самого начала.
После выполнения данного упражнения у вас должно получиться несколько клипов и сценариев ActionScript, которые вы можете помещать в любую Flash-анимацию, чтобы создать эффект старого кино.
Позиция клипа Letter0 определяет позицию первой буквы конечного текста, поэтому советуем вам внимательнее отнестись к его расположению и немного поэкспериментировать.
Меняя параметр speed, вы можете изменять длину "хвоста". Значение этой переменной также влияет на скорость исполнения ролика, так как если значение speed маленькое, например 1, то программе приходится одновременно управлять сотней клипов. Другие возможности
Объект Color
Объект Color предназначен для изменения цветов клипа. Его можно представить как набор функций, позволяющих узнавать и управлять цветами клипа.
Сначала надо создать объект Color, связанный с клипом, который вы собираетесь изменять. Это можно сделать следующим образом:
myColorObject = new Color("myMovieClipName");
Объекты наподобие Color построены по образу телевизионного пульта управления. Клип можно представить как телевизор, а объект Color как особый пульт управления, предназначенный для настройки цветовых параметров изображения. Методы объекта Color используются аналогично кнопкам пульта управления.
Существует два способа определения и изменения цветового объекта. Первый - это непосредственно определить цвет при помощи двух строк кода. Сначала создайте новый flash-ролик и поместите на рабочее noле один клип. Назовите копию клипа "myMovieClip". Затем поместите следующий сценарий в главную временную шкалу:
myColorObject = new Color("myMovieClip");
trace(myColorObject.getRGB()).toString());
He забудьте o том, что существует различие между именем эталона клипа в библиотеке и именем конкретного экземпляра клипа на рабочем поле. ActionScript всегда ссылается на имя экземпляра клипа. Имя в библиотеке предназначено исключительно для организационных целей
Во время тестирования ролика автоматически откроется окно Output, в котором будет содержаться значение " 0". Это результат выполнения команды trace.
Функция toString преобразует многие типы ActionScript, например числовые в строку текста. Она, например, удобна для преобразования цветов в числовые значения для вывода при помоши команды trace.
Более интересный результат.можно получить, изменяя цвет ролика. Чтобы это сделать, выделите клип и на панели Properties выберите в выпадающем кэшем меню Color пункт Advanced, после чего нажмите кнопку Settings. В появившемся окне Advanced Effect введите значение 128 в поля R,G и В. Введите значение 128 в поля R, G и В (рис. 5.3) в правой колонке. В левой колонке выставьте значение 0.
Рисунок 5. 3 Панель Advanced Effect предназначена для изменения цвета клипа
Теперь при тестировании ролика в итоговое окно будет помешено значение 8421504, что соответствует значениям 128 полей R, G и В. Немного изменив функцию tostring, вы вместо десятичного значения получите шестнадцатеричное. Оно будет выглядеть как значение RGB, используемое дизайнерами для задания цветов.
myColorObject = new Color("myMovieClip");
trace((myColorObject.getRGB()).toString(16));
Описание new позволяет создавать новые копии объектов наподобие объекта color. Оно также используется для создания новых массивов и ваших собственных объектных конструкций. Если на данном этапе оно не понятно, не беспокойтесь. Для того чтобы использовать описание new, полное понимание не требуется.
Результатом в данном случае является значение 808080, шестнадцатеричное число, представляющее собой средний серый цвет (красная,'зеленая и синяя составляющие, которые имеют значение 128, среднее между 0 и 255). Значение 16 в качестве параметра функции toString () задает преобразование числовых значений в шестнссшатеричные. Теперь, когда вы умеете получать RGB-значение цвета клипа, следующим шагом будет его изменение. Это можно сделать при помощи функции set RGB. Она имеет только один параметр: шестнадцатеричное значение, которое вы хотите использовать. Приведем пример с тем же роликом, но с несколько измененным кодом:
myColorObject = new Color("myMovieClip");
myColorObject.setRGB(OxFFOOOO);
Сочетание Ox указывает, что за ним следует шестнадцатеричное число. Приведенное в коде число FF0000 соответствует красному цвету. При запуске цвет ролика изменится на красный независимо от исходного. Действие этих двух строк кода продемонстрировано в примере Color-change. fla
Перемещение букв
Исходный файл: Textfly.fla
Во многих Flash-роликах по экрану перемешается текст. Существует множество способов создания этого эффекта, некоторые из них проиллюстрированы примерами.
Подготовка ролика
Ролик содержит несколько кнопок. Каждая кнопка представляет собой отдельный ролик с кнрпкой внутри. Из одного библиотечного эталона кнопки я создал пять разных клипов. В каждый клип поместил одну и ту же кнопку, но разный текст.
Кнопка может иметь любую форму и цвет. Я использовал классический стиль, поскольку хотел просто продемонстрировать работу сценария.
В данном ролике будет использоваться один элемент - спиральная фигура. Поместите его в центр рабочего поля. Начальный цвет спирали должен быть белым, а фоновый - черным. Ролик будет состоять из одного сценария, назначенного клипу с изобрел жением спирали. Переменная п, участвующая в сценарии, содержит способ изменения цвета. Значение цвета будет соответствовать числу из предыдущего списка. Так, например, если n будет равно 3, значение красной составляющей увеличится. Значение переменной п сначала равно 1, затем увеличивается до 6 и далее цикл повторяется. Ниже приведена часть кода с последовательностью if...then, которая использует значение переменной n и изменяет объект преобразования цвета.
if (n == 1) {
colorTransform.rb -= 5;
if (colorTransform.rb ==0) n = 2;
} else if (n == 2) {
colorTransform.bb -= 5;
if (colorTransform.bb ==0) n = 3;
} else if (n == 3) {
colorTransform.rb += 5;
if (colorTransform.rb == 255) n = 4;
} else if (n == 4) {
colorTransform.gb -= 5;
if (colorTransform.gb == 0) n = 5;
} else if (n == 5) {
colorTransform.bb += 5;
if (colorTransform.bb == 255) n = 6;
} else if (n == 6) {
colorTransform.gb += 5;
if (colorTransform.gb == 255) n = 1;
}
Оператор += используется для прибавления к переменной определенного числа. Например, код n += 5 прибавляет 5 к значению n. тот код аналогичен коду n = n + 5. Оператор =- используется для вычитания определенного числа из переменной.
Значение переменной n проверяется в каждой части выражения if...then. В случае совпадения одна из трех цветовых составляющих объекта colorTransform изменяется. После окончания изменений, сама переменная п меняет свое значение на следующие. Полная профамма представляет собой обычный клип ActionScript с функциями onClipEvent (load) и onClipEvent (enterFrame). Первая вводит объекты цвета и преобразования, вторая выполняет постепенное изменение цветов. Кроме того, мы сделаем так, чтобы клип вращался. Вращение достигается постепенным увеличением значения параметра _rotation.
В качестве примера использования случайных чисел создадим один из популярных Flash-эффектов: сымитируем старую кинопленку. Обычно данный эффект достигается средствами анимации. Аниматор помещает небольшие точки и трещинки в различные кадры ролика, а также показывает линию, проходящую вдоль ролика и представляющую царапину на пленке.
Все эти эффекты легко создать в ActionScript. К примеру, царапину можно создать, поместив вдоль одной стороны ролика белую вертикальную линию.
Для того чтобы применить знания о случайных числах, вам прежде всего необходимо какое-нибудь исходное изображение, на которое будут накладываться царапины и пятна.
На рис. 5.5 показан фрагмент исходного ролика. В этом ролике пропеллер самолета вращается, а лиса моргает. Возможно, ваш ролик будет содержать больше анимации.
Рисунок 5.5 Простой анимационный ролик, использующий случайные пятна и царапины для создания эффекта старого кино
Помимо фонового изображения вам понадобятся клипы пятен и царапин для размещения поверх ролика. В примере Oldfilm.fla царапин представляет собой простую вертикальную линию внутри клипа. Пятно это небольшой овал внутри другого клипа.
Ролик включает графическое изображение, расположенное в центре экрана и совершенно не зависящее от текстового эффекта. Внутри ролика находится один клип, содержащий букву "А". Клип был создан из небольшого текстового окна. В панели Properties ему было назначено свойство Dynamic Text и присвоено имя переменной letterText (рис. 5.8).
Рисунок 5.8 В панели Properties вы можете назначить текстовой области свойство Dynamic Text и присвоить ей имя переменной
Затем текстовое поле преобразуется в клип при помощи команды Insert -> Convert To Symbol. Копия эталона получает имя letter0 и помешается в то место, где находится первая буква фразы, в данном случае в нижний левый угол.
Создадим простой клип с кружочком внутри. Цвет и размер вы может выбрать по своему усмотрению. В нашем примере мы сделали темно-голубую окружность диаметром 20 пикселов. Клипу присвоено имя "Cursor Trail" (След курсора), в панели Linkage Properties выставлен флажок Export for ActionScript и присвоено имя связи CursorTrail.
Теперь создадим клип с надписью "Actions". Поместим его вне пределов рабочей области. Этот клип будет использоваться только как носитель кода, поэтому его содержание может быть любым. Вы можете даже не создавать внутри него никаких изображений или текста - тогда на экране он будет отображаться в виде маленького кружочка.
В описываемых ниже примерах используются только точки и линии. Создать точку легко, однако линия должна соответствовать определенным условиям. Подробное описание приводится ниже.
Подход
Каждая кнопка реагирует на наведение и снятие курсора. При наведении курсора на кнопку обработчик получит новое значение масштаба. Если в начальный момент времени масштаб клипа (с кнопкой внутри) составляет 100%, то новое значение будет, например, 150%.
С каждым кадром сценарий будет постепенно изменять текущий масштаб: от 100% до 150% с шагом 10%.
После того как пользователь уберет курсор с кнопки, эффект будет обратным. Новое значение будет равно 100%, и с каждым кадром кнопка будет уменьшаться на 10%, пока не достигнет этого значения.
Во Flash 5 существует два способа генерирования случайных чисел. Первый - включить в код функцию Random, которая была в четвертой версии
программы. Эта функция выдает значение в диапазоне от 0 до значения,на единицу меньшего, чем аргумент. К примеру, функция Random (5) выдаст значение от 0 до 4.
Во Flash 5 появилась функция Math, random (). Возможно, что в следуюших версиях Flash функции Random уже не будет. Функщ Math.random() выдает число с плавающей запятой от 0,0 до 1,0.
Чтобы получить значение вне диапазона [0..1], результат функции Math. Random () можно умножить на какое-нибудь число. Например, умножение результата на 500 даст значение в диапазоне от 0,0 до 500,0. Функция int округляет результат в меньшую сторону. Использование этой функции в нашем случае позволит получить целое значение в диапазоне от 0 до 499. Приведем пример:
n = int(Math.random()*500);
Следующая короткая функция перемешает клип в случайное место экрана, имеющего размер 550x400.
onClipEvent(load) {
this._x = Math.random()*550;
this._y = Math.random()*400;
}
Использование вышеприведенной функции демонстрируется в ролике Randomlocation.fla. Запустите файл несколько раз, чтобы убедиться, что ролик каждый раз перемещается в другое место экрана.
Следующим шагом является создание случайных чисел и их использование для периодичности внесения хаотичности в ролик. Нижеприведенный сценарий перемешает клип в случайном направлении. Переменные dx и dy принимают значения в интервале от -5 до 5 и задают величину изменения координат клипа _х и _у соответственно (фактически dx и dy определяют скорость перемещения клипа). Переменные dx и dy изменяют свои значения в случайные моменты времени.
onClipEvent(load) {
dx = Math.random()*10-5;
dy = Math.random О*10-5;
}
onClipEvent(enterFrame) {
this._x += dx;
this._y += dy;
if (Math.random()> .
9){
dx = Math.random()* 10-5 ;
dy = Math.random 0*10-5;
}
}
Действие этого сценария демонстрируется в ролике Randommovement.fla. Эллипс перемещается по экрану случайным образом. Он даже может покинуть пределы рабочего поля, так как никаких ограничений в коде не задано.
Ролик создается следующим образом: текст делится на отдельные буквы каждая из которых представляет собой отдельный клип. Затем из случайных мест на экране эти клипы перемешаются в позиции, соответствующие исходному тексту.
Для того чтобы понять, как используются трехмерные координаты, вам необходимо знать основы аналитической геометрии. Это один из самых трудных разделов данной книги, поэтому, если изучение математики вас не привлекает, вы можете пропустить его и перейти к следующей главе.
С помошью ActionScript можно изменить большинство свойств клипов, которые находятся на рабочем поле. В некоторых случаях свойство можно изменить напрямую, в других случаях, например при смене цветов, необходимо использовать функции.
Окружности являются клипами, которые создаются и помещаются в опре деленную точку экрана в течение работы программы. В коде хранятся все существующие клипы. При каждом обращении к кадру программе просматривает массив, уменьшая размер и увеличивая прозрачность каждого клипа. Когда клип с окружностью становится невидимым, он удаляется; также удаляется соответствующий элемент массива.
Преобразование координат
Местоположение объектов на экране определяется двумя координатами: х и у. Объекты в трехмерном пространстве должны иметь три координаты: х, у и z. Последняя определяет глубину.
Для отображения объектов на рабочем поле необходима функция, преобразующая х, у и z в экранные координаты х и у. Кроме того, вы будете наклонять и вращать объекты. Поэтому функция преобразования должна учитывать базовые наклоны и вращение.
Учтите, что это самый сложный сценарий из тех, которые мы до сих пор рассматривали и, возможно, из всех сценариев данной книги.
Математическая функция Math.atan (arctg, арктангенс) используется для преобразования координат в угол, а функции Math.sin и Math.cos - для преобразования значения углов обратно в координаты. Таким o6разом, координаты точки преобразуются в угол и расстояние от центра плоскости. Затем точка поворачивается и вновь преобразуется в координаты. Данное действие выполняется один раз для вращения и один раз для наклона. В результате вы получите координаты х и у, которые можно использовать на экране компьютера.
Комментарии, содержащиеся в нижеприведенном коде, объясняют, какое действие выполняет каждая его часть. Затем приводятся пошаговые объяснения.
// Переводим трехмерные координаты в координаты на экране
// (делаем проекцию).
function plotPoint(object) {
(1) //Берем координаты объекта.
х = object.x;
у = object.у
z = object.z;
(2) // Вычисляем расстояние от центра, radius = Math.sqrt (x*x+y*y);
(3) // Вычисляем первый угол.
if (х == 0) angle = Math.atan(1000000);
else angle = Math.atan(y/x);
if (x < 0) angle += Math.PI;
(4) // Поворачиваем объект,
angle += rotation;
(5) // Вычисляем новые координаты,
realx = radius*Math.cos(angle);
realz = radius*Math.sin(angle);
realy = z;
(6) // Определяем новое расстояние от центра,
radius = Math.sqrt(realy*realy+realz*realz);
(7) // Вычисляем второй угол.
if (realz == 0) angle = Math.atan(1000000);
else angle = Math.atan(realy/realz);
if (realz < 0) angle += Math.PI;
(8) // Добавляем угол наклона сечения,
angle += plane;
(9) // Вычисляем координаты для экрана,
screenx = realx;
screeny = radius*Math.sin(angle);
screenz = radius*Math.cos(angle);
(10) // Центрируем положение объекта. screenx += 27 5; screeny += 200; (11) // Возвращаем новые координаты. return({х:screenx,y:screeny,z:screenz});
Интересно, что Flash распознает понятие бесконечности. Так, выражение Math.atan(1/0) будет вычислено с результатом 1,5707963267949, то есть Pi/2!
Функция Math.atan() преобразует линию в угол в радианах. Необходимо указать значение разницы между начальной и конечной точками линии по вертикали, разделенное на значение этой же разницы по горизонтали. Например, если значения координат начальной и конечной точек линии соответственно равны (200, 200) и (275, 250), то, . чтобы получить угол, необходимо записать Math, atan (75/50). Результатом будет значение .9828 радиан, что составляет примерно 56 градусов. В действительности функция Math.atan () немного сложнее, однако данный пример позволит вам создать общее представление о ней.
Опишем каждый шаг вышеприведенного кода: (1) Задаются координаты х, у и z объекта.
(2) Вычисляется расстояние на плоскости ху от центра координат до проекции объекта на плоскость.
(3) Определяется угол на плоскости ху.
(4) Значение угла увеличивается на величину поворота объекта.
(5) Задаются новые координаты х, у и z с учетом изменения угла.
(6) Задается расстояние от центра координат до объекта на плоскости yz.
(7) Определяется угол на плоскости yz.
(8) Задается наклон плоскости.
(9) Задаются новые координаты х, у и z с учетом наклона.
(10) Центр новых координат имеет значение 0. Для корректировки к ним прибавляется действительное значение центра экрана (в данном случае (275, 200)).
(11)Теперь координаты х и у могут использоваться для отображает объекта на экране. С помощью координаты z можно также снизить яркость объектов, которые должны казаться расположеными дальше от пользователя.
Функция plotPoint преобразует точки с трехмерными координатами в точки с двумерными координатами при помощи ортогональной проекции. Это означает, что перспектива здесь не используется, и объекты находящиеся на дальнем плане, не уменьшаются. Это подходит для моделирования небольших объектов и специальных эффектов, но не годится для создания больших трехмерных сцен.
След от курсора
Исходный файл: Cursortrail.fla
Рассмотрим спецэффект, создание которого невозможно без использования ActionScript. В нашем примере, когда пользователь перемещает мышь, за курсором остается характерный шлейф, состоящий из тающих копий изображения, привязанного к курсору.
На рис. 5.9 можно увидеть пример этого эффекта. Каждая из окружностей показывает предыдущую позицию курсора. Чем раньше создана окружность, тем она меньше и светлее.
Рисунок 5.9 Оставляя копии клипа в позиции, в которой только что находился курсор, можно создать след, тянущийся за курсором
Случайность и эффект старого кино
Исходные файлы: Randomlocation.fla, Randommovement.fla, Oldfilm.fla
Используя Flash исключительно в качестве инструмента анимации, можно добиться поразительных эффектов, но каждый раз анимация будет воспроизводиться одинаково. ActionScript имеет алгоритм выбора случайных чисел, благодаря чему в содержание ролика можно вносить элемент некой непредсказуемости.
Создание кода
В ролике используется два типа сценариев: назначенные кнопкам и назначенные клипам. Первый тип сценария назначен кнопке, находящейся в клипе. Сценарий, назначенный кнопке, реагирует на события мыши, происходящие именно с этой кнопкой. Такие сценарии - обработчики событий - мы уже рассматривали в уроке 6 главы 2, они реагируют на различные события и в случае кнопки задаются конструкцией on () { ... }.
Сценарий кнопки включает три различных обработчика, двумя из которых являются on (rollover) и on (rollout). Они устанавливают значение переменной newscale равным новому масштабу для увеличения или уменьшения кнопки.
Ниже приведен сценарий для кнопки "Home".
on (rollover) {
// Задаем новый размер для увеличения,
newscale = 150;
} on (rollout) {
// Задаем новый размер для уменьшения.
newscale = 100;
}
on (release) {
// Код, исполняемый при нажатии на кнопку.
trace("Home");
}
С помощью конструкции on в сценарии кнопок вводятся фрагменты кода, выполняемые после определенных событий. Такими событиями могут быть press, release, releaseOutside, rollover, dragOver, dragOut и keypress.
Каждый из трех обработчиков в вышеприведенном листинге содержит строку кода, выполняемого после определенного события кнопки, пример, когда пользователь нажимает и отпускает кнопку, выполняет команда trace. При этом слово "Home" помешается в окно Output.
На самом деле в таких случаях обычно используется команда getURl которая сообшает браузеру, что нужно перейти к новой странице. Команда trace приведена здесь только в качестве примера.
Переменная newscale является индивидуально задаваемой переменной и используется для хранения значения задаваемого масштаба клипа. Когда пользователь наводит курсор мыши на кнопку, ее размер увеличивается 150%. Когда он убирает курсор с кнопки, размер возврашается к 100%
Сценарий клипа помешается на один уровень выше, чем сценарий кнопки. На диаграмме (рис. 5.2) изображена главная временная шкала, клип содержащий кнопку, а также два сценария.
Сначала напишем код для царапины. Поместите копию клипа царапины на рабочее поле и назначьте ему следующий сценарий:
onClipEvent(load) {
wanderAmount = 300;
leftLimit = 10;
rightLimit = 540;
chanceOfJump = 50;
xPosition = 275;
speed = 10;
chanceOfChange = 0;
}
onClipEvent(enterFrame) {
xPosition += speed;
this._x = xPosition;
chanceOfChange++; if ((Math.random()*wanderAmount < chanceOfChange)
or (xPosition < leftLimit) or (xPosition > rightLimit)) {
speed = -speed;
chanceOfChange = 0;
}
if (Math.random()*chanceOfJump == 1) {
xPosition = Math.random()*(rightLimit-leftLimit)+leftLimit;
}
}
При вычислении результата математических функций с числами Flash осуществляет операции в следующем порядке: умножение и деление 8 выполняются перед сложением и вычитанием. К примеру, 2x3+4 будет равно 10. Лля изменения порядка выполнения операций необходимо использовать скобки. Например, 2х(3+4) будет равно 14.
Первая часть сценария вводит некоторые переменные. Переменные leftLimit и rightLimit описывают границы линии по горизонтали. Код не позволит ей выйти за пределы этих значений. Переменная speed определяет, насколько перемещается линия в каждом кадре. Остальные переменные задают изменения анимации.
В каждом цикле кадра горизонтальная позиция, xPosition, клипа изменяется с помощью переменной speed. Она задает перемещение клипа на 10 пикселов влево или вправо. Переменная chanceOf change увеличивается и о пределяет вероятность изменения. В случае, если переменная равна 1, существует один шанс из 300 (около 0,33%), что изменение произойдет в данный момент. К тому времени, когда переменная chanceOf Change примет значение 150, вероятность изменения составит 150 из 300 или 50%. Это хороший способ управления каким-либо событием, при котором оно происходит не слишком часто и не слишком редко. С помощью переменной chanceOf Change создается иллюзия случайности.
В данном случае "изменение" обозначает смену направления. Оно осуществляется путем изменения положительного значения переменной speed на отрицательное или наоборот. Изменение также происходит, если линия достигает правой или левой горизонтальной границы.
Другой вид изменения определяется переменной chanceOf Jump и представляет собой перемещение линии в совершенно другое место. Настоящие царапины на пленке появляются в разных местах, и такое перемещение делает ролик более реалистичным.
В процессе выполнения программы из одного клипа создается несколько его экземпляров. В каждом новом цикле при помощи функции duplitcateMovieClip создается новый экземпляр клипа для каждой из букв. После создания каждого экземпляра в него вводятся переменные еndx и endy, задающие окончательную позицию букв в анимации. Значение переменной endy соответствует позиции _у клипа Letter0, значение переменной endx увеличивается слева направо.
Сценарий создает новые копии клипа для букв начиная с той, которая идет под номером 1. Первая буква (она имеет номер 0) использует существующий клип Letter0.
text = "Introducing: Flashy the Fox!";
for (i=0;i<text.length;i++) {
if (i > 0) duplicateMovieClip("Letter0","letter"+i,i);
this["letter"+i].letterText = text.charAt(i);
this["letter"+i].endx = this["Letter0"]._x + i*19;
this["letter"+i].endy = this["Letter0"]._y;
}
Функция charAt выбирает из строки букву, расположенную в определенной позиции. Первый символ строки имеет номер 0. Для того чтобы выделить подстроку, используйте функцию substr.
Команда for позволяет создать небольшой цикл. Код внутри цикла выполняется заданное количество раз. Первый параметр после команды for используется для задания переменной. Второй параметр необходим для проверки, которая осуществляется перед каждым циклом и определяет, надо ли его продолжать. Третьим и последним параметром является команда, выполняемая в каждом цикле. Например, строка for (i=0; i< text.length; i++) обозначает, что переменная i начиная со значения 0 увеличивается на единицу в каждом цикле, и цикл будет продолжаться до тех пор, пока значение i меньше числа символов в тексте
Число 19 в конце пятой строки обозначает, что расстояние между буквами составляет 19 пикселов. Это значение устанавливается в зависимости от используемого вами типа и размера шрифта.
При создании данного эффекта лучше использовать моноширинный шрифт, в котором все буквы имеют одинаковую ширину, например Monaco, Courier и Courier New. В противном случае такие буквы, как "w" и "l", могут значительно отличаться по ширине. Использование шрифтов с различной шириной букв в рассматриваемом коде может привести к "склеиванию" символов.
Наш "actions"-клип содержит два обработчика onClipEvent. Первый включается в начале ролика и создает пустой массив, чтобы содержать ссылки на клипы, образующие хвост. Он также устанавливает счетчику trailNum значение ноль. Эта переменная содержит значение номера следующего клипа, который вы создадите.
Переменная speed определяет как быстро клипы, составляющие "хвост", будут уменьшаться в размерах и таять.
On ClipEvent(load) {
// Создаем массив,
trail = new Array();
trailNum = 0;
// Меньшее значение переменной соответствует меньшей
// скорости.
speed = 2;
}
Следующий обработчик начинается с создания экземпляра клипа. Каждому клипу присваивается уникальное имя вида cursor trail + trailNum Переменная trailNum используется также для определения уровня очередного клипа.
On ClipEvent(enterFrame) {
// Создаем очередной клип.
var mc=_root.attachMovie("cursor trail","cursor trail" + trailNum,trailNum);
}
Созданный клип помешаем в текущую позицию курсора.
//Устанавливаем позицию.
mc._x = _root._xmouse;
mс._у = _root._ymouse,
Указатель на новый клип добавляется в массив trail. Затем значение trailNum увеличивается на единицу.
// Добавляем указатель в массив. trail.push(mc);
trailNum++;
С помощью цикла в остальной части кода происходит обращение ко всем клипам массива trail. Размер и прозрачность каждого клипа изменяются на величину speed. Когда свойство _alpha текущего клипа становится меньше либо равно нулю, этот клип удаляется из массива и ролика в целом.
// Обращаемся к существующим клипам,
for (var i=trail.lenght-1; i>=0; i--) {
// Уменьшаем свойства _alpha и размер клипа,
trail[i]._alpha -= speed;
trail[i]._xscale -= speed;
trail[i]._yscale -= speed;
// Удаляем клип, когда он становится невидимым,
if (trail[i]._alpha
// Удаляем указатель из массива.
trail.splice(0, 1);
// Удаляем клип.
trail [i]. RemoveMovieClip();
}
}
}
Обратите внимание, что массив сканируется от конца к началу. Это сделано потому, что из массива время от времени удаляются элементы, бы массив сканировался от начала к концу, то при удалении элемента возникала бы путаница в порядке следования элементов. Например, если удалить первый элемент, то первым элементом станет второй. Тогда на следующем шаге цикла произойдет обращение к следующему за вторь элементу, то есть к третьему. Таким образом, второй элемент массу окажется пропущенным.
В следующих разделах описывается пошаговое создание трехмерных моделей в Flash. Начнем с кода, преобразующего трехмерные координаты в двумерные экранные координаты.
Трансформация цветов
Более универсальным способом изменения цвета является использование метода setTransform() объекта Color. Аргументом метода set-Transform является объект, содержащий восемь параметров цвета. Параметры rb, gb и bb задают относительное смещение в процентах (от -100% до 100%) для красной, зеленой и синей составляющих цвета соответственно. Параметры rb, gb и bb задают абсолютное (от -255 до 255) значение цветов. Последние два параметра - аа и ab определяют значение свойства _alpha (прозрачность) клипа. На рис. 5.3 изображены все шесть составляющих, плюс два значения преобразующих альфа-канал (прозрачность изображения). Объект преобразования цвета может содержать различные значения каждой из восьми составляющих. Эти значения задаются путем создания новой переменной-объекта. Приведем пример:
myColourTransform = {rb:255, bb:0, gb:0};
Данный объект задает изменение цвета любого цветового объекта на красный. Он включает три параметра: абсолютные значения красного, зеленого и синего цветов. Кроме того, вы можете задавать относительное смешение при помоши параметров rа, gа и bа. Имея объект преобразования цвета и цветовой объект, можно изменять цвет клипа. Следующие три строки изменят цвет клипа на красный:
myColor'= new Color("myMovieClip");
myColorTransform = (rb:255, bb:0, gb:0);
myColor.setTransform(myColorTransform);
В данном примере выполняется то же действие, что и в предыдущем, но другим способом. Преимущество функции setTransform над функцией setRGB состоит в большем контроле над значениями цветов. Например, числа, задаюшие цвет, могут быть переменными ActionScript, а не жестко закодированными числовыми значениями. Кроме того, эти значения могут периодически изменяться, тем самым периодически изменяя цвет объекта. Следующий клип изменяет значение красного цвета клипа от 0 до 255. В результате клип начинается с изображения черного эллипса, который затем постепенно меняет свой цвет на красный. Для создания цветового объекта и объекта трансформации цвета используется событие load. Там же создается переменная n. Следующее за ним событие enterFrame используется для преобразования цвета, применения преобразования к клипу и увеличения значения переменной n.
onClipEvent(load) {
myColor = new Color(this);
myColorTransform = {rb:255, bb:0, gb:0};
n = 0;
onClipEvent(enterFrame) {
myColorTransform.rb = n;
myColor.setTransform(myColorTransform);
n++;
}
Оператор ++ увеличивает значение переменной на единицу. Таким образом, если значение n равно 7, то строка n++ увеличивает его до 8. Для уменьшения значения используется оператор --.
В данном примере значение переменной n, описывающей красный цвет, изменяется от 0 до 255. При достижении максимального значения 255 цвет больше не меняется. Применение сценария демонстрируется в ролике Gradualtransform.fla. Вся эта информация о цветах и преобразовании может использоваться для создания специальных эффектов. Давайте попробуем сделать что-нибудь более интересное. Возьмем основной пример данного раздела и сделаем так, чтобы клип по очереди изменял свой цвет на один из цветов радуги. Для этого необходимо изменить красную, зеленую и синюю составляющие. Здесь будет использоваться та же самая функция setTransform, однако алгоритм изменения значений по сравнению с предыдущим примером будет более сложным. В качестве исходного для красного, зеленого и синего цветов берется значение 255, которое изменяется следующим образом:
1. Значение красного цвета уменьшается до 0.
2. Значение синего цвета уменьшается до 0.
3. Значение красного цвета увеличивается до 255.
4. Значение зеленого цвета уменьшается до 0.
5. Значение синего цвета увеличивается до 255.
6. Значение зеленого цвета увеличивается до 255.
При этом цвета белый, циан (cyan), зеленый, желтый, красный, фуксин (magenta), белый будут плавно превращаться из одного в другой в указанной последовательности. В ней участвуют все цвета, кроме чистогo синего. Так мы создадим изменяющую цвет спираль.
Углы куба
Теперь приступим к созданию восьми вершин куба. Данные о каждой вершине будем хранить в объекте со свойствами х, у и z. Весь список объектов хранится в массиве.
// Создаем массив из 8 точек для вершин куба,
function makePoints() {
points = new Array();
points[0] = {x: 30, y: 30, z: 30};
points[1] = {x: -30, y: 30, z: 30};
points[2] = {x: -30, y: -30, z: 30};
points[3] = {x: 30, y: -30, z: 30};
points[4] = {x: 30, y: -30, z: -30};
points[5] = {x: 30, y: 30, z: -30};
points[6] = {x: -30, y: 30, z: -30};
points[7] = {x: -30, y: -30, z: -30};
// Создаем восемь клипов для вершин куба,
for(i=0;i
attachMovie( "point", "point"+i, i )
}
}
Данная функция создает восемь клипов из эталона, хранящегося в библиотеке. Имя каждого клипа состоит из слова "point" и числа от 0 до 7. Число соответствует точке массива, которую представляет клип.
Команда attachMovie создает новый клип из эталона, хранящегося в библиотеке. Однако для того, чтобы его можно было воспроизвести во Flash player или на Web-странице, необходимо назначить ему свойство Export for ActionScript. Это можно сделать, выбрав команду Options -> Linkage в окне Library. Вы также должны назначить клипу идентификатор. В данном случае назовем его "point".
Кроме точек и функции, преобразующей их координаты в экранное представление, необходимо ввести небольшую функцию, которая бы соединяла линиями полученные точки. Помимо параметров_х и_у каждой точки клипа, задается также параметр _alpha, описывающий уменьшение яркости точек по мере их удаления вглубь экрана.
// Устанавливаем координаты точек и их яркость на экране,
function drawPoints() {
for(i=0;i
loc = plotPoint(points[i]);
this["point"+i]._x = loc.x;
this["point"+i]._y = loc.y;
this["point"+i]._alpha = loc.z+100;
}
}
Все вышеупомянутые функции должны помешаться в главную временную шкалу. Следующие строки вводят модель и подготавливают переменную rotation.
// Вызываем функцию инициализации и останавливаем
// воспроизведение ролика в этом кадре,
rotation = 0;
makePoints();
stop();
Теперь остается только обратиться к функции drawPoints. Обращение выполняется в небольшой функции reposition. Она изменяет переменную rotation в зависимости от положения курсора в правой или левой части экрана. Функция также задает переменную plane исходя из положения курсора по вертикали. Затем функция вызывает функцию drawPoints для задания текущей позиции каждой точки.
// Изменяем позицию куба в каждом кадре,
function reposition () {
rotation += (275-_xmouse)/1000;
plane =- (200-_ymouse)/100;
drawPoints();
}
Функция reposition вызывается в каждом кадре из клипа, который находится за пределами рабочего поля и предназначен для запуска данной части кода при каждом его повторе.
onClipEvent(enterFrame) {
_root.reposition ( );
}
Создание ролика практически завершено. Восемь точек на экране составляют куб, который вращается и поворачивается в зависимости от того, как пользователь перемешает мышь. Ролик можно посмотреть в 3dcubepoints.fla. Фрагмент этой анимации. изображен на рис. 5.10.
Рисунок 5.10 Трехмерный куб, представленный восемью точками на экран
Увеличение кнопок
Исходный файл: Expandingbuttons.fla
Многие сайты используют Flash для навигации от страницы к странице. Даже простой Flash-ролик с одной кнопкой может значительно оживить статическую Web-страницу. При помощи ActionScript вы сможете сделал эти кнопки анимированными.
к ним курсор мыши, не
Задача проекта - создать кнопки, которые в случае, если подвести к ним курсор мыши, не меняют цвет, а увеличиваются и затем, когда курсор убран, возвращаются к нормальному размеру. На рис. 5.1 изображенс пять подобных кнопок, курсор расположен над второй из них.
Рисунок 5.1 Если поместить курсор мыши над кнопкой, она увеличивается
Взглянув на рисунок, можно подумать, что когда на кнопку наводится курсор, она изменяет свой размер внезапно. Однако увеличение кнопки происходит не в одно мгновение, а постепенно, создавая приятный визуальный эффект. Посмотреть, как это выглядит, можно загрузив ролик Expandingbuttons.fla .
Задача этого проекта - создать ролик, который будет изображать вращающуюся спираль с постепенно меняющимися цветами. При этом вы изучите, как функционируют объект Color и свойство клипа _rotation.
Задача данного раздела - научиться использовать случайные числа для создания визуальных эффектов. Возможно, вы захотите создать "эффект старого кино", когда на изображении кое-где появляются царапины и точки.