Если вы уже освоили несколько графических редакторов, позволяющих создавать прекрасные, но статические изображения, вам необходимо попробовать создавать анимированную графику. Можно пойти простым путем и создавать анимированные картинки в формате gif. Это позволяют делать многие современные графические редакторы, такие как Photoshop, Corel Photo-paint и многие другие. Кроме того, для анимации статических изображений можно использовать специализированные программы-аниматоры, такие как Gif Animator или Macromedia Foreworks.

Их очень много, и перечислять их нет необходимости. Эти программы-аниматоры, объединяет одно свойство. Для создания эффекта анимации в этих программах создается последовательность кадров, состоящих из специально для этого созданных, в каком-либо графическом редакторе, отдельных gif-изображений, показывающихся через заданные промежутки времени. Эта система работает аналогично обычной кинопленке. Ее недостаток очевиден. Даже самые простые кадры (фреймы), включающие gif -изображения небольшого размера, имеют объем 2-3 Kb. При частоте показа 10 кадров в секунду каждая секунда такого gif-ролика будет занимать не менее 20-30 Kb. Поэтому создать что-либо выдающееся при таком жестком ограничении времени и дискового пространства очень трудно. Обычно анимированные gif-файлы работают циклически - в непрерывном режиме. Использование обычных видеоклипов на страницах web-сайтов также затруднено из-за большого размера файлов и связанных с этим трудностями при загрузке.

Но эти проблемы можно преодолеть при помощи программного обеспечения, созданного компанией Macromedia Inc. Этой компанией несколько лет назад был разработан новый графический формат Flash (с англ. - вспышка). Недавно на российском рынке появилась последняя версия программы - Macromedia Flash MX 6.0. Эта программа позволяет создавать очень динамичные яркие красочные анимированные изображения, занимающие очень малые объемы дискового пространства. Кроме того, используя возможности языка Action Script, в фильмы, созданные в формате Flash, можно встраивать различные действия, импортировать звуки, что открывает безграничные возможности для творчества. С помощью Macromedia Flash MX 6.0 можно создавать рекламные баннеры, интро для главных страниц сайтов, просто анимированные картинки для web-сайтов, очень красивые анимированные кнопки для web-страниц и различных интерфейсов, презентации и фотоальбомы (на CD-ROM или обычной дискете), в том числе и полноэкранные небольшие мультфильмы и даже довольно сложные игры. Но многие начинающие пользователи, не зная принципов работы программы и не работавшие с ранними версиями Macromedia Flash, осваивают ее с большим трудом.

Начнем с того, что сейчас, в основном, на рынок поступает англоязычная версия программы. Но параллельно с этим в Интернете появились неплохие русификаторы. Один из них можно загрузить с или . Размер файла этого русификатора чуть более 100 Kb, поэтому его загрузка займет совсем немного времени. Патч сжат в формате ZIP, поэтому, прежде чем его загружать, необходимо позаботиться о том, чтобы у вас был установлен какой-либо архиватор, позволяющий распаковывать ZIP-файлы. Для начинающего пользователя наиболее удобными являются такие программы, как, например, Zip Folders, позволяющие работать со сжатыми в ZIP-формате папками и файлами как с обычными. Загрузив и распаковав файл русификатора, вы обнаружите в его папке два файла: Readme, в котором очень толково описано, как установить русификатор, и файл Patch_Flash. Выделив щелчком мыши, скопируйте Patch_Flash. Затем с помощью проводника откройте папку Flash MX, где у вас уже должна быть установлена программа Macromedia Flash MX, и вставьте в эту папку файл Patch_Flash, запустите его двойным щелчком мыши. Patch_Flash создаст в папке программы Flash MX русифицированное приложение Flash.exe размером около 11 Mb, существующее англоязычное приложение при этом будет переименовано в Flash Backup.exe, и при желании, вы всегда сможете воспользоваться им, запуская его из папки Flash MX, т.к. из главного меню будет запускаться русифицированный вариант программы. Теперь все меню в программе Macromedia Flash MX 6.0 будут подробно (правда, правильность перевода некоторых команд в меню вызывает сомнение) переведены на русский язык, и неопытному пользователю будет намного легче ее освоить. Недостаток этого русификатора заключается в том, что Справка (Help) и комментарии к командам в панели Action Script остаются на английском языке. Но это поправимо, на сайте можно найти очень хороший учебник по Macromedia Flash MX 6.0, представляющий собой качественный перевод Helpa и дополненный авторами. Кроме того, для самостоятельного перевода можно воспользоваться любой программой-переводчиком, например Promt. Там же можно найти множество подробных и понятных рекомендаций по созданию различных flash-роликов и использованию для этого команд Action Script и готовые образцы (исходные файлы) различных flash-клипов. В Интернете имеется несколько десятков русскоязычных web-ресурсов с аналогичным содержанием. Найти их очень легко из любого поискового портала, сделав соответствующий запрос.

Итак, что же представляет собой программа Macromedia Flash MX 6.0? Запустив ее, можно обнаружить, что ее интерфейс очень простой, понятный и удобный. По внешнему виду он не сильно отличается от других текстовых и графических редакторов и не намного сложней, чем у Microsoft Word, которым умеют пользоваться многие начинающие пользователи. В верхней части окна программы расположена обычная строка главного меню и стандартная панель с кнопками "Открыть", "Создать" и т.д., ниже - панель "Временная диаграмма", т.е. диаграмма времени. На ней необходимо остановиться подробней. В левой части панели "Временной диаграммы" можно увидеть пиктограмму с изображением листа бумаги с наименованием - "Слой", справа от которого располагается линейка, разделенная равными делениями. Так вот, эта разделенная на равные участки линейка представляет собой аналог кинопленки, состоящей из отдельных кадров. Каждое деление этой линейки и есть кадр создаваемого вами клипа. В нижней левой части "Временной диаграммы" есть кнопка "Вставить фрейм", с ее помощью можно добавлять сколько угодно новых слоев - кинопленок, которые будут располагаться одна над другой, причем, показ этих слоев будет идти одновременно, так, если бы вы сложили несколько обычных кинопленок в несколько слоев и вставили их для одновременного просмотра в проектор. Слои можно удалять соответствующей кнопкой или перемещать мышкой выше или ниже относительно друг друга. В левой части окна программы расположена панель инструментов. Одного взгляда достаточно, чтобы определить назначение кнопок этой панели, это - кисть, ластик, прямая линия и др. Понятно, что все эти инструменты предназначены для рисования и создания текстов и надписей. Ниже панели "Временной диаграммы" расположена рабочая область, в которой мы и будем создавать видеоролик. В нижней части программы Macromedia Flash MX 6.0, под рабочей областью, имеется панель "свойства", в которой отображаются свойства объекта, с которым вы работаете. Например, если вы щелкнете мышкой в любом месте рабочей области, в окне панели "свойства" вы увидите параметры рабочей области, такие как цвет фона рабочей области и размеры рабочей области, которые можно изменять по своему усмотрению, нажав соответствующую кнопку, здесь же можно установить частоту показа кадров (Фрейм рэйт). По умолчанию, частота показа составляет 12 кадров в секунду, что вполне достаточно для большинства создаваемых видеоклипов. Но этот показатель можно изменять по вашему усмотрению. Но надо помнить, что если даже вы установите частоту показа 24 кадра в секунду, на компьютерах с маленьким объемом оперативной памяти и слабым процессором трудно добиться кинематографического качества картинки. Объекты в созданном вами видеоклипе могут двигаться замедленно или прерывисто. Особенно это явление заметно при создании больших по размеру flash-файлов с использованием большого количества растровых изображений, насыщенных мелкими деталями, или если вы будете злоупотреблять эффектами движения, вращения, изменения цвета и прозрачности объектов, что может привести даже к "зависанию" компьютера.

Программа Macromedia Flash MX 6.0 работает с двумя видами форматов графических изображений. Растровые изображения импортируются в Macromedia Flash MX 6.0 и состоят из цветных квадратных точек - пикселей, которые располагаются в координатной сетке. Изображения наиболее распространенных графических форматов - bmp, jpeg, gif и многих других имеют растровую структуру. При увеличении масштаба таких изображений каждый квадратик увеличивается в размерах, вместе с увеличением картинки. Он становится различимым невооруженным глазом, изображение и контуры объектов теряют четкость. При сильном увеличении размера растровой картинки ее изображение просто разбивается на цветные квадратики. С помощью инструментов, имеющихся в Macromedia Flash MX 6.0 (их выбор невелик, и будем надеяться, что в следующих версиях программы этот недостаток будет исправлен), можно создавать довольно сложные и качественные изображения, выполненные в векторной графике. В отличие от растровой, в векторной графике используется другой метод построения изображений. Векторная графика описывает объект направленными кривыми, представляющими собой контуры изображенного объекта, которые имеют цветовые значения и координаты. Изображение задается точками, через которые проходят линии (векторы), образуя контуры элементов изображения. Цвет объекта определяется цветом контура и заключенных в нем областей. Редактируя векторный объект, вы меняете свойства, из которых состоит изображение, т.е. вы изменяете координаты точек, создающих контуры объекта, и цвет области, заключенной в эти контуры. Можно передвигать объект, менять его размеры, форму и цвет, причем, эти изменения никак не повлияют на качество изображения. Т.е., при увеличении или уменьшении объекта просто изменяются координаты точек, задающих его контуры, а цвет объекта и качество линии, очерчивающей его контуры, не изменяется. Качество изображений, выполненных в векторной графике, не зависит от оптического разрешения, и потому векторные объекты можно воспроизводить на устройствах с различным оптическим разрешением без потери качества изображения. В программе Macromedia Flash MX 6.0 можно фотографические растровые изображения легко преобразовывать в векторные, с помощью команды "Трессировать рисунок" в меню "Изменить". Векторное изображение состоит из областей заданной формы, каждая из которых окрашена своим цветом. Поэтому, если вы захотите трессировать какое-либо фотографическое (растровое) изображение, насыщенное мелкими деталями, вам или придется пожертвовать качеством изображения, или получить векторный рисунок, состоящий из огромного числа мелких областей и занимающий солидный объем дискового пространства. Далее я напишу, как можно выйти из этого положения. Но если создаваемый вами flash-ролик не будет размещаться на web-странице, и большой размер файла вас не пугает, с таким векторным изображением можно сделать очень интересные эффекты. Например, ваш портрет, разделившись на множество мелких фрагментов, медленно перемещающихся по экрану и меняющих при движении форму, размеры и цвет, превратится в совершенно неожиданный объект, например, часть пейзажа или в какую-либо надпись. Как у растровых, так и у векторных изображений есть свои достоинства и недостатки, поэтому, комбинируя графику обоих форматов, можно добиваться поразительных результатов.

Готовый flash-ролик можно воспроизвести несколькими способами, в браузерах, в которых Flash Player установлен во время установки самого браузера (Flash Player входит в установочный пакет браузера), например, Netscape Navigator или Internet Explo-rer, с помощью средств Flash ActiveX в Microsoft Office, Microsoft Internet Explorer для Windows, или иначе, под управлением ActiveX в автономном приложении Flash Player, которое работает как подключаемый модуль (plugin) Flash Player. Кроме того, Macromedia Flash MX 6.0 позволяет сохранять flash-ролики в виде совершенно самостоятельного приложения с расширением.exe, и для его воспроизведения не требуется Flash Player или какое-либо другое средство просмотра. Я думаю, что этих сведений уже достаточно для того, чтобы попробовать создать небольшой flash-ролик, познакомиться с возможностями программы Macromedia Flash MX 6.0 и приступить к ее более детальному изучению.

Начнем с самого простого - запустим Macromedia Flash MX 6.0. В панели "Свойства" нажмем кнопку "Размер", и в появившемся меню установим размер рабочей области нашего ролика, например 200х200 пикселей. Затем в панели свойств выберем цвет фона рабочей области. Теперь можно установить продолжительность создаваемого вами фильма. По умолчанию, частота показа кадров (фрейм рэйт) составляет 12 кадров в секунду. Т. е., если вы хотите создать пятисекундный ролик, вам необходимо задействовать 5х12=60 кадров. Как мы уже знаем, временная диаграмма разделена на отдельные кадры, прямо над ней имеется линейка, на которой, с шагом в 5 кадров, указаны их номера. Macromedia Flash MX 6.0 позволяет анимировать объекты, т. е. отображать процесс их перемещения и/или изменения формы, размера, цвета и прозрачности и угла поворота. В Macromedia Flash MX 6.0 существуют два типа анимации: пошаговая (frame-by-frame) и кадрированная. Для пошаговой анимации каждый кадр необходимо создать отдельно, это будет работа, аналогичная анимации в gif-аниматорах, и размер таких файлов будет очень велик, т.к. для каждого кадра придется создать свою картинку. Для кадрированной анимации - используют первый и последний (ключевые) кадры, а содержание промежуточных кадров Macromedia Flash MX 6.0 создаст автоматически, в соответствии с заданными вами параметрами команд. Кроме того, можно создать анимацию с помощью команды "Set Property" (Задать свойства) в Action Script.

Итак, начнем создавать фильм. Выделим щелчком мыши первый кадр во временной диаграмме, по умолчанию он ключевой и отмечен кружочком. Ключевым кадр называется потому, что изменения, которые должны происходить по ходу видеоклипа, задаются именно ключевыми кадрами. Затем в панели инструментов выберем нужную кисть, ее размеры, и установим цвет, выбрав его в палитре, расположенной в нижней части панели инструментов. В рабочей области, например, в ее нижнем левом углу, нарисуем какой-либо простой рисунок или просто поставим точку. Затем щелчком мыши выделим шестидесятый кадр на временной диаграмме и преобразуем его в ключевой фрейм (кадр), нажав клавишу F6 или команду "Ключевой фрейм" из меню "Вставить". Мы увидим, что на участке временной диаграммы, между 1-м и 60-м ключевыми кадрами, будет сплошной участок, состоящий из промежуточных кадров. В кадрах, расположенных на этом участке, программа Macromedia Flash MX 6.0 будет создавать промежуточные кадры автоматически, без вашего участия, в соответствии с тем, какую команду вы ей зададите. Выделите шестидесятый (ключевой) кадр. Выберите в панели инструментов инструмент "Стрелка". С его помощью перетащите нарисованный вами объект из левого нижнего угла рабочей области в другое место, например, в правый верхний угол. Начальное и конечное положение нарисованного объекта может быть не только внутри, но и за пределами границ рабочей области, в зависимости от того, какую траекторию движения вы решили задать объекту. В то время, когда будет выделен нарисованный вами объект, в панели "Свойства" будут представлены свойства этого объекта (ему можно присвоить название, изменить цвет и т.д.). Затем выделите мышкой участок временной диаграммы, с 1-го по 60-й кадр. В панели "Свойства" появятся свойства этого участка. В меню (списке) "Закрутка", расположенного в панели "Свойства", выберите команду "фигур". Следует помнить, что эта команда может использоваться только для объектов, нарисованных инструментами, расположенными в панели инструментов, или векторных изображений, полученных командой "Трессировать рисунок" в меню "Изменить", из импортированных растровых изображений. Мы увидим, что 1-й и 60-й ключевые кадры теперь соединены стрелкой и весь участок временной диаграммы окрашен в светло-зеленый цвет. Если вместо стрелки, соединяющей ключевые кадры, будет пунктирная линия, значит, на этом участке временной диаграммы задана неверная команда. Теперь нажатием клавиш Ctrl+Enter вы можете просмотреть результат проделанной работы. Мы увидим, что объект плавно в течение 5 секунд перемещается из одного положения в другое. Освоив создание такого простого ролика, вы можете немного поэкспериментировать с ним, чтобы понять возможности Macromedia Flash MX 6.0.

Необходимо помнить, что редактировать объекты можно только в ключевых кадрах, промежуточные кадры (не ключевые) не редактируются. Но если, в процессе вашей творческой работы, появилась такая необходимость, вы можете выделить любой промежуточный кадр во временной диаграмме и преобразовать его в ключевой клавишей F6, для того чтобы отредактировать. Выделите 1 ключевой фрейм (кадр). Инструментом "Стрелка" щелкните на нарисованном объекте, теперь, выбрав другой цвет или градиентную заливку в палитре, вы можете изменить цвет объекта в первом ключевом кадре. Кроме того, выбрав кнопку "Свободная трансформация", "Субвыделение" или взяв "Ластик", вы можете изменить размеры и форму объекта до неузнаваемости. Можно выделить объект, удалить его клавишей Delete и нарисовать вместо него другой. Аналогичным образом можно изменить и объект, расположенный в шестидесятом ключевом фрейме. Выделяя промежуточные кадры во временной диаграмме щелчком мыши или двигаясь в ней с помощью кнопок "<" и ">", мы можем посмотреть в покадровом режиме, как Macromedia Flash MX 6.0 изменяет форму и положение нарисованного объекта в промежутке между ключевыми кадрами. Причем, размер файла в таком режиме будет иметь очень маленький объем. Попробуйте выделить один из промежуточных кадров, например 20-й, и нажатием F6 сделать его ключевым, теперь и в 20-м кадре можно редактировать объект. Для рисования объектов, кроме кисти, на панели инструментов имеются - линия, овал, прямоугольник и карандаш. С их помощью можно сделать довольно привлекательные рисунки.

Теперь попробуйте сделать фильм с использованием надписи. Для этого можно создать новый flash-документ, а можно немного усложнить задачу и создать новый слой во "Временной диаграмме", кнопкой "Вставить фрейм". Во "Временной диаграмме" появится новый слой с первым ключевым кадром и по продолжительности равный предыдущему, существующему слою (60 кадров). Назовем его "Надпись". Выделим во временной диаграмме 1 ключевой кадр нового слоя. В панели инструментов нажмем кнопку "Текст", в панели "Свойства" установим необходимый шрифт, его цвет и размер. В любом месте рабочей области нарисуем курсором прямоугольную область надписи и напишем любое слово. Если вам необходимо, чтобы текст перемещался из одного места рабочей области (или из-за ее пределов) в другое в течение 3 секунд, вам необходимо вставить второй ключевой фрейм в 36-м кадре слоя "Надпись" кнопкой F6. Причем, вы можете установить начало этого события не с первого кадра временной диаграммы, а с любого другого, преобразовав этот кадр в ключевой. Просто, если вы хотите, чтобы действие длилось 3 секунды, второй ключевой кадр надо установить через 36 кадров после первого. Во втором ключевом кадре, инструментом "Стрелка", переместим написанное вами слово в другое место рабочей области или за ее пределы. Выделите участок временной диаграммы "Надпись" от первого (ключевого) до 36-го (ключевого) кадра. В панели свойств, в меню (списке) "Закрутка", выберем строку "Движен". Не пытайтесь применить команду "Фигур" для анимации надписи, она работает только с нарисованными и импортированными векторными рисунками. В том же окне имеется меню "поворот", если вы выберете строку "Нет", надпись будет просто плавно перемещаться из одного положения в другое. Если в меню "Поворот" вы выберете "CW", надпись будет перемещаться из одного положения в другое, вращаясь по часовой стрелке, при выборе "CCW" вращение будет против часовой стрелки. Там же можно установить число оборотов, которое сделает надпись при движении из одного положения в другое, и сместить центр, вокруг которого вращается объект. Просмотрите результат, нажав Ctrl+Enter. Если вы хотите, чтобы надпись, или импортированный рисунок изменяли по ходу фильма цвет и прозрачность, необходимо освоить еще одну команду.

Создайте еще один слой во "Временной диаграмме" и назовите его "Надпись 1". В первом ключевом фрейме создайте надпись. Теперь нажмите клавишу F8 или выберите "Конвертировать в символ" из меню "Вставить". В появившемся окне "Convert to Simbol" укажите "Рисунок". Вставьте второй ключевой фрейм, например в 60-й кадр. Выделите надпись в 60-м ключевом кадре, щелкнув по ней мышкой. В панели "Свойства" вы увидите меню (список) "Цвет". Если вы хотите, чтобы ваша надпись плавно становилась прозрачной, выберите из списка команду "Alpha" и с помощью расположенного рядом движка установите уровень прозрачности. Если вы хотите, чтобы ваша надпись плавно изменяла цвет, в меню "Цвет" выберите из списка "Tint" и с помощью палитры, расположенной рядом, выберите нужный цвет. Теперь выделим участок временной диаграммы в слое "Надпись 1" и в панели "свойства", в меню "Закрутка" выберем из списка "Движен", а в списке "Поворот" - "нет" или поворот по часовой (CW), или против часовой стрелки (CCW).

При просмотре вашего видеоклипа события будут разворачиваться на фоне рабочей области, равномерно окрашенной в выбранный вами цвет. Для того чтобы заданные вами события проходили на фоне какого-либо красивого ландшафта или любой другой фотографии или рисунка, его необходимо импортировать в Macromedia Flash MX 6.0. Создайте какое-либо изображение или фотографию с размерами 200х200 пикселов, соответствующее размеру вашей рабочей области в любом графическом редакторе, например в Photoshop. Сохраните эту картинку в формате gif или jpeg, в какой-либо папке, например, в папке "Мои документы". Желательно, чтобы размер файла созданной вами картинки был небольшим, если вы захотите разместить созданный видеоклип на страницах вашего сайта. Теперь перейдите в Macromedia Flash MX 6.0. Создайте новый слой кнопкой "Вставить фрейм", расположенной внизу левой части панели "Временной диаграммы". Назовите его "Фон" и перетащите мышкой вниз так, чтобы он располагался под ранее созданными слоями. Откройте "Файл" в главном меню и выберите "Импортировать". С помощью появившегося окна "Импортирование" (обычное окошко обзора) откройте папку ("Мои документы"), где вы храните созданную вами картинку с фоном, выберите файл этой картинки, выделив его щелчком мыши, и нажмите кнопку "Открыть". Эти манипуляции приведут к тому, что картинка окажется в рабочей области Macromedia Flash MX 6.0 в слое "Фон". Выравнивать ее положение, так чтобы ее края совпали с границами рабочей области, вручную не очень удобно. Для этого лучше использовать кнопки "Распределить центр по вертикали" и "Распределить центр по горизонтали", расположенные в окне "Выравнивание". Теперь можно просмотреть полученный результат, нажав Ctrl+Enter.

Теперь, когда вы знаете, как импортировать рисунки в Macromedia Flash MX 6.0 и как заставить перемещаться объекты, можно перейти к следующему шагу в освоении программы. Итак, мы можем располагать события в видеоклипе параллельно и последовательно, в соответствии с этим и будет протекать показ фильма. Если в фильме будет много событий и они будут располагаться последовательно, и продолжительность каждого события будет велика, временная диаграмма станет очень длинной, с ней будет очень неудобно работать, при редактировании вам придется постоянно перемещаться по временной диаграмме, чтобы найти нужный участок. Для того чтобы исключить такие неудобства, во временной диаграмме предусмотрена возможность создания папок, в которые можно группировать слои. Сделать это очень просто: в нижнем левом углу панели временной диаграммы, нажмите кнопку "Insert Layer Folder" ("Вставить папку слоев") и перетащите в него мышью выбранные вами слои фильма. Но этот способ позволяет разместить более компактно параллельные слои видеоролика. Если создаваемый вами фильм будет иметь большую продолжительность, а следовательно, временная диаграмма будет очень длинной, его можно разделить на несколько последовательных сцен. Созданный нами ролик имеет продолжительность 60 кадров (5 секунд) и занимает почти всю видимую часть временной диаграммы, поэтому следующую часть фильма мы будем создавать в другой сцене. В меню "Вставить" выберите "Сцена". После этого вы увидите, что появилась чистая рабочая область и временная диаграмма. Для удобства работы, каждой сцене можно дать удобное для вас название. Для перехода из сцены в сцену вы можете использовать кнопку "Изменить документ", открывающую список созданных вами сцен. Кнопка располагается в правом нижнем углу временной диаграммы. Количество сцен, на которые разбивается фильм, неограниченно, я обычно делаю сцены не длиннее 65-70 кадров, это как раз видимая часть панели временной диаграммы. Но все зависит от вашего вкуса и желания. При воспроизведении видеофильма сцены будут воспроизводиться последовательно, в том порядке, в котором вы их расположите.

Теперь попробуйте создать сцену, часто используемую современными flash-дизайнерами. Воспроизведение этой сцены создает эффект движущейся видеокамеры, снимающей какой-либо интерьер, ландшафт или любое другое крупное изображение. Импортируйте в Macromedia Flash MX 6.0 какое-нибудь изображение в формате jpeg. Назовите этот слой "Пейзаж". Размер нашей рабочей области 200х200 пикселов. Желательно, чтобы размер импортируемой картинки превышал размеры рабочей области хотя бы в 1,5-2 раза, например, возьмите картинку с размерами 350х400 пикселов. Выделите щелчком мыши 50-й кадр временной диаграммы, и, нажав клавишу F6, преобразуйте его в ключевой. Затем с помощью кнопки "Добавить слой движения", расположенной во временной диаграмме, создайте слой. Слой движения отличается от обычного тем, что при воспроизведении готового фильма объекты, расположенные в слое движения, не будут видны. Для того чтобы нам не мешала работать дальше импортированная картинка, ее следует на время скрыть и блокировать с помощью соответствующих кнопок, расположенных в левой верхней части панели временной диаграммы. Нажав соответствующую кнопку на панели инструментов, нарисуйте в рабочей области прямоугольник с размерами 200х200 пикселов, и выровняйте его так, чтобы его края совпадали с границами рабочей области. Для удобства работы следует рисовать прямоугольник без заливки, т. е. прозрачный. Затем снимите блокировку и скрытие со слоя с картинкой и установите блокировку на "Слой движения". Это нужно для того, чтобы во время манипуляций с импортированной картинкой не выделялся прямоугольник, нарисованный в "слое движения". Вы увидите, что нарисованный вами прямоугольник находится на фоне импортированного изображения. Выделите мышью 10-й кадр в слое "Пейзаж" и клавишей F6 вставьте ключевой фрейм. Затем перетащите картинку в любое место, но так, чтобы нарисованный прямоугольник, обозначающий границы рабочей области, обязательно целиком находился в границах импортированной картинки. Выделим 20-й кадр, клавишей F6 сделаем его ключевым, и опять перетащим картинку в другое место, не забывая о том, что прямоугольник не должен выйти за ее границы. То же самое сделаем в 30-м и 40-м кадрах. Затем выделите в слое "пейзаж" участок временной диаграммы с первого по пятидесятый кадры. На панели "Свойства" в списке "Закрутка" выберите "Движен". Вы увидите, что в слое пейзаж временная диаграмма приобрела светло-сиреневый цвет и ключевые кадры соединены стрелками. Просмотрите полученный результат, нажав Ctrl+Enter. Поэкспериментируйте, изменяя положение картинки в ключевых кадрах. Если вы удовлетворены результатом, "Слой движения" можно просто удалить. В этой сцене мы использовали большое по размерам изображение, при таких больших геометрических размерах размер файла картинки обычно также велик. Для создания не менее эффектной, но меньшей по размеру сцены можно применить картинку и меньшего размера. Такой прием я подсмотрел в большом рекламном баннере, показанном на Yahoo.

Создайте новую сцену из меню "Вставить". Импортируйте в Macromedia Flash MX 6.0 gif или jpeg картинку с размерами 150-250х150-250 пикселов. Назовите этот слой "Рисунок". Выделите 50-й кадр в этом слое и сделайте его ключевым клавишей F6. Теперь создайте новый слой кнопкой "Вставить фрейм" и назовите его "Экран". Этот слой должен быть обязательно над слоем "Рисунок". Длина его временной диаграммы будет также 50 кадров. Выделите в слое "Экран" первый ключевой кадр и нарисуйте прямоугольник любого цвета с размерами 200х200 пикселов, выровняйте так, чтобы его края совпадали с границами рабочей области. Измените цвет заливки в нижней части панели инструментов и нарисуйте небольшой овал или прямоугольник (лучше с закругленными краями), размерами приблизительно 80х80 пикселов, на небольшом расстоянии от рабочей области. Этот небольшой прямоугольник (или овал) перетащите мышью на поверхность квадрата, закрывающего рабочую область, и установите в любом месте, лучше ближе к середине (а впрочем, это ваше дело). Если теперь мы выделим этот прямоугольничек или овал щелчком мыши и удалим клавишей "Delete", на его месте окажется отверстие, повторяющее форму удаленной фигуры. Через это отверстие мы и увидим перемещение импортированного рисунка. Поэтому, взяв кисть (и другие инструменты) и немного ею поработав, можно превратить отверстие, например, в экран телевизора, дисплей компьютера и т.д. Установите блокировку слоя "Экран" соответствующей кнопкой, расположенной в левой части панели временной диаграммы. Это нужно для того, чтобы нам было удобно перемещать мышью картинку в слое "Рисунок". Теперь перейдите в слой "Рисунок", выделите в его временной диаграмме 10 (или любой другой в начале временной диаграммы) кадр и сделайте его ключевым нажатием клавиши F6. Перетащите картинку в любое место, так чтобы ее края на заходили внутрь отверстия в "экране". Вставьте через некоторые промежутки еще 2-3 ключевых кадра, не забывая в каждом из них перемещать мышью (впрочем, можно и клавишами стрелок) рисунок в различные положения. Выделите участок временной диаграммы с 1-го по 50-й кадр слоя "Рисунок", и в панели "свойства" из списка "Закрутка" выберите "Движен". Теперь можно создать еще один слой, назвать его "Украшения", перетащить его во временной диаграмме так, чтобы он стал над предыдущими, нарисовать в нем что-нибудь, или сделать пару надписей (это для красоты) и, нажав клавиши Ctrl+Enter, посмотреть результат нашей работы.

Теперь необходимо познакомиться с возможностями Action Script. Выделите любой ключевой кадр в конце временной диаграммы, например 50-й кадр в слое "Рисунок". Нажмите клавишу F9 или выберите команду "Действия" в меню "Окно". После этого появится панель Action Script с надписью вверху - "Действия - фрейм". В левой части панели имеется окно со списком действий. Выберите Actions из открывшегося списка, выберите Movie Control, а затем двойным щелчком мыши или перетаскиванием в окно панели, расположенное справа, действие "Stop". Теперь просмотрите полученный результат нажатием Ctrl+Enter. Мы увидим, что показ созданного нами фильма прекращается на последнем кадре.

Создайте слой "Кнопка", перетащите его над предыдущими слоями и нарисуйте в рабочей области прямоугольник. Выделите первый ключевой фрейм и нажмите F8, в появившемся окне Convert to Simbol выберите "Кнопка" и назовите ее "Выключатель". В нижней части панели временной диаграммы, справа, нажмите кнопку "Изменить символ" и выберите "Выключатель". Вы увидите, как в центре рабочей области появился нарисованный вами прямоугольник, который и будет кнопкой. Во временной диаграмме будет четыре кадра. Выделите первый ключевой кадр (вверх), сделайте надпись "Старт" и расположите ее на прямоугольнике, изображающем кнопку. Затем выделите второй кадр "Навести" и сделайте его ключевым. Выделите надпись "Старт" и измените ее цвет с помощью панели "Свойства". Выделив кадр "Вниз", сделайте его ключевым и перетащите изображение кнопки на несколько миллиметров вниз и вправо. После этого вернитесь в последнюю сцену с помощью кнопки "Изменить документ". Выделите кнопку, изображенную в рабочей области, щелчком мыши. Вверху панели Action Script будет надпись - Actions Button. В левой части панели выберите "Actions", затем "Movie Control", и наконец, двойным щелчком мыши или перетаскиванием в окно справа - действие "Play". Просмотрите результат, нажав Ctrl+Enter. Ваш фильм будет останавливаться на последнем кадре. Там же будет нарисованная вами кнопка. При наведении на нее курсора цвет надписи "Старт" будет изменяться, а при нажатии на кнопку фильм будет демонстрироваться с начала. Если вы хотите озвучить свой фильм, создайте отдельный слой, если звуков будет много и они должны воспроизводиться параллельно, создайте несколько слоев. Выделите кадр, с которого должно начинаться воспроизведение звука, сделайте его ключевым и импортируйте его в Macromedia Flash MX 6.0. Следует помнить, что это должны быть звуковые файлы с расширением МР3 или wav, с другими форматами программа не работает.

Сохранить созданный файл можно из меню "Файл", выбрав "Издание" или "Экспорт видео". Установки издания можно также установить из меню "Файл". Опытные flash-дизайнеры, прочитав статью, могут сказать, что в ней описаны самые примитивные приемы работы, но цель этой статьи - кратко познакомить начинающего пользователя с возможностями программы, после чего он сможет приступить к ее серьезному изучению.

Чтобы данные с веб-сервера были доступны SWF-файлам из других доменов, на сервере можно создать файл политики. Файл политики - это XML-файл, помещенный в специальное местоположение на сервере.

Файлы политики определяют доступ к ряду ресурсов, включая следующее:

получение данных растровых изображений, аудио и видео;

загрузку XML и текстовых файлов;

импорт SWF-файлов из других изолированных программных сред в домен безопасности загружающего файла;

доступ к подключениям к сокетам и XML-сокетам.

Объекты ActionScript создают подключения к серверу двух типов: подключения к серверу на основе документов и подключения к сокетам. Такие объекты ActionScript, как Loader, Sound, URLLoader и URLStream, создают подключения к серверу на основе документов и загружают файл с URL-адреса. Объекты Socket и XMLSocket создают подключения к сокетам, которые работают с потоковой передачей данных, а не с загруженными документами.

Так как проигрыватель Flash Player поддерживает два типа подключений к серверу, существует и два типа файлов политики: файлы политики URL-адресов и файлы политики сокетов.

Для подключений на основе документов требуются файлы политики URL-адресов . С помощью этих файлов сервер указывает, что его данные и документы доступны для SWF-файлов, размещенных на определенных доменах или на любых доменах.

Для подключений к сокетам требуются файлы политики сокетов , которые обеспечивают прямое сетевое подключение к TCP-сокетам нижнего уровня с помощью классов Socket и XMLSocket.

Файлы политики должны передаваться проигрывателю Flash Player с использованием того же протокола, который собирается использовать устанавливаемое подключение. Например, когда файл политики помещается на HTTP-сервер, SWF-файлы с других доменов могут загружать данные с этого сервера с использованием протокола HTTP. Однако, если на этот же сервер не добавить файл политики сокетов, то SWF-файлы из других доменов не смогут подключиться к серверу через сокеты. Другими словами, способ получения файла политики должен соответствовать способу подключения.

Далее в этом разделе приводится краткое описание использования файлов политики и синтаксиса применительно к SWF-файлам, опубликованным для проигрывателя Flash Player 10. (Для более ранних версий Flash Player файлы политики реализуются несколько иначе, так как по мере выхода новых версий улучшалась система безопасности проигрывателя Flash Player.) Дополнительные сведения о файлах политики см. в разделе «Изменения в файлах политики в Flash Player 9» центра разработчиков Flash Player Developer Center по адресу www.adobe.com/go/devnet_security_ru .

Коду, выполняемому в изолированной программной среде приложения AIR, не требуется файл политики для доступа к данным через URL или сокет. Коду в приложении AIR, выполняемому за пределами изолированной программной среды приложения, требуется файл политики.

SWF-файл может проверять файл политики под другим именем или в другом местоположении. Для этого нужно вызвать метод Security.loadPolicyFile() . Однако, если в основном файле политики не указано, что в данном местоположении может находиться файл политики, то вызов метода loadPolicyFile() не даст результатов, даже если там будет файл политики. Метод loadPolicyFile() следует вызывать до того, как пытаться выполнять сетевые операции, для которых требуется файл политики. Проигрыватель Flash Player автоматически ставит запросы на сетевое подключение в очередь после соответствующих запросов на получение файла политики. Например, метод Security.loadPolicyFile() допустимо вызвать непосредственно перед началом сетевой операции.

Проверяя основной файл политики, проигрыватель Flash Player ожидает ответа сервера в течение трех секунд. Если ответ не получен, Flash Player делает вывод, что основной файл политики не существует. Однако для вызова метода loadPolicyFile() нет тайм-аута по умолчанию; проигрыватель Flash Player предполагает, что вызываемый файл существует и ожидает загрузки в течение неопределенного времени. Поэтому, чтобы гарантированно загрузить основной файл политики, необходимо вызвать метод loadPolicyFile() .

Несмотря на то что метод называется Security.loadPolicyFile() (загрузитьФайлПолитик), файл политики загружается только после отправки сетевого запроса, для которого требуется файл политики. Вызов метода loadPolicyFile() просто сообщает проигрывателю Flash Player, в каком местоположении следует искать файл политики, когда он понадобится.

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

В следующих разделах содержатся сведения, которые относятся только к файлам политики URL-адресов. Дополнительные сведения о файлах политики сокетов см. в разделе «Подключение к сокетам ».

Область действия файла политики URL-адресов

Файл политики URL-адресов применяется только к каталогу, из которого он загружен, и к его дочерним каталогам. Файл политики в корневом каталоге применяется ко всему серверу. Файл политики, загруженный из подкаталога, применяется только к этому каталогу и его подкаталогам.

Файл политики определяет доступ только к тому серверу, где он находится. Например, файл политики, находящийся по адресу https://www.adobe.com:8080/crossdomain.xml, применяется только к вызовам на загрузку данных с сервера www.adobe.com по протоколу HTTPS через порт 8080.

Указание прав доступа в файле политики URL-адресов

Файл политики содержит один тег , в котором, в свою очередь, может быть любое количество тегов , начиная с нуля. Каждый тег содержит атрибут domain , который указывает либо точный IP-адрес, либо точное имя домена, либо подстановочный домен (любой домен). Подстановочные домены можно указать двумя способами:

одной звездочкой, что соответствует всем доменам и всем IP-адресам;

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

Суффикс должен начинаться с точки. Однако подстановочные домены с суффиксами могут соответствовать доменам, которые содержат только суффиксы без начальной точки. Например, «xyz.com» рассматривается как часть «*.xyz.com». Подстановочные знаки нельзя использовать в IP-адресах.

В следующем примере показан файл политики URL-адресов, который разрешает доступ SWF-файлам из доменов *.example.com, www.friendOfExample.com и 192.0.34.166.

Если указывается IP-адрес, доступ предоставляется только SWF-файлам, загруженным с этого IP-адреса с использованием IP-синтаксиса (например, http://65.57.83.12/flashmovie.swf). При предоставлении доступа SWF-файлам не используется синтаксис доменных имен. Проигрыватель Flash Player не выполняет разрешение DNS.

Можно разрешить доступ документам из любого домена, как показано в следующем примере.

Каждый тег также имеет дополнительный атрибут secure , который по умолчанию имеет значение true . Если файл политики находится на HTTPS-сервере и нужно разрешить SWF-файлам с сервера другого типа (не HTTPS) загружать данные с HTTPS-сервера, этому атрибуту можно задать значение false .

Присвоение атрибуту secure значения false может ослабить защиту, обеспечиваемую протоколом HTTPS. В частности, значение false открывает защищенное содержимое для несанкционированного доступа или спуфинга. Компания Adobe настоятельно рекомендует не задавать атрибуту secure значение false .

Если загружаемые данные находятся на HTTPS-сервере, а загружающий их SWF-файл - на HTTP-сервере, компания Adobe рекомендует переместить загружающий SWF-файл на HTTPS-сервер. Благодаря этому все копии конфиденциальных данных будут находиться под защитой HTTPS. Однако, если вы решите оставить загружающий SWF-файл на НТТР-сервере, добавьте атрибут secure="false" в тег , как показано ниже.

Также для предоставления доступа можно использовать тег allow-http-request-headers-from . Этот элемент предоставляет клиенту, размещающему содержимое с другого домена, разрешение отправлять вашему домену заголовки, определенные пользователем. Тег предоставляет другим доменам доступ для получения данных с вашего домена, а тег allow-http-request-headers-from предоставляет другим доменам разрешение на отправку данных вашему домену в виде заголовков. В следующем примере всем доменам разрешается отправлять заголовок SOAPAction текущему домену.

Если тег allow-http-request-headers-from добавляется в основной файл политики, он применяется ко всем каталогам хоста. В противном случае он применяется только к каталогу и подкаталогам, на которые распространяется файл политики, содержащий тег.

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

Если используется метод Loader.load() , задайте свойство checkPolicyFile параметра context , который является объектом LoaderContext.

Если изображение встраивается в текстовое поле с помощью тега , задайте атрибуту checkPolicyFile тега значение "true" , как показано ниже.



Если используется метод Sound.load() , задайте свойство checkPolicyFile параметра context , который является объектом SoundLoaderContext.

Если используется NetStream, задайте свойство checkPolicyFile объекта NetStream.

Если задан один из этих параметров, проигрыватель Flash Player сначала проверяет файлы политики, уже загруженные для этого домена. Затем он ищет файл политики сервера в местоположении по умолчанию, проверяя теги и наличие метаполитики. В завершение, рассматриваются все вызовы метода Security.loadPolicyFile() , ожидающие обработки, чтобы оценить их область действия.

Глава 5. Работа с текстом

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

На основе фрагмента текста может быть создана гиперссылка.

Flash -фильм может содержать динамические текстовые поля, а также поля, редактируемые пользователем. Редактируемые поля в Flash -фильме имеют то же предназначение, что и текстовые поля, помещаемые в форму на Web-странице: с их помощью от пользователя может быть получена та или иная информация, подлежащая обработке на сервере или клиентским сценарием. И, наконец, в вы можете создавать прокручиваемые многострочные текстовые области.

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

Создание и редактирование текста

Чтобы добавить текстовое поле в Flash -фильм, следует выполнить следующие действия:

1. Включить инструмент Text Tool на панели Tools.
2. Щелкнуть мышью в той позиции на столе, куда требуется поместить текстовое поле; в результате в этой позиции появится текстовый курсор, окруженный выделяющей рамкой.
3. Набрать текст.

Обратите внимание, что в правом углу выделяющей рамки (верхнем или нижнем) имеется маркер, который определяет тип текстового поля (рис. 5.1): прямоугольный маркер в правом верхнем углу соответствует текстовому полю фиксированной ширины (Fixed text block); в таком поле выполняется автоматический перенос на следующую строку, если очередной символ не умещается на текущей строке; ширина поля устанавливается пользователем посредством перетаскивания маркера; после публикации фильма на Web-сервере содержимое такого поля не может быть изменено с помощью сценария или читателем Web-страницы;

• круглый маркер в правом верхнем углу соответствует расширяемому текстовому полю (Expanded text block); это однострочное текстовое поле, ширина которого автоматически увеличивается при вводе текста; данный вариант используется по умолчанию; содержимое такого поля также не может быть изменено с помощью сценария или читателем Web-страницы;

Рис. 5.1. Маркеры текстового блока

• белый прямоугольный маркер в правом нижнем углу соответствует текстовому полю, предназначенному для ввода динамически изменяемого содержимого - Dynamic text block или Input text block; содержимое поля первого типа может изменяться с помощью сценария, а второго - читателем Web-страницы (например, при вводе данных в форму);
• черный прямоугольный маркер в правом нижнем углу указывает на текстовое поле, содержимого которого может перемещаться (прокручиваться) внутри текстовой области с помощью вертикальной и/или горизонтальной полосы прокрутки.

Чтобы изменить атрибуты текстового блока, слова (фрагмента текста) или отдельного символа, необходимо:

1. Включить инструмент Text.
2. Выбрать (выделить) мышью соответствующий фрагмент текста.
3. В меню Text выбрать соответствующую команду, либо воспользоваться элементами управления, имеющимися на панели инспектора свойств текста.

Все команды меню Text разделены на три группы (рис. 5.2.):

• в первую входят «традиционные» команды работы с текстом (Font, Size, Style), которые, собственно, представляют собой каскадные меню, содержащие возможные значения соответствующих атрибутов текста;
• вторую группу образуют две также достаточно распространенные команды - Align (Выравнивание) и Tracking (Трекинг);
• в третью группу включена единственная команда - - Scrollable (Перемещаемый), обеспечивающая установку соответствующего свойства текстового поля.

Рис. 5.2. Состав команд меню Text

Более удобным средством для изменения параметров текста является инспектор свойств. Его формат зависит от типа текстового поля.

Статический текст

Статический текст (Static Text) - это текстовое содержимое фильма, которое не может быть изменено после публикации фильма.

Формат инспектора свойств статического текста показан на рис. 5.3.

Рис. 5.3. Инспектор свойств статического текста

Из представленных на панели элементов управления дополнительного пояснения требуют, вероятно, следующие:

• текстовое поле URL; выделив на столе текстовый блок и указав в этом поле полный Web-адрес (URL - Universal Resources Locator) связанного ресурса, вы получите самую настоящую гиперссылку; правда, в отличие от других визуальных редакторов, она будет представлена не подчеркнутым шрифтом, а шрифтом с штриховой линией. Используемый во Flash механизм создания гиперссылок имеет два недостатка: во-первых, URL приходится вводить вручную, и, во-вторых, Flash не проверяет корректность URL даже для локальных файлов;
• раскрывающийся список Target (Целевой); он позволяет указать, в какое окно броузера следует загрузить ресурс, вызванный по указанному URL; список становится доступен при вводе в поле URL хотя бы одного символа; список содержит следующие варианты (они аналогичны стандартным значениям атрибута TARGET языка HTML):
  • _blank - вызываемый документ всегда загружается в новое, неименованное окно;
  • _self - вызываемый документ всегда загружается в то же окно, в котором была инициирована ссылка;
  • _parent - вызываемый документ загружается в родительское окно (то есть в окно более высокого уровня иерархии); если данное окно не имеет «родителя», или само является таковым, то результат аналогичен применению значения _self;
  • _top - вызываемый документ загружается в окно самого верхнего уровня; (если данное окно само является таковым, то результат аналогичен применению значения _self);
• кнопка Selectable (Выделяемый); она используется как флажок: щелчок на кнопке позволяет установить или отменить для текста соответствующее свойство; при этом следует иметь в виду, что возможность выделения фрагмента текста не означает возможность его редактирования; выбранный фрагмент может быть скопирован, например, в буфер обмена;
• кнопка Change Direction of Text (Изменить направление текста) позволяет открыть меню; с помощью которого вы можете выбрать ориентацию надписи: горизонтальную или вертикальную; меню содержит три команды (рис. 5.4):
  • Horizontal (Горизонтальный);
  • Vertical, Left to Right (Вертикальный, слева направо);
  • Vertical, Right to Left (Вертикальный, справа налево);

При установке вертикальной ориентации текста изменяется состав кнопок форматирования и, кроме того, становится доступна кнопка Rotation:

• кнопка Rotation (Поворот) играет роль флажка и позволяет изменять расположение символов в надписи (рис. 5.5);
• флажок Use Device Font (Использовать шрифт устройства) -если флажок установлен, то при воспроизведении фильма Flash -плеер использует физические шрифты, установленные для броузера читателя; это может уменьшить размер файла фильма и повысить удобочитаемость для мелкого шрифта.

Рис. 5.4. Меню для изменения ориентации текста

Рис. 5.5. Варианты расположения вертикальной надписи: при нажатой (слева) и отжатой (в центре) кнопке Rotation

Совет

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

Следует иметь в виду, что гипертекстовые ссылки могут создаваться только на основе горизонтального текста.

Возле правой границы панели инспектора свойств находится кнопка Format (Формат), щелчок на которой открывает, дополнительное диалоговое окно, позволяющее установить параметры форматирования текстового поля (рис. 5.6).

Рис. 5.6. Диалоговое окно Format Option

Это окно содержит четыре текстовых поля, совмещенных с ползун-ковыми регуляторами «в стиле Macromedia»:

• Indent (Отступ) - величина абзацного отступа для новой строки (в пикселах);
• Line Spacing (Межстрочный интервал) - расстояние между соседними строками (в пунктах); для вертикального текста этот параметр задает расстояние между столбцами текста;
• Left Margin (Левое поле) - расстояние между левой границей текстового поля и первым символом строки;
• Right Margin (Правое поле) - расстояние между правой границей текстового поля и последним символом строки.

Диалоговое окно Format Option идентично для всех типов текстовых полей.

Динамический текст

Динамический (или изменяемый текст) Dynamic Text - это такое текстовое поле, содержимое которого может изменяться с помощью сценария на языке ActionScript (то есть в процессе воспроизведения фильма).

Возможность работы с динамическим текстовым полем из сценария на ActionScript обусловлена тем, что каждое такое поле представляет собой экземпляр специального объекта языка ActionScript, который называется TextField.

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

Установка атрибутов динамического текста

Для установки атрибутов динамического текста панель инспектора свойств содержит следующие элементы (рис. 5.7):

• текстовое поле Instance Name (Имя образца), в котором указывается имя текстового поля; несмотря на то, что имя поля выводится (непосредственно в нем) символами серого цвета, которые обычно обозначают в Windows-приложениях заблокированный элемент интерфейса, в данном случае ввод разрешен;
• раскрывающийся список Line type (Тип строки) форматов текстового поля:
  • Single Line (Однострочное);
  • Multiline (Многострочное);
  • Multiline no wrap (Многострочное без переносов);
• кнопка Render text as HTML; если она нажата, то заданные параметры форматирования текста (такие как размер, стиль, использование в качестве гиперссылки) при публикации фильма будут сохранены в виде соответствующих HTML-тэгов;
• кнопка Show Border (Показать рамку); если она нажата, то текстовое поле будет окружено рамкой;

Рис. 5.7. Формат инспектора свойств для динамического текста

• флажок Selectable (Выбираемый); его назначение аналогично рассмотренному для статического текста;
• текстовое поле Var (от Variable - Переменная) предназначено для ввода имени переменной, связанной с создаваемым текстовым полем; об использовании переменных для управления элементами фильма будет рассказано в подразделе «Создание интерактивных элементов фильма»;
• кнопка Characters (Символы), щелчок на которой открывает дополнительное диалоговое окно Character Options, позволяющее установить параметры использования встроенного шрифта, используемого для текстового поля; окно содержит три переключателя (рис. 5.8):
  • No Characters (Никакие символы) - информация об используемом шрифте не экспортируется в Flash -фильм при его публикации;
  • All Characters (Все символы) - - в Flash -фильм включается информация о всех символах шрифта;
  • Only (Избранные) - в Flash -фильм включается информация о только о тех символах шрифта, которые указаны с помощью расположенных ниже флажков.

Рис. 5.8. Диалоговое окно Character Options

По поводу установки параметров встроенного шрифта следует сделать следующее пояснение.

Когда вы используете в Flash -фильме шрифт, установленный на вашем компьютере, Flash внедряет информацию о шрифте в SWF-файл, гарантируя тем самым, что текст будет корректно отображен Flash-плеером . Однако не все шрифты, используемые в Flash , могут экспортироваться в SWF-файл. Поэтому предварительно рекомендуется проверять, может ли экспортироваться данный шрифт. Для этого необходимо в меню View выбрать команду Antialias Text (Сглаживание текста) и оценить результат сглаживания. Если сглаживание не выполнено, это означает, что Flash не распознает такой шрифт и не будет его экспортировать.

Альтернативный способ - использование физических шрифтов (Device Font).

Информация о физическом шрифте не экспортируется в SWF-файл . Вместо этого Flash-плеер использует любой шрифт из числа установленных на компьютере, наиболее близкий к физическому шрифту.

Поскольку информация о физическом шрифте не включается в SWF-файл , такой вариант обеспечивает несколько меньший размер файла Flash-фильма . Кроме того, физический шрифт может быть более четким по сравнению с внедренным шрифтом для мелких символов (менее 10 пунктов). Однако, если на компьютере пользователя отсутствует подходящий шрифт, текст может выглядеть совсем не так, как ожидал автор фильма.

Flash содержит три вида физических шрифтов: _sans (близкий к шрифтам Helvetica и Verdana, Arial, Helvetica, sans-serif); _serif (близкий к Times Roman); _typewriter (близкий к шрифту Courier).

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

Создание прокручиваемой текстовой области

На основе динамического текстового поля может быть создана перемещаемая (прокручиваемая) текстовая область. Пример такой текстовой области показан на рис. 5.9.

Для создания прокручиваемой текстовой области необходимо выполнить следующие действия:

Рис. 5.9. Пример прокручиваемой текстовой области

1. Включите инструмент Text и с помощью мыши очертите на столе границы текстовой области.
2. На панели инспектора свойств с помощью раскрывающегося списка Line type выберите формат текстового поля; при этом полезно придерживаться следующих правил:
   • если вы хотите использовать вертикальную полосу прокрутки, то следует выбрать тип Multiline или Multiline no wrap;
   • если вам требуется поле только с горизонтальной полосой прокрутки, то следует выбрать тип Single Line;
   • для создания поля с вертикальной и горизонтальной полосами прокрутки выберите тип Multiline no wrap.
3. При необходимости установите требуемые значения других параметров текстового поля (стиль и размер шрифта, цвет и т. д.).
4. Не выключая инструмент Text, переместите указатель мыши за пределы текстовой области и щелкните левой кнопкой; при этом текстовый курсор внутри поля исчезнет, и оно окажется выделенным черной пунктирной рамкой.
5. Вновь переместите указатель мыши внутрь текстовой области и щелкните правой (!) кнопкой, чтобы открыть контекстное меню.
6. В контекстном меню выберите команду Scrollable (Прокручиваемый).

Рис. 5.10. Панель Components

• Убедитесь, что в рабочей области Flash открыта панель Components (Компоненты); если панель закрыта, в меню Window выберите пункт Components; данная панель (рис. 5.10) предназначена для включения в фильм элементов управления (кнопок, флажков, списков и т. д.); подробнее о работе с панелью Components рассказано в главе «Создание интерактивных фильмов».
• На панели Components найдите элемент ScrollBar (на рис. 5.10 он выделен тенью) и перетащите его мышью в текстовую область; при этом учитывайте следующее:
  • Flash автоматически устанавливает размер полосы прокрутки в соответствии с высотой (для вертикальной) и длиной (для горизонтальной) текстовой области;
  • чтобы получить вертикальную полосу прокрутки, следует установить элемент ScrollBar вдоль вертикальной границы области;
  • чтобы получить горизонтальную полосу прокрутки, следует установить элемент ScrollBar поперек горизонтальной границы текстовой области таким образом, чтобы указатель мыши оказался в пределах текстовой области, как показано на рис. 5.11;
  • Flash создает ползунок на полосе прокрутки только в том случае, если он действительно необходим; то есть, например, если текстовая область содержит только одну строку, то ползунок на вертикальной полосе прокрутки будет отсутствовать.

Рис. 5.11. Создание горизонтальной полосы прокрутки

Замечание

Интерактивность полосы прокрутки, как и других элементов управления, помещенных в Flash-фильм , «проявляется» лишь после его экспорта в формат SWF, а также в режиме тестирования фильма. Чтобы перейти в такой режим, необходимо в меню Control основного окна Flash выбрать пункт Test Movie (Тестирование фильма) или Test Scene (Тестирование сцены).

Если вам в результате перетаскивания элемента ScrollBar по какой-либо причине не удалось получить полосу прокрутки желаемого типа, вы можете установить его вручную. Для этого необходимо:

1. Включить инструмент Arrow и щелкнуть мышью на той полосе прокрутки, которая вас «не послушалась», чтобы выбрать ее.
2. В открывшейся панели инспектора свойств этого элемента (рис. 5.12) щелкнуть в поле свойств элемента, на строке Horizontal (на рис. 5.12 она выделена серым цветом); в результате в строке появится окно раскрывающегося списка.
3. Щелкнуть на кнопке списка и в появившемся окне (рис. 5.13) выбрать значение true (истина), если вам нужна горизонтальная полоса прокрутки или false (ложь), если вы хотите получить вертикальную полосу прокрутки.

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

Рис. 5.12. Инспектор свойств элемента ScrollBar

Рис. 5.13. Установка вида полосы прокрутки

Совет

Если вы используете в текстовом поле кириллицу, то после конвертирования фильма в формат SWF или при тестировании фильма текст может отображаться не корректно (с использованием другой кодовой таблицы, например, западноевропейской). Чтобы избежать этого, до публикации фильма установите в диалоговом окне Character Options (см. рис. 5.8) переключатель All Characters.

Редактируемый текст

Редактируемый текст (Input Text) - текстовое поле такого типа предназначено для ввода и редактирования текста читателем Web-страницы.

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

Формат инспектора свойств для установки атрибутов редактируемого текста показан на рис. 7.14.

По сравнению с инспектором свойств динамического текста здесь имеются следующие особенности:

Рис. 5.14. Формат инспектора свойств редактируемого текста

• отсутствует текстовое поле URL и связанный с ним раскрывающийся список Target;
• недоступна (заблокирована в нажатом состоянии) кнопка Selectable; это вполне закономерно: редактируемый текст обязательно должен быть выбираемым;
• присутствует текстовое поле Maximum Characters (максимальное число символов); в этом поле следует указать целое число, которое определяет, сколько символов разрешается ввести читателю.

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

Как и для динамического текста, для поля редактирования разрешается создавать полосы прокрутки.

Применение визуальных эффектов

Как было отмечено в начале главы, наряду со стандартными средствами форматирования текста Flash поддерживает также возможность создания специфических эффектов. К ним, в частности, относятся масштабирование текста, наклон, поворот, зеркальное отражение. После выполнения любой из операций трансформации текст остается текстом, то есть его по-прежнему можно редактировать не как графический объект, а как набор текстовых символов лишь иллюстрацией некоторых возможностей Flash . На рис. 5.15 показана текстовая область, содержимое которой можно прокручивать даже после того, как она была наклонена.

Рис. 5.15. Иллюстрация возможностей Flash по работе с текстом

Еще раз повторим, что трансформированный текст остается доступным для редактирования при разработке фильма. Чтобы перейти в режим текстового редактирования, следует включить инструмент Text и дважды щелкнуть на текстовом поле. После этого вы можете продолжить ввод текста, удалить символы или выделить некоторый фрагмент текста, чтобы, например, скопировать его в буфер обмена (рис. 5.16).

Для выполнения требуемых преобразований текстовое поле должно быть выбрано с помощью инструмента Arrow или Free Transform. Однако в последнем случае два модификатора инструмента Free Transform (а именно Distort и Envelope) остаются недоступны. Чтобы использовать их возможности, необходимо перейти в режим посимвольного редактирования текста.

Рис. 5.16. Редактирование трансформированного текста

Посимвольное редактирование текста

Для модификации отдельных символов текста к нему следует применить процедуру разбиения - Break Apart. При этом возможны два уровня разбиения:

• разделение текста на символы с сохранением свойств каждого из них как отдельного фрагмента текста;
• преобразование символов текста в графические объекты.

Замечание

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

Рассмотрим два указанных выше варианта подробнее. Для разделения текста на символы необходимо:

• Выбрать текстовое поле, подлежащее разбиению (текст в нем должен быть уже набран), с помощью инструментов Arrow, Free Transform или Text.
• В меню Modify основного окна выбрать команду Break Apart.

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

Над каждым из символов после разбиения могут быть выполнены любые операции, допустимые для «самостоятельного» текстового поля, в том числе:

• замена на другой текстовый символ (то есть обычное редактирование); для этого редактируемый символ требуется выбрать с помощью инструмента Text (рис. 5.18, слева);

Рис. 5.17. После разбиения каждый символ текста заключен в отдельную рамку

• перемещение на новую позицию; для этого достаточно включить инструмент Arrow или Free Transform, подвести указатель мыши к символу и, когда возле указателя появится символ перемещения, нажать левую кнопку мыши и перетащить символ (рис. 5.18, в центре);
• масштабирование, поворот и другие виды трансформации, доступные для текстовой области (рис. 7.18, справа); для этого символ должен быть выбран с помощью инструмента Free Transform.

Рис. 5.18. Примеры операций посимвольного редактирования

Кроме того, вы можете выполнить изменение цвета символа и автоматическое распределение символов по слоям сцены. Применение слоев будет рассмотрено в главе «Создание анимации», поэтому пока лишь поясним суть названной операции. Для каждого символа текста будет создан отдельный слой, и символы будут автоматически распределены по этим слоям. По умолчанию имена созданных слоев совпадают с помещенными на них символами (рис. 5.19).

Чтобы выполнить автоматическое распределение символов по слоям, достаточно выбрать в меню Modify команду Distribute to Layers (Распределить по слоям).

Теперь о том, чего нельзя сделать с символами после однократного разбиения текстовой области:

• к ним нельзя применить модификаторы Distort и Envelope инструмента Free Transform;
• для них нельзя использовать градиентную или растровую заливку;
• их нельзя редактировать с помощью инструментов рисования.

Чтобы избавиться от всех этих «нельзя», достаточно повторно применить к текстовым символам процедуру разбиения Break Apart. После этого вы можете делать с символами все, что вам подскажет ваше воображение. На рис. 7.20 -- далеко не самый изощренный вариант редактирования текстового символа.

Рис. 5.19. Результат автоматического распределения символов по слоям

Рис. 5.20. Пример модификации символа текста после повторного выполнения процедуры Break Apart

Замечания

1. Если текстовое поле содержит единственный символ, то уже после однократного применения процедуры Break Apart он доступен для редактирования как графический объект.
2. Процедура Break Apart применима только к контурным шрифтам типа TrueType. Растровые шрифты исчезают с экрана, если вы попробуете применить к ним указанную операцию.

Автоматическая замена шрифта

Когда вы работаете с Flash-фильмом в формате FLA , Flash при необходимости может заменять шрифты, используемые по умолчанию, теми, которые установлены на вашем компьютере. позволяет выбрать наиболее подходящий, на, ваш взгляд, вариант замены.

Замечание

Замена шрифта выполняется только на время редактирования фильма (то есть на время работы с FLA-файлом). При воспроизведении фильма используется тот шрифт, который был указан при создании фильма.

Об отсутствии шрифта Flash MX сообщает вам непосредственно при открытии FLA-файла. Соответствующая информация выводится в специальном диалоговом окне.

Это окно содержит две кнопки:

• Choose Substitute (Выбрать замену), которая позволяет открыть диалоговое окно Font Mapping (Схема шрифтов) для описания схемы замены отсутствующих шрифтов;
• Use Default (Использовать по умолчанию), щелчок на которой обеспечивает замену отсутствующих шрифтов в соответствии с имеющейся схемой замены; если вы всегда (или почти всегда) собираетесь использовать эту схему, то прежде чем щелкнуть на кнопке, поставьте флажок Don"t warn me again (He напоминать мне).

Чтобы описать схему вариантов замены, в окне Font Mapping необходимо выполнить следующие действия:

1. Щелкнуть в строке отсутствующего шрифта.
2. В раскрывающемся списке шрифтов, установленных на компьютере, выбрать наиболее подходящий.
3. Если вы предпочитаете использовать в качестве замены один из физических шрифтов Flash , то выберите его в раскрывающемся списке Substitute Font, расположенном в нижней правой части окна.

Замечание

Чтобы впоследствии скорректировать используемую схему замены, следует в меню Edit основного окна выбрать команду Font Mapping и в открывшемся диалоговом окне внести требуемые изменения.

В завершение отметим еще одну особенность работы с текстовой информацией в . Вы можете преобразовать шрифт в символ разделяемой библиотеки, чтобы использовать его в других фильмах. В этом случае необходимый шрифт загружается динамически при воспроизведении Flash -фильма на компьютере пользователя (посетителя сайта). Такой механизм позволяет уменьшить размер фильма. Подробнее о применении библиотек рассказано в девятой главе - «Применение символов».

До сих пор мы рассматривали Flash-фильмы, которые воспроизводились без вмешательства зрителя от начала и до конца. Однако Flash позволяет также создавать интерактивные приложения, в которых пользователь может управлять демонстрацией контента. В данном уроке мы начнем знакомство с элементами языка описания сценариев Action Script и рассмотрим, как с его помощью можно создать интерактивные приложения. В качестве примера создадим фотоальбом с элементами интерактивного интерфейса. Но прежде чем приступить к описанию Action Script, следует рассказать еще об одном виде символов, который мы до сих пор оставляли без внимания, - это символы-кнопки. Для построения интерактивного интерфейса они просто необходимы.

Создание кнопок

Кнопка представляет собой четырехкадровый интерактивный мувиклип. Когда мы присваиваем символу тип «Кнопка», Flash создает для нового символа монтажную линейку из четырех кадров:

Up-состояние — это кадр, соответствующий ситуации, когда кнопка не нажата и указатель мыши расположен не над кнопкой;

Over-состояние — кадр, иллюстрирующий вид кнопки, когда указатель мыши расположен над кнопкой, но кнопка не нажата;

Down-состояние — данный кадр показывает вид кнопки при ее нажатии;

Hit-состояние — определяет область, в которой кнопка реагирует на щелчок мыши; эту область в клипе не видно.

Чтобы создать кнопку, выполните команду Insert => New Symbol (можно набрать сочетание клавиш Control+F8). В появившемся диалоговом окне Create New Symbol введите имя символа-кнопки (например, but1) и выберите тип символа Button («Кнопка»).

Flash переключится в режим редактирования символа, предоставив кадры Up, Over, Down и Hit. Первый кадр, Up, становится пустым ключевым кадром. Нарисуем в этом кадре ненажатый вид кнопки (рис. 1).

Рис. 1. UP-кадр кнопки

Выделим второй кадр, помеченный как Over и соответствующий состоянию, когда курсор занесен над кнопкой. Вставим в этом кадре ключевой фрейм (по команде Insert => Keyframe), в результате чего появится ключевой кадр, полностью повторяющий содержание Up-кадра. Изменим цвет кнопки, как показано на рис. 2.

Рис 2. Over-кадр кнопки

Аналогично добавим следующий кадр (Down-кадр) и нарисуем нажатое состояние кнопки (рис. 3).

Рис. 3. Down-кадр кнопки

В Hit-кадре пока не будем ничего рисовать, а вернемся к этому кадру чуть позже.

Перейдем к основной сцене, вызовем библиотеку по команде Window => Library и создадим экземпляр символа кнопки путем перетаскивания его на сцену (рис. 4.)

Рис. 4. Создадим экземпляр кнопки, перетащив его из библиотеки

В результате получим следующий фильм . Как видно из данного фильма, надавливание кнопки происходит не только тогда, когда мы нажимаем мышью на центральную (рабочую) зону кнопки, но и при нажатии на рамку вокруг нее. Связано это с тем, что если Hit-кадр не нарисован, то рабочая область кнопки будет соответствовать Up-кадру.

Для того чтобы нажатие кнопки происходило только в рабочей зоне, необходимо в Hit-кадре определить эту зону, то есть нарисовать кнопку без рамки (см. рис. 5)

Рис. 5. Hit-кадр кнопки

После того как мы добавим необходимый Hit-кадр получим следующий фильм , в котором при нажатии на рамку продавливания кнопки не происходит.

Чтобы сделать кнопку интерактивной, необходимо связать факт нажатия кнопки с выполнением определенных команд, то есть описать определенный сценарий. Для задания сценариев во Flash существует специальный язык Action Script. В данном уроке мы затронем лишь незначительную часть возможностей этого языка, а в дальнейшем будем возвращаться к структуре и синтаксису Action Script по мере усложнения примеров создания интерактивных фильмов на Flash.

Понятие об Action Script

Action Script представляет собой язык написания сценария - набора инструкций, которые управляют элементами Flash-фильма. Сценарии Action Script могут быть встроены в фильм или храниться во внешнем текстовом файле с расширением AS.

При встраивании сценария в фильм его можно внедрять в разные части фильма. Точнее, сценарии Action Script могут содержать ключевые кадры, экземпляры кнопок и экземпляры мувиклипов. Соответственно сценарии называются сценариями кадра (Frame Action), сценарием кнопки (Button Action) и сценарием клипа (MovieClip Action).

Сценарии Action Script выполняются по наступлении определенных событий, инициированных пользователем или системой. Механизм, который указывает программе Flash, какой оператор следует выполнить при наступлении того или иного события, называется обработчиком событий.

Action Script имеет собственный синтаксис, во многом схожий с синтаксисом JavaScript. Flash MX 2004 поддерживает Action Script всех предыдущих версий Flash.

Одним из основных понятий Action Script являются Actions - команды, которые выдают инструкции во время исполнения SWF-файла. Например, gotoAndStop() отсылает воспроизводящую головку (Рlayhead) на определенный кадр или метку. От слова Actions и происходит название языка - Action Script (дословно - сценарий действий). С большинством понятий этого языка мы ознакомимся на конкретных примерах.

Интерактивный фотоальбом

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

Поместим на основной монтажной линейке первое фото и добавим кнопку из стандартного набора. Для доступа к нужной папке следует выполнить команду Windows => Сontrol Panels Common Libraries => Buttons (рис. 6).

Рис. 6. Добавим кнопку из стандартной библиотеки

В результате выполнения данной команды появится панель, содержащая большой набор заранее нарисованных кнопок различных типов. Выберем, например, Key Buttons (кнопки, похожие на клавиатурные клавиши), откроем соответствующую папку, выберем кнопку key-left (рис. 7) и создадим экземпляр данной кнопки (путем перетаскивания ее на сцену).

Рис. 7. Элементы папки Key Buttons

Обратите внимание, что, когда вы устанавливаете вторую кнопку (key-right) на сцене и перемещаете ее, чтобы установить на одном уровне с первой кнопкой, программа дает подсказку (пунктирную линию), которая позволяет точно позиционировать кнопку (рис. 8).

Рис. 8. Автоматическое выравнивание кнопок на одном уровне

Для того чтобы добавить сценарий, необходимо вызвать редактор Action Script по команде Window =>Development Panels => Actions или нажав клавишу F9. Если вы собираетесь часто писать скрипты, то эту клавиатурную команду стоит запомнить. В результате появится редактор Action Script (рис. 9).

Рис. 9. Панели редактора Action Script

Если вы поэкспериментируете, выделяя различные элементы на сцене, одновременно отслеживая сообщения в панелях редактора Action Script, то обнаружите, что программа подсказывает, на какой элемент можно «вешать» код. Если выделить на сцене кадр, то в верхнем левом углу панели редактора появляется надпись Actions - Frame, если щелкнуть по кнопке, то появится надпись Actions - Button, то есть программа подсказывает, что вводимый код будет относиться к сценарию кнопки. А если выделить фотографию, то в поле, предназначенном для ввода скрипта, появится сообщение: Current selection cannot have actions applied to it (к данному выделенному объекту нельзя применить сценария).

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

Итак, для кнопки со стрелкой влево нам нужно формализовать следующий сценарий: «Если кнопка отпускается на некотором кадре, то с этого кадра необходимо перейти на предыдущий кадр». В соответствии с синтаксисом языка Action Script (рис. 10) это будет выглядеть следующим образом:

В первой строчке записан обработчик событий кнопки on(), имеющий формат:

Теперь добавим несколько ключевых кадров так, что в них скопируются созданные в первом кадре кнопки, и поместим во вновь созданные кадры нужные фотографии.

Если запустить на исполнение созданный фильм, то кадры будут непрерывно проигрываться один за другим, а следовательно, прежде всего нам нужно дать команду «Стоп» на первом кадре. Для этого первому кадру добавим соответствующую команду (рис. 11).

Рис. 11. Сценарий, присвоенный первому кадру

Обратите внимание: команда присваивается уже не кнопке, а кадру. Тот факт, что кадру присвоен сценарий, отмечается на основной монтажной линейке - в обозначении кадра над жирной точкой появляется строчная буква «a».

В результате мы получили следующий фильм .

Если у нас в фотоальбоме всего несколько кадров, то двух кнопок - «Вперед» и «Назад» - вполне достаточно, но если набор фотографий большой, то желательно иметь еще и кнопки, отсылающие в начало и конец фильма. В следующем примере мы добавим соответствующие кнопки: «В первый кадр» и «В последний кадр». Выбрать кнопки подходящей мнемоники можно из стандартной библиотеки кнопок из папки Сircle Вuttons (рис. 12).

На предлагаемом примере мы ознакомимся с еще одной командой gotoAndStop(), которая позволяет перейти к нужному кадру с последующей остановкой.

Рис. 12. Кнопки из папки Circle Buttons

На кнопку перехода к первому кадру (третья слева на рис. 13) повесим код, как показано на рис. 13.

Рис. 13. Сценарий для кнопки «В первый кадр»

В случае с фотоальбомом из пяти кадров в последнюю кнопку добавим сценарий перехода «В последний кадр»:

Автоматизированное написание скрипта

До сих пор мы набирали все команды вручную, однако панели редактора ActionScript предоставляют целый ряд сервисов для автоматизированного написания скрипта. Рассмотрим эти возможности.

Рис. 14. Средства автоматизированного написания скрипта

Панель редактора Action Script позволяет выбирать, перетаскивать, перераспределять и удалять команды.

Покажем, как можно написать тот же скрипт для кнопки «Вперед» в автоматизированном режиме. Выбрав папку Movie Clip Control (верхнее левое окно на рис. 14) можно получить доступ к обработчику событий on, а далее нужно либо дважды щелкнуть по соответствующему пункту, либо перетащить выражение на поле написания скрипта в режиме Drag and Drop.

Рис. 15. Подсказка для завершения выражения

В результате на рабочем поле появится необходимое выражение и подсказка вида (рис. 15): вы выбираете из меню нужную команду и выражение завершается автоматически. Как видно из меню, можно выбрать не только условие, связанное с экранными кнопками, - можно, также, выбрать из меню рис. 15 пункт keyPress “”, или keyPress “”, что соответствует нажатию клавиатурных клавиш (стрелка влево, стрелка вправо), то есть имеется возможность создать фотоальбом, который будет «перелистываться» с помощью клавиш клавиатуры.

Рис. 16. Обращения к кнопке клавиатуры

Задействуем команду keyPress “” (рис. 16), затем перейдем в папку Timeline Control, выберем команду nextFrame и перетащим ее на рабочее поле (рис. 17).

Рис. 17. Команду nextFrame можно найти в папке Timeline Control

Для кнопки, переводящей фильм в начало фотоальбома, в качестве события можно выбрать из меню нажатие клавиши Home, а далее (рис. 18) перетащить на поле команду gotoAndStop, в результате чего появится еще одна подсказка по возможному синтаксису данной команды.

Стрелочки в подсказке позволяют просмотреть разные варианты синтаксиса. Программа предоставляет два варианта (рис. 18 и 19), то есть предлагает задать сцену и кадр или только кадр. В нашем случае достаточно указать только кадр (Frame). Если название сцены опущено, то по умолчанию осуществляется переход к кадру текущей сцены.

Рис. 18. Подсказка по возможному синтаксису команды

Рис. 19. Стрелочка-треугольник позволяет просматривать варианты синтаксиса

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

Можно ли обеспечить сценарий, при котором разные события будут приводить к одним и тем же действиям? Оказывается, можно - для этого в обработчике событий on необходимо перечислить список наименований событий. Если вы поставите запятую в списке событий после первого события, то программа сама предложит вам меню (рис. 20).

Рис. 20. При введении запятой в списке событий автоматически появляется меню дополнительных команд

Добавим к первому событию (нажатие клавиатурной кнопки) второе событие (отпускание экранной кнопки):

on (keyPress "", release)

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

В рассмотренном примере мы использовали переход по номеру кадра, но этот способ не всегда удобен: если в процессе редактирования фильма нумерация кадров изменится, то логика может нарушиться. Более удобно использовать переход по метке кадра. Рассмотрим пример, в котором потребуется не только перелистывание альбома, но и переход к разным разделам, то есть более сложная навигация.

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

Первому кадру раздела «рисунки» дадим метку Pictures, аналогично первым кадрам других разделов присвоим метки graphics и photo.

Создадим слой для размещения меток и назовем его Lables. Для того чтобы поставить метку кадру, в панели Properties необходимо выбрать тип метки Name и записать ее имя. В нашем случае Pictures (рис. 21). Аналогично разместим метки в кадрах 5 и 10 (рис. 22).

Рис. 21. Пример присвоения кадру метки

Теперь добавим новый слой и назовем его Actions. В первом ключевом кадре слоя Actions вызовем панель Actions Frame (путем нажатия кнопки F9) и наберем команду stop () (см. рис. 22)

Рис. 22. Сценарий первого кадра

Добавим еще один слой под именем Subjects (тематика), в котором дадим заглавия соответствующим кадрам: «Рисунки» (рис. 23), «Графика» и «Фото».

Рис. 23. Заглавие для кадров раздела «Рисунки»

Теперь добавим сбоку кнопки меню с аналогичными именами, которые расположим на новом слое под названием Мenu.

Напечатаем с левого края первый пункт меню «Рисунки» и переведем его в кнопочный символ. С помощью инструмента Arrow выделим текстовый блок «Рисунки» и выполним команду Modify => Convert to Symbol (эту команду можно выполнить и с помощью клавиши F8), в панели Convert to Symbol зададим тип символа Button и определим его имя как pictureButton (рис. 24).

Рис. 24. Назначим кнопке перехода к разделу рисунков имя рictureButton

Создадим четыре кадра для кнопки «Рисунки»: первый будет представлять просто исходный текст (рис. 25), второй - тот же текст только синего цвета, третий кадр мы пропустим (в этом случае Down-кадр будет такой же, как и Over-кадр), а в Hit-кадре нарисуем прямоугольную область, которая определит область нажатия кнопки (рис. 26).

Рис. 25. Up-кадр кнопки pictureButton

Рис. 26. Hit-кадр кнопки pictureButton

Теперь нам нужно повесить сценарий на вновь созданную кнопку. Для этого выделим кнопку в сцене Scene 1 и, нажав F9, вызовем панель Actions, а затем внесем код, показанный на рис. 27.

Рис. 27. Сценарий перехода на кадр с меткой

Лекционные материалы, домашние задания и тесты
дистанционного курса «Электронная школа Macromedia Flash MX»
Российская еженедельная методическая газета для учителей информатики. Издательский дом «Первое сентября» № 42 (2003 год)
«Аналог программы «Правилка» из пакета «Хиты Роботландии»
в среде Macromedia Flash».
Печатные публикации

ЭЛЕКТРОННАЯ ШКОЛА MACROMEDIA FLASH MX
III курс: Основы программирования в Macromedia Flash MX
Модуль IV: Команда with. Программа «Правилка»
Язык ActionScript

Экспресс-план модуля:

• Команда with
• Flash-дублёр программы «Правилка» из пакета «Хиты Роботландии».

Команда with

При использовании объектов в программном коде (скрипте) нетрудно заметить, что даже в небольшом блоке скрипта неоднократно повторяется название одного и того же объекта. Особенно часто подобные повторения происходят при использовании некоторых отдельных объектов, например объектов Math , относящихся к верхнему уровню. Например, следующий код является довольно распространённым:

A = Math.PI * r * r; x = r * Math.cos(Math.PI); y = r * Math.sin(Math.PI/2);

Здесь объект Math встречается неоднократно, что затрудняет восприятие скрипта. Эту запись можно значительно упростить, если блок скрипта заключить в скобки, воспользовавшись командой with. Тогда в пределах данного блока скрипта интерпретатор ActionScript будет обращаться к указанному объекту. Теперь код можно переписать в следующем виде:

With (Math) { a = PI * r * r; x = r * cos(PI); y = r * sin(PI/2); }

Давайте познакомимся с общим форматом команды:

with (object) {
statement(s);
}

object — экземпляр ActionScript объекта или Movie Clip.

statement(s) — команда или группа команд, заключенных в фигурные скобки.

Давайте разберём ещё один пример, в котором в качестве объекта используется MovieClip с именем someOtherMovieClip:

With (someOtherMovieClip) { _x = 50; _y = 100; gotoAndStop(3); }

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

SomeOtherMovieClip._x = 50; someOtherMovieClip._y = 100; someOtherMovieClip.gotoAndStop(3);

Возможно использование вложенных команд with для доступа к информации во многих контекстных областях.

Flash-дублёр программы «Правилка» из пакета «Хиты Роботландии»

В ходе программирования работы кнопок мы активно будем использовать оператор ветвления: if и if else. А также организуем работу счётчика, прибавляющего очки пользователю в случае правильного ответа и отнимающего очки, в случае когда, не исправив ошибку, или произведя некорректные исправления, пользователь нажмёт кнопку «Далее».

Организуем работу Movie Clip (priz), в котором будет размещён «Призовой фонд». В том случае если пользователь наберёт 10 очков, его приз будет представлять собой корзину с аппетитными фруктами. Если в копилке пользователя окажется 9 или 8 очков в качестве приза он получит кусок сыра, если пользователю «посчастливится» набрать 6 или 7 очков он получит тыкву, ну а в том случае если он наберёт 5 или менее 5 очков ему достанется помидор!

Для любителей пятибалльной оценки переведём вышесказанное на доступный для школьного журнала язык:

Корзина с фруктами — 5 ;
Кусок сыра — 4 ;
Тыква — 3 ;
Помидор — 2 .

При обращении к Movie Clip мы будем использовать команду with.

На нашей сцене будет использовано 11 кадров. Первые 10 кадров будут представлять собой «рабочие листы», на которых будут размещены словосочетания с грамматическими ошибками (Input Text). Обычно поля ввода оставляют пустыми, но в нашем случае они должны работать! На каждом листе будет запрограммирована работа динамического поля. В том случае если пользователь не исправит грамматическую ошибку, в него будет выведен текст: «Вы не исправили ошибку!».

В данной программе использованы два слоя. Нижний слой — background на нём размещён статический текст «Программа Правилка», и графический символ со шляпой.

В том случае если вы непременно хотите использовать в программе для написания заголовка какой-нибудь экзотический шрифт, установленный на вашей машине, не забудьте использовать для этого текста процедуру Break Apart из меню Modify. Иными словами, превратите текст в графику. И тогда ваш текст не превратится в абракадабру на машине, где этого шрифта нет!

Теперь всё по порядку. 1 кадру пропишем скрипт:

Stop(); fscommand("showmenu", "false"); i = 0;

При проигрывании ролика необходимо отключить «Меню». Таким образом, мы не позволим пользователю сделать «шаг назад». И ещё мы «включаем» счётчик.
2-10 кадру пропишем акцию:

Работу кнопок рассмотрим на примере первого кадра. Остальные кнопки вы сможете запрограммировать самостоятельно.

On (release) { if (t1=="Белая хризантема") { i++; gotoAndPlay(2); } else { i--; z1 = "Вы не исправили ошибку!"; } }

Теперь сформируем «Призовой фонд». Создадим новый символ типа Movie Clip с именем priz в котором будут работать 5 кадров. Всем кадрам клипа пропишем акцию:

Первый кадр клипа будет пустым.

Во втором кадре поместим корзину с фруктами и пропишем кадру метку: five .
В третий кадр поместим кусок сыра и пропишем кадру метку: four .
В четвёртый кадр поместим тыкву и пропишем кадру метку: three .
В пятый фрейм поместим помидор и пропишем кадру метку: two .

В данной программе всё это «продовольственное разнообразие» было импортировано из коллекции ClipArt97 (wmf-файлы). Впрочем, вы можете сформировать свой собственный «Призовой фонд», всё зависит исключительно от вашей фантазии.

Вернёмся на сцену и на последнем 11 кадре поместим созданный нами клип с призами. Не забудьте прописать его на сцене. Instance Name: priz . Этому кадру пропишем скрипт, который будет, анализируя содержимое счётчика, «выдавать» пользователю приз:

Stop(); sh = i; with (_root.priz) { if (i

Протестируйте ролик. И если это необходимо произведите его отладку.

Для упрощения процесса тестирования создайте на последнем кадре поле динамического текста с именем sh и в это поле выводите данные счётчика. Для этого в скрипт 11 кадра добавьте второй строкой:

После завершения процесса отладки удалите это поле и прописанную вами строку.

Домашнее задание: Основы программирования в Macromedia Flash MX

О, сколько нам открытий чудных
Готовят просвещенья дух
И опыт, сын ошибок трудных,
И гений, парадоксов друг,
И случай, бог-изобретатель.
Александр Сергеевич Пушкин, «Евгений Онегин»

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

Иллюстративный материал, использованный для формирования «призового фонда» ролика вы сможете найти в архиве, сопровождающем материал лекции. В этом архиве представлены файлы в формате wmf. Если этот призовой фонд не удовлетворяет вашим требованиям, можете смело фантазировать и использовать собственную библиотеку.

Выполненное задание представьте в виде файла в формате fla (если размер файла превысит 150 Кб, пожалуйста, упакуйте файл в архив) и вышлите учителю.

Желаю Вам успехов в самостоятельном изучении Macromedia Flash MX!