Опубликован: 27.03.2013 | Доступ: свободный | Студентов: 1495 / 255 | Длительность: 08:07:00
Специальности: Программист
Лекция 11:

Символы. Кнопки

< Лекция 10 || Лекция 11 || Лекция 12 >
Аннотация: В лекции рассматривается ключевое понятие символа во Flash, его виды, способы создания и редактирования.
Ключевые слова: flash, поле, объект, меню, алгоритм, ПО

Символы. Кнопки

Материалы к лекции Вы можете скачать здесь.

Символ – ключевое понятие редактора Flash.

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

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

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

Символы существуют трех видов:

  • фрагмент ролика - анимированная графика (при создании анимации мы уже работали с символами)
  • кнопка
  • графика - любые рисунки или импортированная статичная графика

Есть три способа создания символов:

Первый заключается в преобразовании нарисованного объекта в символ:

  • Выделите объект инструментом "Стрелка".
  • Преобразуйте объект в символ ("Модификация" - "Преобразовать в символ").
  • Появиться окно, в котором необходимо указать имя символа и его тип.

После преобразования символ всегда доступен через библиотеку ("Окно" - "Библиотека"). Для вставки символа из библиотеки, просто перетащите его из окна библиотеки в рабочую область (так создаются "экземпляры" символа - его копии).

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

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

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

Символ "Кнопка".

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

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

Алгоритм создания и редактирования кнопки рассмотрим на практике.

Практическая работа "Создание кнопки"

  1. Нарисуем кнопку (например, овальную).
  2. Выделим все, что будет входить в изображение кнопки.
  3. Режим меню "Модификация" - "Преобразовать в символ". Выберем тип символа "Кнопка", даем ей имя.
    Создание кнопки

    Рис. 10.1. Создание кнопки
  4. Изображение кнопки заключается в синюю рамку. Теперь символ находится в библиотеке (можно посмотреть: "Окно" - "Библиотека").
  5. Создаем анимацию кнопки: два раза кликнем по изображению кнопки. Этим мы входим в режим редактирования кнопки. На временной шкале появится 4 кадра:

    -Up – на кадре находится изображение кнопки,

    -Over – на кадре находится то изображение, которое будет у кнопки при наведении на нее мыши,

    -Down – это изображение будет у кнопки, при нажатии по ней мыши,

    -Hit – экранная область, которая считается зоной кнопки, может не совпадать с графическими объектами на первых трех кадрах.

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

    Рис. 10.2. Создание анимации кнопки

  6. Нужно проделать поочередно с каждым кадром следующие действия:

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

    Создание ключевых кадров кнопки

    Рис. 10.3. Создание ключевых кадров кнопки

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

  7. Чтобы выйти из режима редактирования кнопки кликните на пиктограмме "Монтажный кадр 1" в левом углу (под временной шкалой), либо – двойной клик за пределами изображения кнопки.
  8. Проверяем работу кнопки ("Управление" - "Тестирование видеофрагмента").

Краткие итоги лекции:

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

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

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

Символы существуют трех видов:

  • фрагмент ролика - анимированная графика (по сути дела - самостоятельные фильмы)
  • кнопка
  • графика - любые рисунки или импортированная статичная графика

Ключевые термины

  • Символ
  • Экземпляр символа
  • Библиотека символов
  • Фрагмент ролика
  • Кнопка

Набор для практики:

Вопросы

  • Перечислите способы создания символа
  • Где хранятся все созданные символы, если на монтажном столе они удалены?
  • Охарактеризуйте понятия "Символ" и "Экземпляр символа"
  • Что произойдет при изменении графического изображения, составляющего экземпляр символа?
  • Назначение и характеристики символа-кнопки, символа-фрагмента ролика, графики?
  • Что предусматривает процесс создания кнопки? Из каких ключевых кадров состоит временная шкала символа-кнопки?
  • Что произойдет, если будет отсутствовать изображение на первом кадре временной шкалы кнопки?
  • Что произойдет, если изображения на первом и последнем кадрах временной шкалы кнопки не будут совпадать (и по размеру и по положению на монтажном столе)?

Упражнения

Практическая работа "Кнопка-подсказка"

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

    Подсказка:

  3. Каждый объект преобразуется в кнопку.
  4. Кадр "Over" кнопки делается ключевым. Рядом с изображением геометрической фигуры (овала в данном примере) помещается текст "Овал"
    Настройка анимации кнопки

    Рис. 10.4. Настройка анимации кнопки
  5. Аналогично настраивается ключевой кадр "Над" для других геометрических фигур, которые также в начале преобразуются в кнопки.

Практическая работа:

Создайте кнопку такого вида:

Настройка анимации кнопки

Рис. 10.5. Настройка анимации кнопки

Практическая работа "Говорящий светофор"

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

Кнопки-плафоны светофора

Рис. 10.6. Кнопки-плафоны светофора

Практическая работа "Говорящая карта"

Нарисуйте географическую карту мира. Преобразуйте каждый материк карты в кнопку. По наведению кнопки на материк высвечивается название материка.

Кнопки-материки

Рис. 10.7. Кнопки-материки

Практическая работа "Говорящая схема"

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

< Лекция 10 || Лекция 11 || Лекция 12 >
Яна Борисова
Яна Борисова

В тестах есть вопросы, детали которых в тестах не рассматриваются. Ест ли возможность рассмотреть материал в лекциях более подробно и в деталях?

Александра Замбровская
Александра Замбровская

Я прохожу бесплатное (самостоятельное) изучение курса Создание интерактивных приложений в Adobe Flash Могу ли я (имея высшее образование) заказать официальное удостоверение по программе повышения квалификации? Сколько это будет стоить и где можно заказать (если можно, то ссылку на страничку)?

Алексей Зелепугин
Алексей Зелепугин
Россия
Артём Нагорных
Артём Нагорных
Латвия