Разделы на этой странице:
А теперь давайте поговорим о так называемых специальных текстовых блоках, т. е. о текстовых блоках, выполняющих особые функции. В данный момент они нам, правда, не пригодятся, зато понадобятся тогда, когда мы начнем писать программы в среде Flash (программированию посвящена часть IV данной книги).
Поля ввода
Поле ввода -
это своего рода небольшой текстовый редактор, помещенный в окно Windows-программы и предназначенный для ввода одно- или многострочного текста. При этом Windows сама управляет текстовым вводом: мы просто набираем символы, пользуемся клавишами-стрелками, клавишами , выделяем текст, используем буфер обмена, как в любом "большом" текстовом редакторе. Программисты фирмы Microsoft много поработали над тем, чтобы сделать стандартные поля ввода Windows по-настоящему удобными.
Чтобы создать во Flash поле ввода, сначала нужно поместить на рабочий лист обычный текстовый блок и выделить его инструментом "стрелка" (при этом в текстовый блок необязательно вводить какой-либо текст). Далее находим в верхнем левом углу панели Properties небольшой раскрывающийся список (см. рис. 7.4) и выбираем в нем пункт Input Text. Если после этого мы откроем полученный текстовый блок, увидим то, что показано на рис. 7.9.
Итак, что мы видим? А видим мы полный набор маркеров изменения размера (они сохранятся и в том случае, если мы закроем поле ввода). Это значит, что мы можем менять также и вертикальный размер полученного поля ввода. А прямоугольный маркер из правого верхнего угла переместится в правый нижний - это знак того, что перед нами именно поле ввода.
Вид панели Properties после выделения поля ввода представлен на рис. 7.10. Как видим, там появились дополнительные элементы управления, которые нужно рассмотреть.
Прежде всего, прямо под списком, которым мы только что пользовались, появилось поле, в котором нам нужно будет указать уникальное имя, идентифицирующее созданное нами поле ввода Flash. Каждое поле ввода, созданное на рабочем листе, должно иметь уникальное имя. Это имя может содержать буквы русского и латинского алфавита, цифры и знаки подчеркивания, причем оно обязательно должно начинаться либо с буквы, либо со знака подчеркивания.
Ниже поля ввода задания трекинга находится другой раскрывающийся список. С его помощью выбирается вид поля ввода. В этом списке доступны четыре пункта:
? Single Line - обычное однострочное поле ввода ;
? Multiline - многострочное поле ввода (иначе говоря - область редактирования);
? Multiline no wrap
- многострочное поле ввода, в котором не будет выполняться автоматический перевод строки (хотя пользователь все же может перенести строку вручную, нажав клавишу
? Password - поле ввода пароля. Аналогично обычному однострочному полю ввода, но скрывает введенный в него текст, отображая вместо него строку из "звездочек".
Правее этого списка находится набор их трех кнопок-выключателей. Первая из них нам уже знакома - она позволяет пользователю выделять находящийся в поле ввода текст:
Как видно на рис. 7.10, эта кнопка нажата и недоступна, т. е. не может быть отключена.
Вторая кнопка-выключатель, будучи включенной, предписывает Flash обрабатывать все встретившиеся в тексте теги HTML:
Так, если мы заключим фрагмент текста в тег <В>.. , Flash выделит его полужирным шрифтом. Если же эта кнопка выключена, Flash выводит текст "как есть", вместе с любыми тегами HTML, которые там заданы.
Вообще говоря, эта возможность полезна, только если мы задаем содержимое поля ввода из сценария ActionScript, так что описана она здесь "с опережением". Подробную информацию о поддержке тегов HTML в полях ввода и динамических текстовых блоках можно найти в интерактивной справке Flash.
Третья кнопка-выключатель во включенном состоянии заставляет Flash показывать рамку вокруг поля ввода, отчего последнее напоминает стандартное поле ввода Windows:
Если же она отключена, поле ввода имеет "плоский" вид.
Если созданное нами поле ввода должно являться частью оригинального интерфейса, лучше всего оставить эту кнопку отключенной. Если же мы желаем сделать поле ввода более привычным для пользователя или более заметным, можно включить эту кнопку.
Правее этих трех кнопок расположено поле ввода Var . В этом поле задается имя переменной ActionScript, в которую будет помещен введенный в созданное нами поле ввода текст. Переменная - это своего рода "ячейка камеры хранения" данных, созданная в памяти компьютера и имеющая уникальное имя, по которому ее можно однозначно определить. Мы можем обратиться к этой переменной по имени, извлечь из нее данные или поместить в нее новое значение. Во всех подробностях переменные будут рассмотрены в главе 19.
В поле ввода Maximum characters задается максимальное количество символов, которое сможет вводить в него пользователь. Если мы не хотим ограничивать это количество, то введем туда значение 0 (таково, кстати, значение поля по умолчанию).
А теперь давайте вернемся к теме внедрения шрифтов, но уже применительно к полям ввода (точнее, ко всем специальным текстовым блокам). Дело в том, что в этом случае никакое внедрение не выполняется - Flash сохраняет только имена использованных шрифтов. При воспроизведении готового изображения проигрыватель Flash сначала ищет эти шрифты на компьютере клиента и, если они есть, использует их для вывода текста. Если же подходящий шрифт не будет найден, то проигрыватель использует ближайший к искомому подобный шрифт, отчего изображение может исказиться. А это не всегда приемлемо.
Но мы все-таки можем заставить Flash внедрить в результирующий файл Shockwave/Flash описания избранных символов заданного для данного поля ввода шрифта. Сейчас мы увидим, как это делается.
Выбор символов шрифта для внедрения выполняется в диалоговом окне Character Embedding (рис. 7.11). Это окно появится на экране после нажатия кнопки Embed панели Properties (см. рис. 7.10).
Большой список этого окна позволит нам выбрать целые группы символов, которые должны быть внедрены в результирующий файл Shockwave/Flash. Он содержит довольно много пунктов; те же из них, что гарантированно нам пригодятся, приведены ниже:
? All (39477 glyphs) - все символы данного шрифта в количестве 39 477. Этот пункт приведен только для ознакомления; в реальности вряд ли кто-то будет им пользоваться;
? Uppercase (27 glyphs) - большие латинские буквы (27 символов);
? Lowercase (27 glyphs) - малые латинские буквы (также 27 символов);
? Numerals (11 glyphs) - арабские цифры (11 символов);
?Punctuation [!@#$%…] (52 glyphs) - знаки препинания и специальные обозначения (52 символа);
? Basic Latin (95 glyphs) - буквы большинства европейских языков (95 символов);
? Cyrillic (499 glyphs) - буквы кириллицы (499 символов). Пожалуй, самый важный пункт в нашем случае.
Как правило, в этом списке выделяются сразу несколько пунктов (правильно - кому нужны буквы без цифр!). Для этого сначала щелкнем мышью на первом пункте из набора тех, которые хотим выделить, потом нажмем клавишу
Под списком шрифтов находится поле ввода Include these characters. В нем мы можем вручную ввести символы, которые должны быть внедрены. Такой способ полезен, если мы хотим внедрить только определенные символы шрифта. А если мы нажмем кнопку Auto Fill, Flash сам подставит в данное поле ввода все символы, что мы использовали в тексте выделенного поля ввода.
В самом низу окна Character Options находится небольшое текстовое поле Total number of glyphs, показывающее, сколько символов мы уже выбрали для внедрения. Так что мы сможем вовремя остановиться.
Кнопка Don"t Embed позволит быстро удалить все символы, что мы выбрали для внедрения. При нажатии на нее будет очищено поле ввода Include these characters, а в большом списке с выбранных нами пунктов пропадет выделение.
Задав параметры внедрения шрифтов в диалоговом окне Character Embedding, следует нажать кнопку ОК, чтобы применить их. Если же нужно отменить эти параметры, нажмем кнопку Cancel.
Динамические текстовые блоки
Часто вместо того чтобы показывать обычный, неменяющийся текст, требуется выводить в текстовом виде результаты работы какого-либо сценария ActionScript. Например, такой сценарий может извлекать новости с сайта "Компьюленты", прогноз погоды - с сайта "Апорта", а курсы валют - с сайта "Рэмблера", добавлять к извлеченным данным текущее время и все это в виде текста выводить на экран. (Кстати, интересная идея…)
Вот как раз для вывода текста, являющегося результатом работы сценария, и применяются динамические текстовые блоки. (Обычные же текстовые блоки часто называют статическими.) Пожалуй, нужда в таких динамических текстовых блоках возникает чаще, чем в полях ввода.
Динамический текстовый блок создается практически так же, как поле ввода. Создаем обычный текстовый блок, выделяем его инструментом "стрелка" и находим в верхнем левом углу панели Properties небольшой раскрывающийся список (см. рис. 7.4). Вот только выбрать в этом списке нужно пункт Dynamic Text.
Выделенный динамический текстовый блок похож на поле ввода (см. рис. 7.9), да и панель Properties будет выглядеть примерно так же, как показано на рис. 7.10. Поэтому мы не будем давать описание находящихся в нем элементов управления, а ограничимся указанием на существующие отличия.
Для вывода текста в динамический текстовый блок используются все те же переменные. Сценарий ActionScript помещает в такую переменную выводимый текст, а сам вывод выполняет проигрыватель Flash. Имя этой переменной вводится во все то же поле ввода, что находится под списком, с помощью которого мы только что превратили обычный текстовый блок в динамический.
Теперь об отличиях. Отличие в плане интерфейса фактически имеется только одно и, вдобавок, оно нам уже знакомо. Кнопка-выключатель:
Включающая возможность выделения и копирования текста, помещенного в динамический текстовый блок - теперь доступна, и мы можем при желании ее отключить.
Отличие в плане возможностей состоит в том, что динамический текстовый блок может быть сделан прокручиваемым. Обычный динамический блок должен непременно иметь такие размеры, чтобы в нем помещалось все его содержимое. Для прокручиваемого же блока это не обязательно: подобно областям редактирования Windows, он может "прокручивать" содержащийся в нем текст. Для управления прокруткой же нам придется писать соответствующие сценарии ActionScript - прокручиваемый текстовый блок не содержит полос прокрутки.
Чтобы сделать динамический текстовый блок прокручиваемым, нужно сначала его выделить. После этого следует включить пункт-выключатель Scrollable
меню Text
или одноименный пункт контекстного меню текстового блока. Если текстовый блок в данный момент открыт, можно дважды щелкнуть на квадратном маркере, расположенном в правом нижнем углу прямоугольника выделения, удерживая нажатой клавишу
Прошлая статья была посвящена анимации. Мы создавали анимацию на основе motion tweening, shape tweening и просто составляли движение из отдельных кадров. Думаю, пора перейти к более сложной теме, рассмотрению инструмента, который создает основу для большинства качественных Flash-фильмов (Flash movies).
Этот инструмент - ActionScript - событийно-управляемый язык, встроенный во Flash. Последняя версия ActionScript, (которая присутствует во Flash 5), существенно отличается от ActionScript, который был в 4-м Flash. Если в прошлой версии, это был ограниченный набор команд, позволяющий осуществлять лишь основные действия, и вводимый с помощью не очень удобного интерфейса, то новый ActionScript - это мощный язык, с увеличенным набором команд, поддержкой классов, наследования (!), и гораздо более удобным интерфейсом.
ActionScript делает ваши страницы интерактивными. Вы можете реагировать на события с мышки или с клавиатуры, можете выполнить какие-либо действия при проигрывании определенного кадра.
Для того, чтобы овладеть ActionScript в полной мере, желательно уже иметь опыт программирования (предпочтительно на С++, JavaScript, etc.). Однако, одним из достоинств языка Flash, является то, что вам не нужно быть профессионалом во Flash, или полностью знать ActionScript, чтобы писать на нем качественный код. Вы можете использовать те возможности языка, которые сочтете необходимыми для своей работы.
Так как эта статья посвящена основам языка, в ней мы рассмотрим:
- Панель действий (Actions panel), на которой происходит практически все общение с ActionScript.
- Кнопки - как их заставлять работать, как нам требуется.
- Пути - как обращаться к нужным объектам?
- Основные действия с Flash-мультиками (movie clips) - мы будем управлять процессом проигрывания фильма, как нам будет угодно.
- Отладку в ActionScript - окошки Output и Debugger.
Цель этой статьи, дать вам почувствовать ActionScript, показать, что этот язык может служить, как для создания весьма внушительных программ, так и для выполнения элементарных действий, которые сделают вашу страницу гораздо привлекательней.
Термины
Прежде чем мы перейдем к конкретным действиям, несколько терминов из области ActionScript:
- Действия (Actions) - это инструкции, которые говорят Flash-мультику что делать. От них произошло название языка - ActionScript (дословно - сценарий действий). Давайте договоримся, что в рамках этой статьи, мы будем использовать термин "инструкция", дабы не путаться с настоящими действиями, которые будем производить.
- События (Events) - это действия, которые происходят, когда проигрывается мультик. События, например, могут происходить, когда заканчивается загрузка какого-то кадра, когда мы достигаем какого-то кадра, когда пользователь нажимает клавишу на клавиатуре или курсор мышки оказывается над нашим объектом.
- Выражения (Expressions) - это любая часть инструкции, которая порождает значение. Следующие примеры являются выражениями: 2 + 2, 2 * 2, a + b, 2*pi*r, (15 + k) * random(10) .
- Функции (Functions) - это блок кода, который можно многократно использовать. Функции можно передавать значения и получать от нее возвращаемый результат. Например, number = get_color(15, 24) . 15 и 24 являются аргументами (или параметрами) функции get_color, возвращаемое значение которой записывается в переменную number.
- Классы (Classes) - это типы объектов. Например, класс дерева - растение. Во Flash есть некоторое количество предопределенных классов (очень похожих на классы JavaScript). Вы можете создавать свои классы, или модифицировать существующие.
- Экземпляры (Instances) - это буквально экземпляры определенных классов. Например, экземпляром растения могут являться дерево, куст или цветок. Экземпляр - это уже конкретный реальный объект. Если класс - это определение объекта (экземпляра), то экземпляр - это уже конкретное воплощение, это класс в действии. Каждому экземпляру можно присвоить имя, чтобы через него обращаться к функциям или переменным объекта.
- Обработчики (Handlers) - это специальные инструкции, которые обрабатывают события. Например onClipEvent - обработчик действий, связанных с конкретным символом (см. ).
- Операторы (Operators) - это элементы языка, которые вычисляют значения, исходя из одного или более аргументов. Например, оператор сложения (+) возвращает сумму двух значений, стоящих слева и справа от него.
- Переменные (Variables) - это идентификаторы, которые могут хранить значения. Например, a = 5; или name = "Michael".
Эти термины мы будем использовать при обсуждении ActionScript. Итак…
Панель действий (Actions Panel)
Панель действий служит для отображения и ввода ActionScript программ (рис. 1). Существует два режима работы с панелью - нормальный (для "чайников") и экспертный. В экспертном режиме список команд - это простое поле для ввода текста. В нормальном же режиме, мы не можем напрямую редактировать команды. Для этого используется панель параметров.
Добавить инструкцию можно, нажав на кнопку "+" (см. рис. 1) или выбрав соответствующую инструкцию в списке элементов языка. Кроме того, для всех действий во Flash имеются последовательности клавиш, с помощью которых это можно сделать гораздо быстрее. Они приведены справа от каждого действия в меню кнопки "+". Например, чтобы добавить функцию stop() , нужно нажать Esc+st (последовательно: Esc, затем "s", затем "t").
Удалить инструкцию можно, выбрав ее, и нажав кнопку "-" (или просто клавишу Delete).
Я рекомендую вам не начинать сразу же пользоваться экспертным режимом, если у вас нету опыта программирования на Java-подобных языках (С++, Java, JavaScript). У нормального режима есть большое достоинство, делающее его незаменимым для новичков - в нем есть гораздо меньше шансов ошибиться с синтаксисом языка. Новичкам это поможет быстрее понять тонкости ActionScript.
Рис. 1 - Панель действий
В панели действий отображаются действия объекта, либо кадра, выбранного в данный момент.
Кнопки
Первое, что хочется, когда начинаешь изучать интерактивность Flash - сделать что-нибудь, что бы откликалось на действия пользователя, "оживить" ваше творение, добавить обратную связь. Самый простой способ сделать это - кнопки. Поэтому с них-то мы и начнем.
Как вы знаете, во Flash существует специальный тип символа для создания кнопок - Button (см. ). Будем считать, что вы уже научились создавать кнопки, теперь научимся отслеживать нажатия на эти кнопки.
Кнопки в Macromedia Flash обладают обширным списком событий, на которые мы можем реагировать:
- press - клавиша мышки нажата, когда курсор находится в пределах кнопки;
- release - клавиша мышки отжата, когда курсор находится в пределах кнопки;
- releaseOutside - клавиша мышки отжата, когда курсор находится вне пределов кнопки;
- rollOver - курсор мыши входит в пределы кнопки;
- rollOut - курсор выходит за пределы кнопки;
- dragOver - курсор входит в пределы кнопки, при этом была нажата кнопка, и нажата клавиша мыши;
- dragOut - курсор выходит за пределы кнопки, при этом была нажата кнопка, и нажата клавиша мыши;
- keyPress ("клавиша") - была нажата "клавиша". Список клавиш можно посмотреть в справке по Flash (объект Key), или использовать панель параметров для вводу нужной клавиши.
К сожалению, Flash "понимает" только левую клавишу мыши. Правая используется для вызова контекстного меню (щелкните правой клавишей на каком-нибудь Flash мультике). Способов отлавливать во Flash среднюю клавишу или "колесико" (mouse wheel), я пока не встречал, думаю, что их не существует.
Перехватываются эти события с помощью директивы on() . Синтаксис ее таков:
On (событие) { ... // Наши действия }
Ниже вы можете сами попробовать вызвать некоторые события:
Очень часто используемый пример - переход по ссылке при нажатии на кнопку:
On (release) { getURL("http://rubs.boom.ru"); }
Чтобы проверить этот сценарий, выделите вашу кнопку, нажмите Ctrl+Alt+A и введите программу.
Вот так просто можно перехватить все события, связанные с кнопкой. Ну а как их использовать - это дело исключительно вашего воображения.
Основные действия с Movie Clips
Огромная доля творчества во Flash приходится на манипуляцию символами. Практически все базовые приемы, все трюки и эффекты невыполнимы без этих действий.
С помощью сценариев на ActionScript вы можете выполнять практически любые действия над символами. Надо только помнить, что выполнить эти действия можно только либо в ответ на действие пользователя, либо при наступлении какого-то кадра на временной шкале.
Итак, что же у нас есть? Я перечислю только основные (на мой взгляд) инструменты. Остальное вы найдете в списке элементов языка или в помощи.
Функции клипов (movie clip), которые можно вызывать:
- play() - начинает или возобновляет воспроизведение клипа;
- stop() - останавливает воспроизведение клипа;
- gotoAndPlay() - переходит на определенный кадр (сцену) и продолжает воспроизведение;
- gotoAndStop() - переходит на определенный кадр (сцену) и останавливает воспроизведение.
Свойства (параметры) клипов, которые можно считывать/изменять:
- _x, _y - координаты клипа (в пикселях);
- _xscale, _yscale - масштаб клипа (в процентах), соответственно по горизонтали и по вертикали;
- _width, _height - ширина и высота клипа (в пикселях);
- _rotation - угол поворота клипа (в градусах);
- _alpha - прозрачность клипа (в процентах);
- _visible - видимость.
Это далеко не все, что можно делать с клипами. Используйте другие параметры, экспериментируйте, творите!
Имена
Для того, чтобы обращаться к клипам, нам потребуется разобраться с понятием имени объекта (instance name) и пути до объекта (target path). Договоримся, что клип (movie clip) и объект для нас - одинаковые вещи.
Имя объекта - это имя конкретного экземпляра символа. Скажем у нас может быть символ - машинка, а экземпляры этого символа будут называться "Машинка1", "Машинка2", "Pickup", "Запорожец"…
Для того чтобы дать имя объекту нужно выделить объект, и в панели Instance (Window->Panels->Instance, Ctrl+I) в графе Name ввести имя объекта (рис. 2). Имена могут состоять только из букв, цифр и символа подчеркивания ("_"), причем имя не может начинаться с цифры.
Рис. 2 - Панель Instance
Пути
Путь до объекта - это запись имени объекта с учетом иерархии. Попытаюсь объяснить, что это такое.
Вы знаете, что во Flash объекты можно "вкладывать" друг в друга, составляя, таким образом, иерархию. Так вот, эта вложенность обеспечивает не только удобство в обращении с объектами, она еще и ограничивает видимость имен объектов. Видимость ограничивается своим уровнем. Объект может напрямую (по имени) обращаться только к объектам, входящим в него, стоящим на 1 уровень ниже в иерархии.
Для того чтобы обратиться к объекту другого уровня, нужно знать путь до него. Причем путь может указываться как абсолютно (с самого верхнего уровня иерархии), так и относительно (с текущего уровня).
Путь включает в себя объекты, через которые нужно "пройти" по дереву иерархии, чтобы добраться до нужного нам объекта, перечисленные через точку. Кроме того, существует несколько указателей (можно их назвать "виртуальными объектами"), которые часто очень полезны:
this - указатель на "самого себя" (т.е на текущий объект). Бывает нужен, например, когда нужно передать в функцию указатель на объект, из которого эта функция вызывается.
_parent - указатель на "родителя". Указывает на объект стоящий уровнем выше в иерархии.
_root - "корень". Это начало иерархии. Без него не обойтись при указании абсолютного пути.
Путь выглядит так:
leaf.play(); - у подобъекта leaf (лист) вызывается функция play();
_parent.tree.leaf.stop(); - подразумевается, что на одном уровне имеется объект tree, у которого есть объект leaf , у которого и вызывается функция stop();
_root.banner._visible = false; - сделать клип banner , находящийся на 1-м уровне, невидимым.
Рис. 3 - Иерархия клипов
Для иллюстрации возьмем иерархию из 5-ти объектов (рис. 3). Объекты 1-4 находятся на 1-м слое, объект 5 - на 2-м слое. Объект 2 вложен в объект 1, а объект 3 вложен в объект 2. Объекты на рисунке визуально вложены друг в друга, но это ни в коем случае не означает, что так должно быть и "в жизни". Здесь они так сгруппированы для наглядности. Так как имя объекта не может начинаться с цифры, пусть объекты у нас называются obj1-obj5 .
Теперь займемся путями. Для начала посмотрим, какие объекты могут обращаться друг к другу по имени. obj1 может обращаться к obj2, а obj2 - к obj3 , но при этом obj1 не может обратиться к obj3 напрямую, т.к. тот содержится не в obj1 , а в obj2 .
Скажем первому объекту нужно, чтобы объект 3 начал заново воспроизводиться с 1-го кадра. Вот как это делается:
Obj2.obj3.gotoAndPlay(1);
Чтобы 4-му объекту сделать 1-й объект (заметьте со всеми подобъектами!) полупрозрачным, ему нужно в своем сценарии написать следующее:
Parent.obj1._alpha = 50;
Root.obj1._alpha = 50;
Т.к. obj4 у нас находится на первом уровне иерархии, то для него _root и _parent - одно и то же.
Теперь для объекта 3 напишем скрипт, который сделает объект 5 невидимым при нажатии клавиши мыши. В сценарии для объекта 3 пишем:
OnClipEvent (mouseDown) { _root.obj5._visible = false; }
В этом фрагменте мы использовали абсолютный путь. Если бы мы использовали относительный, это выглядело бы как:
Parent._parent._parent.obj5._visible = false;
Надеюсь, я прояснил момент с путями.
Приведенные выше примеры показали не только как выглядят пути, но и как вызываются функции и присваиваются значения свойствам.
Чтобы данные с веб-сервера были доступны 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-адресов
Файл политики содержит один тег
одной звездочкой, что соответствует всем доменам и всем 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 значения 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 добавляется в основной файл политики, он применяется ко всем каталогам хоста. В противном случае он применяется только к каталогу и подкаталогам, на которые распространяется файл политики, содержащий тег.
Загрузка данных с сервера или подключение к сокету выполняется в асинхронном режиме. Проигрыватель Flash Player просто ожидает завершения загрузки файла политики, прежде чем запустить основную операцию. Однако извлечение пикселных данных из изображений или получение сэмплов звука выполняется в синхронном режиме. Прежде чем можно будет получить данные, должна завершиться загрузка файла политики. Загружая мультимедийные данные, необходимо получить файл политики.
Если используется метод Loader.load() , задайте свойство checkPolicyFile параметра context , который является объектом LoaderContext.
Если изображение встраивается в текстовое поле с помощью тега , задайте атрибуту checkPolicyFile тега
значение "true" , как показано ниже.
Если используется метод Sound.load() , задайте свойство checkPolicyFile параметра context , который является объектом SoundLoaderContext.
Если используется NetStream, задайте свойство checkPolicyFile объекта NetStream.
Если задан один из этих параметров, проигрыватель Flash Player сначала проверяет файлы политики, уже загруженные для этого домена. Затем он ищет файл политики сервера в местоположении по умолчанию, проверяя теги
Всем добрый день! Сегодня поговорим с вами о том, как вставить flash на сайт. Казалось бы, вопрос пустяковый. Если это баннер, то просто скопировать предложенный код и разместить в шаблоне, виджете или на странице через редактор. Если это flash анимация для сайта, то вставить при помощи того же кода, но прописанного самостоятельно. Однако и в этом несложном процессе есть свои тонкости, о которых мы сейчас поговорим.
Flash анимация для сайта
Итак, нам потребовалось разместить флэш анимацию на сайте. Для этого используется стандартный код:
На первый взгляд все правильно и ничто не предвещает проблем. Однако, если вы прокрутите страницу вверх, то увидите такую особенность, что размещенная таким образом flash анимация будет перекрывать админский тулбар - верхнюю черную панельку админа WordPress.
По большому счету, это не критично, поскольку данную панель видите только Вы и ваши помощники, если на блоге отключена регистрация пользователей. Но настоящие проблемы возникают, когда на сайте используется многоуровневое css меню, под которым размещен флэш баннер, который в этом случае его перекрывает.
Это происходит оттого, что flash всегда по глубине находится впереди блоков div. Чтобы этого избежать, нужно добавить всего лишь один дополнительный параметр в наш код:
В этом случае ролик flash ведет себя как обычное изображение. Также можно воспользоваться аналогичным параметром value=»transparent», но это создаст дополнительную нагрузку ни замедлит загрузку страницы. В конечном результате на код вставки флеш на сайт будет выглядеть так:
Плагин для размещения flash анимации на сайте
Если Вам приходится часто вставлять разные ролики или просто боитесь что-то неправильно написать в этом длинном коде, то можно воспользоваться плагином, который вставляет флеш на сайт автоматически - от вас требуется лишь указать адрес его расположения. Называется он WP-SWFObject. Как обычно, скачиваем и устанавливаем его, затем заходим в «Параметры > WP-SWFObject» и выполняем необходимые настройки. Здесь можно все оставить по умолчанию, кроме одного - пункта «Window Mode». Для того, чтобы вставить swf на сайт с учетом тех параметров, которые нам нужны, выберите здесь из выпадающего списка «OPAQUE» и сохраните настройки.
Теперь, чтобы вставить флэш на сайт, пропишите шорткод (его потом можно для удобства добавить на панель редактора)
В действии выглядеть будет так:
Для прямого размещения через шаблон используйте другой код:
До сих пор мы рассматривали 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 “
Рис. 16. Обращения к кнопке клавиатуры
Задействуем команду keyPress “
Рис. 17. Команду nextFrame можно найти в папке Timeline Control
Для кнопки, переводящей фильм в начало фотоальбома, в качестве события можно выбрать из меню нажатие клавиши Home, а далее (рис. 18) перетащить на поле команду gotoAndStop, в результате чего появится еще одна подсказка по возможному синтаксису данной команды.
Стрелочки в подсказке позволяют просмотреть разные варианты синтаксиса. Программа предоставляет два варианта (рис. 18 и 19), то есть предлагает задать сцену и кадр или только кадр. В нашем случае достаточно указать только кадр (Frame). Если название сцены опущено, то по умолчанию осуществляется переход к кадру текущей сцены.
Рис. 18. Подсказка по возможному синтаксису команды
Рис. 19. Стрелочка-треугольник позволяет просматривать варианты синтаксиса
После того как мы назначим всем кнопкам соответствующие кнопки клавиатуры, получим следующий фильм , где листание фотографий будет происходить с клавиатуры, а нажатие мышью на экранные кнопки не будет вызывать никаких последствий.
Можно ли обеспечить сценарий, при котором разные события будут приводить к одним и тем же действиям? Оказывается, можно - для этого в обработчике событий on необходимо перечислить список наименований событий. Если вы поставите запятую в списке событий после первого события, то программа сама предложит вам меню (рис. 20).
Рис. 20. При введении запятой в списке событий автоматически появляется меню дополнительных команд
Добавим к первому событию (нажатие клавиатурной кнопки) второе событие (отпускание экранной кнопки):
on (keyPress " |
Повторим процедуру для остальных кнопок и в результате получим фотоальбом , в котором листание фотографий будет происходить как с помощью мыши, так и с помощью клавиатуры (исходный 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. Сценарий перехода на кадр с меткой
