Флеш как изменить цвет мыши

Флеш как изменить цвет мыши

Порой, при работе над flash-приложением, возникает необходимость перекрасить какой-либо объект (MovieClip, Sprite) на сцене флеш-ролика в новый цвет. И язык ActionScript предоставляет нам такую возможность. Так, в ActionScript 2.0 для этого используется класс Color.

Допустим, у нас в флеш-ролике имеется MovieClip с именем «mc». Этот мувик мы хотим перекрасить в красный (0xff0000) цвет.

Код ActionScript 2.0:

var color:Color = new Color(mc); color.setRGB(0xff0000);

Как видите, с помощью метода setRGB() класса Color наша задача решается быстро и легко.

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

Код ActionScript 3.0:

var ct:ColorTransform = new ColorTransform(); ct.color = 0xff0000; mc.transform.colorTransform = ct;

Как можно применить рассмотренные выше возможности класса Color языка ActionScript 2.0 и класса ColorTransform языка ActionScript 3.0 на практике? Ну, например, мы можем создать простое приложение-«раскраску».

Делать пример я буду в Adobe Flash CS 5.5 и на ActionScript 3.0. Для нашей будущей раскраски нужна заготовка: давайте нарисуем человечка и все составляющие части этого человечка (голову, туловище, руки, ноги . ) сделаем мувиклипами. Этим мувиклипам дадим имена «mc_1», «mc_2», «mc_3» и так далее. Кроме этого, нам понадобится стандартный компонент ColorPicker (можно, кстати, воспользоваться палитрой цветов из урока «Создание палитры цветов на ActionScript 3.0»). Просто перетащите данный компонент из окна «Компоненты» на рабочий стол программы, а потом удалите его с рабочего стола (при этом компонент останется в библиотеке вашего проекта).

Осталось написать код. Пишем.

Код ActionScript 3.0:

/* импорт классов */ import flash.display.MovieClip; import flash.events.MouseEvent; import fl.controls.ColorPicker; import fl.events.ColorPickerEvent; /* переменная, в которой хранится выбранный пользователем цвет */ var color:uint = 0x000000; /* мувиклипы, из которых состоит раскраска при клике по любому из мувиков будет вызываться функция onClick */ mc_1.addEventListener(MouseEvent.CLICK, onClick); mc_2.addEventListener(MouseEvent.CLICK, onClick); mc_3.addEventListener(MouseEvent.CLICK, onClick); mc_4.addEventListener(MouseEvent.CLICK, onClick); mc_5.addEventListener(MouseEvent.CLICK, onClick); mc_6.addEventListener(MouseEvent.CLICK, onClick); mc_7.addEventListener(MouseEvent.CLICK, onClick); mc_8.addEventListener(MouseEvent.CLICK, onClick); mc_9.addEventListener(MouseEvent.CLICK, onClick); mc_10.addEventListener(MouseEvent.CLICK, onClick); mc_11.addEventListener(MouseEvent.CLICK, onClick); mc_12.addEventListener(MouseEvent.CLICK, onClick); mc_13.addEventListener(MouseEvent.CLICK, onClick); mc_14.addEventListener(MouseEvent.CLICK, onClick); mc_15.addEventListener(MouseEvent.CLICK, onClick); mc_16.addEventListener(MouseEvent.CLICK, onClick); mc_17.addEventListener(MouseEvent.CLICK, onClick); mc_18.addEventListener(MouseEvent.CLICK, onClick); mc_19.addEventListener(MouseEvent.CLICK, onClick); mc_20.addEventListener(MouseEvent.CLICK, onClick); mc_21.addEventListener(MouseEvent.CLICK, onClick); mc_22.addEventListener(MouseEvent.CLICK, onClick); mc_23.addEventListener(MouseEvent.CLICK, onClick); mc_24.addEventListener(MouseEvent.CLICK, onClick); mc_25.addEventListener(MouseEvent.CLICK, onClick); /* функция, которая срабатывает при клике по мувику именно эта функция и меняет цвет мувиклипов */ function onClick(event:MouseEvent):void < var ct:ColorTransform = new ColorTransform(); ct.color = color; event.target.transform.colorTransform = ct; >/* добавляем ColorPicker, чтобы пользователь мог бы выбрать нужный ему цвет */ var colorPicker:ColorPicker = new ColorPicker(); colorPicker.move(50, 50); colorPicker.addEventListener(ColorPickerEvent.CHANGE, changeColorPicker); addChild(colorPicker); function changeColorPicker(event:ColorPickerEvent):void

У меня получилось следующее:

Выбираем в ColorPicker-е любой цвет и кликаем курсором мышки по человечку. Примитивно, но примеры и должны быть простыми. Естественно, если вы потратите больше времени и сил, чем я, то и результат получите более достойный.

Скачать исходник к данному уроку можно здесь (на ActionScript 3.0 и под Adobe Flash 5.5).

Дата добавления: 2012-03-29

Рейтинг поста: 39

ЭЛЕКТРОННАЯ ШКОЛА MACROMEDIA FLASH MX
IV курс: Углубляемся в программирование Macromedia Flash MX
Модуль II: Программное изменение цвета, Изменяем цвет курсора мыши
Язык ActionScript

В данной работе очень важно будет соблюсти размеры сцены. В данном примере Width — 400, Height — 200. На сцене будут работать два слоя.

Слой mouse — на этот слой поместите экземпляр символа типа Movie Clip, который будет представлять собой курсор мыши (в данном примере курсор динамический! — птица, махающая крыльями). Обязательно пропишите клип на сцене, например, Instance Name: mous. Растяните кадр, встав на третий кадр и используя команду Insert Frame.

Слой pole — на этом слое вы должны разместить 8 разноцветных квадратов. Размер квадрата 100×100. Цвет квадратов дело хозяйское, но для того, чтобы не запутаться в приведённых ниже скриптах, вам стоит придерживаться представленного в лекции варианта ролика. Второй и третий кадр этого слоя сделайте ключевыми. Всем кадрам этого слоя нам предстоит прописать скрипты.

Первому кадру пропишите скрипт:

В данном случае мы скрываем стандартный курсор мыши и заставляем работать наш динамический курсор.

Второму кадру пропишите скрипт:

Согласно тексту скрипта цвет курсора будет зависеть от его расположения на поле. Цвет представлен в шестнадцатеричной системе счисления, впрочем, если вы не новичок в web-дизайне и вам хорошо знакомы такие программы как Adobe Photoshop и Macromedia HomeSite, то вы легко разберётесь в написанном.

Третьему кадру пропишите скрипт:

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

***
Безусловно, некоторые фрагменты скриптов вызвали у вас затруднения, однако приведённая ниже информация должна полностью ликвидировать эту проблему.

Объект Color

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

Общий формат конструктора:
cn = new Color(target)
cn — имя создаваемого объекта Color. Обратите внимание, что вы можете назначать совершенно произвольные имена.
target — это маршрут и имя экземпляра клипа, управление которым осуществляется в данный момент времени.

После того как будет создан объект Color, вы можете использовать любой из его методов.

Методы getRGB() и setRGB() объекта Color

getRGB() — возвращает числовое RGB-значение для любого экземпляра клипа, прописанного на сцене.
setRGB() — позволяет изменить цвет любого экземпляра клипа, прописанного на сцене, применяя заданное RGB-значение.

Функция parseInt()

Функция parseInt() позволяет получить числовое значение из строкового значения путём синтаксического анализа. Эта функция всегда возвращает целое значение. Функция может быть использована для получения числовых значений путём синтаксического анализа строк, представляющих числа с основанием отличным от 10. Для этого в качестве второго необязательного параметра данной функции, необходимо указать основание системы счисления.

Общий формат функции:
parseInt(expression, radix);

expression — строка или же число с плавающей запятой или другое выражение, представленное для анализа и конвертирования в целое число.
radix — целое число, представляющее для анализа основание системы счисления числа. Допустимые значения от 2 до 36. Этот параметр, как уже было сказано выше, не является обязательным, но желательным. Если вы не хотите терзаться сомнениями, не ленитесь указывать необходимую в ваших вычислениях систему счисления.

Обязательно изучите приведённые ниже примеры.
parseInt(«3.5»); // возвращает 3.5
parseInt(«4foo»); // возвращает 4
parseInt(«11», 2); // возвращает 3
parseInt(«11», 10); // возвращает 10
parseInt(«3E8», 16); // возвращает 1000
parseInt(«gg», 17); // возвращает 288

Свойство _currentframe

Свойство _currentframe очень часто используется в сочетании с командой gotoAndPlay() для перемещения по временной шкале на определённое число кадров относительно текущего положения.

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

Не трудно всякое дело сделать, да трудно выдумать.
Русская пословица

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

4. Флэш-символы и библиотеки

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

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

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

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

4.1.1. Внутренний ролик

Существуют флэш-символы трех типов. Первый и самый распространенный из них — это ролик (Movie clip). Обратите внимание, что в основном ролике может содержаться сколько угодно других роликов! Этот тип флэш-символа в среде флэшеров обычно называют "мувик" (по созвучию с английским названием Movie clip).

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

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

4.1.2. Кнопка

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

Рис. 4.1. При наведении на кнопку указатель мыши изменяет форму

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

4.1.3. Графика

И, наконец, третий тип флэш-символа называется графическим объектом, или просто графикой (Graphic). Не следует думать, что такие объекты содержат только статическую графику. Они тоже могут содержать анимацию, но в отличие от мувиков они всегда синхронизированы с основным роликом (или "родительским" мувиком, если графика расположена внутри него). Если, к примеру, проигрывание основного ролика останавливается; останавливается и анимация во всех графических объектах, расположенных в нем.

4.1.4. Создание флэш-символов

Чтобы преобразовать какой-либо объект во флэш-символ, следует его выделить и нажать клавишу F8. При этом появится диалоговое окно Symbol Properties (Свойства символа) (рис. 4.2). Здесь необходимо указать в поле Name (Имя) имя флэш-символа, используемое при его помещении в библиотеку, а также его тип с помощью переключателя Behavior (Поведение). По умолчанию создается мувик.

Рас. 4.2. Окно настройки флэш-символа

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

Работа с библиотекой

Чтобы открыть окно библиотеки (если оно еще не открыто), нажмите сочетание клавиш CTRL+L. На рис. 4.3 показано, как может выглядеть библиотека.

Рис. 4.3. Библиотека ролика

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

При щелчке мышью на названии какого-либо объекта в библиотеке он отображается на панели предварительного просмотра (в верхней части окна библиотеки). Для звука прорисовывается его волновая форма. Если объект содержит анимацию (или, опять же. является звуком), то в окошке предварительного просмотра появляются кнопки Play (Воспроизведение) и Stop (Стоп), как покачано на рис. 4.4. Таким образом, щелкнув на кнопке Воспроизведение, можно просмотреть анимацию в окне предварительного просмотра. Интересно, что, доиграв до последнего кадра, анимация приостанавливается и не "перескакивает" обратно на первый кадр до первого движения мыши.

Рис. 4.4. Кнопки воспроизведения анимации/звука в окне предварительного просмотра библиотеки

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

Чтобы создать новую папку, щелкните на кнопке New Folder (Создать папку), расположенной под списком объектов библиотеки. Затем нужные объекты можно перетащить в папку мышью. Кстати, двойной щелчок на имени папки или объекта позволяет его переименовать. Двойной щелчок на символе папки открывает или закрывает ее. На рис. 4.5 показано, как может выглядеть библиотека, внутри которой организована структура папок.

Рис. 4.5. Для внутренней организации библиотеки можно применять папки

Снизу от списка объектов библиотеки есть еще три полезных кнопки. Кнопка New Symbol (Создать символ) позволяет создать новый флэш-символ. При этом программа сначала запросит его имя и тип в диалоговом окне Symbol Properties (Свойства символа), а затем откроет его для редактирования.

Редактирование флэш-символов

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

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

Кстати, создать новый пустой флэш-символ и перейти к его редактированию можно, просто нажав сочетание клавиш CTRL+F8 или с помощью команды Options New Symbol (Параметры Создать символ) в меню окна библиотеки.

Если же выделить какой-либо объект в библиотеке, щелкнуть на нем правой кнопкой мыши и выбрать из контекстного меню пункт Edit (Изменить) (или просто дважды щелкнуть на его значке), то можно приступить к его редактированию. При этом отображается рабочая область этого флэш-символа и его шкала времени (рис. 4.6).

Рис. 4.6. У каждого флэш-символа есть своя шкала времени

Следующей полезной кнопкой в окне библиотеки является кнопка Properties (Свойства). Она открывает диалоговое окно Symbol Properties (Свойства символа) для выделенного флэш-символа, однако по сравнению с окном, изображенным на рис. 4.2, в него добавляется кнопка Edit (Изменить), которая также позволяет войти в режим редактирования флэш-символа.

Кнопка Delete (Удалить) просто удаляет выбранный объект из библиотеки. Эту операцию невозможно отменить командой Undo (Отменить), поэтому здесь нужно быть особенно внимательным.

Наконец, в правой части окна библиотеки расположена кнопка, которая разворачивает окно библиотеки до его "полного" вида (рис. 4.7). Здесь можно увидеть дополнительную информацию о каждом объекте библиотеки. Например, дав в этом окне команду Options Update Use Counts Now (Параметры Обновить счетчики использования), можно увидеть в отдельном столбце, сколько раз каждый из флэш-символов использован в ролике.

Рис. 4.7. Библиотека в развернутом виде

Однако этим цифрам не стоит доверять безоговорочно. Дело в том, что команда Update Use Counts Now (Обновить счетчики использования) подсчитывает только флэш-символы, явно перенесенные в основной ролик, но не учитывает экземпляры флэш-символов, созданные программно.

Чтобы разместить флэш-символ на сцене основного ролика, достаточно просто перетащить мышью его значок из окна библиотеки в рабочую область. Можно также перетаскивать объекты в рабочую область не основного ролика, а другого флэш-символа, то есть вкладывать флэш-символы друг в друга.

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

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

4.2. Образцы и экземпляры

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

4.2.1. Анимация с использованием флэш-символов

Сразу же очевидно, что, поскольку пульсирующие круги отличаются только размером и цветом, имеет смысл создать пульсирующий круг как флэш-символ. Откройте новый ролик и нарисуйте средних размеров круг синего цвета. Удалите его контур. Выделите круг и нажмите клавишу F8, чтобы преобразовать его во флэш-символ. Назначьте ему тип Movie clip (Мувик) и дайте имя, например, Ball1. Теперь удалите получившийся мувик с основной сцены.

Откройте окно библиотеки с помощью клавиш CTRL+L. Выделите в нем единственный мувик Ball1 и дважды щелкните по на его значке. Откроется окно редактирования мувика Ball1. Выделите на шкале времени позицию 12 и нажмите клавишу F6, чтобы создать ключевой кадр, а затем сделайте то же самое в позиции 23. Вернитесь в ключевой кадр на позиции 12 и увеличьте в нем изображение круга с помощью кнопки Scale (Масштабирование). Создайте в 1 и 12 кадрах морфинг. Получился мувик, содержащий пульсирующий (увеличивающийся и уменьшающийся в размерах) круг.

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

Сейчас у нас на сцене расположены два экземпляра нашего мувика. Обратите внимание на то, что каждый экземпляр (instance) флэш-символа может иметь свой размер, цвет и прозрачность. Эти свойства принадлежат именно экземпляру флэш-символа, и никак не влияют на его образец, который расположен в библиотеке.

Выделите нижний экземпляр мувика Ball1. Нажмите кнопку Scale (Масштабирование) и уменьшите его. Теперь (у нас по-прежнему выделен тот же экземпляр мувика) откройте вспомогательную панель Effect (Эффект). Если ее нет на экране, дайте команду Window Panels Effect (Окно Панели Эффект). В раскрывающемся списке этой панели выберите пункт Tint (Оттенок), чтобы изменить цвет экземпляра. Щелкните мышью на оранжевом цвете цветной шкалы, расположенной в нижней части панели Effect (Эффект). Экземпляр мувика Ball1 станет оранжевым, в то время как другой останется синим.

Чтобы "запустить" оба экземпляра по разным траекториям, разместим их и разных слоях. Выберите один из экземпляров и нажмите клавиши CTRL+X, чтобы вырезать его в буфер обмена. Создайте новый слой (он получит название Layer 2) и, сделав его текущим, дайте команду Edit Paste in Place (Правка Вставить в то же место) или нажмите сочетание клавиш CTRL+SHIFT+V. В отличие от обычной команды Paste (Вставить) команда Paste in Place (Вставить в то же место) присваивает объекту те же координаты, которые он имел в "старом" слое.

Теперь нажмите кнопку Add Guide Layer (Добавить слой траектории), чтобы создать слой траектории. Нарисуйте на нем кривую, по которой "полетит" верхний круг. Перейдите обратно на слой, где располагается объект, и "притяните" его к концу траектории. То же самое проделайте с другим экземпляром мувика. Должно получиться что-то, похожее на рис. 4.8.

Рис. 4.8. Использование флэш-символов в анимации движения

Перейдите в слой Layer 1 и, отметив позицию 48 на шкале времени, нажмите клавишу F6, чтобы создать ключевой кадр. Переместите в этом кадре экземпляр мувика на другой конец траектории. Затем откройте вспомогательную панель Effect (Эффект) и сделайте круг зеленым. Теперь перейдите в слой Layer 2 и проделайте то же самое с другим экземпляром мувика. Сделайте круг в заключительном кадре желтым.

В обоих слоях траекторий вставьте в позицию 48 шкалы времени обычные кадры. Нажмите клавиши CTRL+ENTER. Вы увидите два пролетающих справа налево круга разных размеров, которые на ходу изменяют цвет, а также увеличиваются и уменьшаются. Заметьте, что увеличение и уменьшение происходит внутри мувика Ball1, а движение по траектории и изменение цвета — внутри основного ролика.

4.2.2. Асинхронная анимация

Теперь давайте немного усложним этот пример. Пусть один из наших шаров летит быстрее другого, тогда синхронность движения нарушится и анимация станет более естественной.

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

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

Нажмите клавиши CTRL+F8, чтобы создать пустой флэш-символ, и создайте там анимацию движения по траектории, как описывалось выше. Сделайте этот флэш-символ мувиком и назовите его ani1. Пусть анимация заканчивается в позиции 48.

Затем создайте мувик под названием ani2, а в нем — анимацию движения по траектории другого экземпляра флэш-символа Ball1, заканчивающуюся в позиции 60. У нас получилось два мувика, каждый из которых содержит мувик Ball1 (с пульсирующим шариком), "пролетающий" сквозь рабочую область и изменяющий свой цвет.

Перейдите в основной ролик. Удалите из него все, чтобы остался только один пустой кадр. Перетащите в него из библиотеки мувики ani1 и ani2, разместив их так же, как на рис. 4.8 размещены экземпляры мувика Ball1.

Несмотря на то что в основном ролике сейчас всего один кадр, он уже готов! Нажмите клавиши CTRL+ENTER. Если все сделано правильно, вы увидите, как два пульсирующих шара, появившись с правой стороны экрана, пролетают палевое различной скоростью. Шар, закончивший путь быстрее, сразу же снова появляется с правой стороны, в то время как другой еще заканчивает предыдущий "полет".

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

4.2.3. Настройка экземпляров

Рассмотрим подробнее вспомогательную панель Effect (Эффект), с помощью которой можно изменять внешний вид выделенного экземпляра флэш-символа. Главным элементом управления в ней является раскрывающийся список. Если в нем выбран пункт None (Нет), экземпляр флэш-символа имеет тот же цвет, что и образец.

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

Пункт Tint (Оттенок) позволяет выбрать любой цвет из цветовой шкалы.

Очень интересен пункт Alpha (Альфа-канал). Он позволяет регулировать значение прозрачности. При его уменьшении (<100%) объект становится прозрачным, так что сквозь него виден фон и другие объекты. Чем меньше, значение параметра, тем выше степень прозрачности. При нулевом значении параметра Alpha (Альфа-канал) объект вообще не виден.

Последний пункт раскрывающегося списка Effect (Эффект) — Advanced (Расширенный). Он позволяет произвольно регулировать и цвет, и прозрачность. Вы спросите, а зачем он вообще нужен, если есть отдельная регулировка яркости, оттенка и прозрачности? Оказывается, для экземпляра флэш-символа может быть использован только один из пунктов раскрывающегося списка Effect (Эффект). То есть, если сперва настроить прозрачность, выбрав пункт Alpha (Альфа-канал), а затем выбрать для того же экземпляра пункт Tint (Оттенок), установки прозрачности сбрасываются! Поэтому и возникла необходимость во введении пункта Advanced (Расширенный), который можно рассматривать как универсальную замену трех предыдущих.

Кроме панели Effect (Эффект), за свойства экземпляра отвечает еще и вспомогательная панель Instance (Экземпляр). Здесь в раскрывающемся списке Behavior (Поведение) можно выбрать тип поведения для экземпляра! То есть, любой экземпляр флэш-символа можно заставить вести себя и как мувик, и как кнопку, и как графику, независимо от того, к какому типу принадлежит его образец!

Кроме того, на этой панели есть еще четыре кнопки: Swap Symbol (Подменить символ), Edit Symbol (Изменить символ), Duplicate Symbol (Дублировать символ) и Edit Actions (Изменить действия). Первая из них позволяет подставить другой образец для данного экземпляра флэш-символа и используется очень редко, так как несколько противоречит четкой логике построения ролика как иерархической структуры.

Вторая и третья кнопки служат соответственно для входа в режим редактирования и для копирования флэш-символа. Четвертая кнопка, Edit Actions (Изменить действия), служит для программирования действий, выполняемых в связи с различными событиями: это могут быть, например, нажатие пользователем кнопки мыши, получение роликом внешних данных и т. п. Действия программируются на языке ActionScript — внутреннем языке программы Flash. Как это делается, мы начнем рассматривать в следующей главе.

4.3. Особенности кнопок

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

Итак, проведем эксперимент. Откроем новый ролик, нарисуем в рабочей области прямоугольник, например, синего цвета, выделим его и нажмем клавишу F8, чтобы преобразовать во флэш-символ. Зададим ему тип Button (Кнопка) и назовем knopka. Теперь дважды щелкнем на нашей кнопке (или на ее значке в библиотеке), чтобы перейти в режим редактирования.

4.3.1. Шкала времени для кнопки

Посмотрите, как выглядит шкала времени для кнопки (рис. 4.9). На ней всего четыре кадра, причем каждый из них имеет свое название: Up (Свободна), Over (Сверху), Down (Нажата) и Hit (Область наведения). В принципе, можно насоздавать дополнительные кадры, но толку от них никакого не будет.

Рис. 4.9. Шкала времени для кнопки

Четыре кадра Up (Свободна), Over (Сверху), Down (Нажата) и Hit (Область наведения) предназначены для управления видом кнопки в зависимости от действий пользователя. Как мы уже говорили, при наведении мыши на кнопку (при просмотре ролика) указатель мыши превращается в "лапку". Но, помимо этого, программа Flash ориентирована еще и на изменение вида самой кнопки.

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

Продолжим рассмотрение нашего примера. Сейчас у нас в кнопке knopka определен только кадр Up (Свободна). При этом программа ведет себя так, как будто в остальных кадрах содержится то же самое, что и в кадре Up (Свободна).

Нажмем два раза клавишу F6, чтобы создать ключевые кадры на позициях Over (Сверху) и Down (Нажата). Перейдем в кадр Over (Сверху). Зальем в нем наш прямоугольник черно-синим круговым градиентом. Теперь перейдем в кадр Down (Нажата). Зальем в нем прямоугольник тем же градиентом, затем нажмем кнопку Scale (Масштабирование) и уменьшим размер прямоугольника. Передвинем его так, чтобы центр фигуры остался на том же месте, что и у большого прямоугольника в других кадрах.

Нажмите клавиши CTRL+ENTER. Перед вами появится кнопка в виде синего прямоугольника. При наведении на нее мыши она изменит свой цвет, а при нажатии кнопки еще и уменьшится (рис. 4.10).

Рис. 4.10. Различные состояния кнопки

4.3.2. Выбор области наведения

Просматривая результат этого эксперимента, можно заметить, что если навести указатель мыши на самый край кнопки, то ничего не происходит. Изменения начинаются, только когда указатель мыши приближается к середине кнопки. Это происходит потому, что у нас не определен кадр Hit (Область наведения). Его содержимое по умолчанию считается совпадающим с предыдущим кадром Down (Нажата), в котором кнопка изображена маленькой! Чтобы этого избежать, следует скопировать в кадр Hit (Область наведения) содержимое кадра Up (Свободна). Сделайте это и еще раз просмотрите ролик с помощью CTRL+ENTER. Убедитесь, что теперь кнопка "действует" по всей своей площади.

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

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

Если теперь нажать клавиши CTRL+ENTER, можно заметить, что указатель мыши превращается в "лапку" только непосредственно над контурами букв. А поскольку в тексте пустое пространство занимает больше места, чем контуры букв, "попасть" в такую кнопку окажется нелегко (особенно, если слово крупное). Да и вообще такая ситуация вызывает недоумение: "Я щелкаю, а оно не работает!" Однако ситуацию можно легко исправить, нарисовав в кадре Hit (Область наведения) прямоугольник, несколько превосходящий по размерам надпись. Тогда кнопка станет для пользователя вполне "нормальной".

Вообще говоря, область действия кнопки не обязана совпадать с ее изображением. Если, например, скопировать содержимое кадра Up (Свободна) в кадр Hit (Область наведения), а затем передвинуть его в кадре Hit (Область наведения) куда-нибудь в другое место, при просмотре ролика возникнет весьма интересный эффект: кнопка "срабатывает" при щелчке не на ней, а в каком-то совсем другом месте. Только не увлекайтесь этим эффектом: иногда он производит впечатление недоделки, как будто что-то работает неправильно. Ну, а какое действие можно запрограммировать как реакцию на нажатие кнопки? Очень часто это, например, остановка или пуск воспроизведения ролика, загрузка другого ролика или веб-странички и т.п. Вариантов здесь очень много. Многие из них мы рассмотрим при изучении языка сценариев ActionScript.

Обзор компьютерной мышки Defender Flash MB-600L

Бюджетная компьютерная мышь Defender Flash MB-600L обладает средним корпусом изготовленными из дешевого и неприятно пахнущего пластика, такой запах от пластика я раньше ощущал от дешевых китайских DVD-боксов. Внутри компьютерной мышки находится оптический сенсор обладающий максимальным разрешением 1200 DPI и способным работать в трёх режимах тремя режимами 800/1000/1200 DPI. А через многочисленные вырезы на корпусе манипулятора которые прикрыты полупрозрачным пластиком реализована невнятная подсветка.

Характеристики

• тип используемого сенсора — оптический
• максимальное разрешение сенсора — 1200 DPI
• возможность выбора разрешения сенсора — 800/1000/1200 DPI
• общее количество кнопок — 4
• покрытие корпуса — отсутствует
• подсветка — семицветная светодиодная
• способ подключения — кабель USB 2.0
• длина кабеля — 1.5±5% метра
• оплетка провода — отсутствует
• поддерживаемые ОС — Windows 2000/XP/Vista/7/8/10, Mac OS X10
• размеры манипулятора ШхДхВ — 60x100x35мм
• вес манипулятора — 70 грамм
• страна изготовления — Китай
• гарантийный срок — 6 месяцев (указано на сайте производителя)

Упаковка и комплектация

Компьютерная мышь Defender Flash MB-600L поставляется в компактной картонной упаковке которая выполнена с применением цветной полиграфии. Передняя сторона коробки несёт на себе изображение компьютерного манипулятора, а сбоку и снизу перечислены его основные особенности.

Задняя поверхность упаковки располагает особенностями и характеристиками о компьютерной мыши Defender Flash MB-600L, а также ниже указанные данные импортёра, производителя и наклеена наклейка с датой изготовления.

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

Комплект поставки:

• компьютерный манипулятор Defender Flash MB-600L
• руководство пользователя

Внешний вид

Компьютерная мышь Defender Flash MB-600L за свои небольшие деньги выглядит неплохо и даже оснащён светодиодной подсветкой. Подсветка у мышки слабая и неравномерная и понравится только большому любителю. Естественно на поверхности корпуса нет никакого soft touch покрытия и сделан он максимально бюджетно, даже боковые выемки у него полые. На задней части серебристой краской нанесен логотип и название бренда. Манипулятор изготовлен в симметричном дизайне поэтому хорошо подходит для правой и для левой руки.

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

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

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

Провод компьютерного манипулятора выходит из V-образной середины корпуса он тонкий и облачён в чёрную изоляцию.

Компьютерная мышь Defender Flash MB-600L весит 57 грамм.

Видео с демонстрацией работы подсветки компьютерной мыши Defender Flash MB-600L

Эксплуатация

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

Основные кнопки манипулятора нажимаются с небольшим усилием в конце нажатия слышится звонкий щелчок. Основные кнопки по уровню громкости нажимаются с той же громкостью, что и у манипулятора Logitech G102 Prodigy. Колесо прокрутки маленькое и бюджетное сделано оно из пластика и на поверхности имеет прямоугольные выступы при работе в обе стороны оно не шумно крутится с легким усилием. Колесо прокрутки нажимается с усилием и издаёт громкий щелчок. Кнопка смены уровня разрешения сенсора имеет небольшой ход, нажимается с усилием и издаёт громкий щелчок. После её нажатия нет индикации о выбранном разрешении сенсора.

Мне не понравилась работа оптического сенсора компьютерного манипулятора Defender Flash MB-600L ему нехватает стабильности и он не отзывчивый как хотелось бы и на долю секунды может залипать и потом двигаться куда вам надо, в общем с этим у данной мышки беда. Из-за нестабильной работы сенсора мышка не смогла пройти тест Precision. Частота опроса сенсора манипулятора Defender Flash MB-600L находится на уровне 125 Гц.

Выводы

Компьютерный манипулятор Defender Flash MB-600L оказался не очень приятным устройством, он изготовлен из неприятно пахнущего пластика и непонятно зачем оснащён невыразительной и бессмысленной подсветкой. Только это ещё ничего, если бы у мышки хорошо работал сенсор, но нет в моём манипуляторе он работает не очень хорошо и его может срывать или на миллисекунды он может задумываться. Лучше бы чем оснащать бюджетную мышь бесполезной подсветкой производитель поставил оптический сенсор получше, который будет адекватно работать. Также не очень приятно отсутствие тефлоновых ножек и использование имитации сделанной в поверхности корпуса, вообще неудачная затея мышка плохо скользит даже по гладкому компьютерному коврику.