Как создать анимированные кнопки с использованием Flash

Share

|

Время: 15 минут.
Уровень сложности: средний
Требования: Flash 8
Расчетный Знания: Основные actionscripting, используя действия окна, с помощью переменных, создания символов.

Цель:
Я всегда стремился к живой кнопку с ActionScript и оставлять мой график, но ясно было рода трудно, пока я не споткнулся на этом Tweening двигателя от продлить. Этот учебник использует в Tweening двигателя стимулировать кнопки. Это действительно прекрасный инструмент, и я скажу, что, поскольку с ней взял меня весьма мало времени сделать анимацию.

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

Прежде чем начать:

Загрузите исходные файлы: Animated_Button.fla и TweeningEngine.mxp.

Использование Tweening Двигатель:

Для начала установите "TweeningEngine.mxp" расширение (Вам надо просто дважды щелкнуть на нем, и он приведет вас к продлению Manager). Вам придется открыть / возобновить Flash.

Создайте новый документ. Установить кадров на 35.
Сделать фильм клип, содержащий прямоугольник с закругленными углами, другой меньше в высоту и с светлее цвет поверх первой и альфа набор на 50, затем добавить текст на кнопку.
Имя им, а также название случаях. (я backofbutton, frontofbutton их соответствующих случаях: BoB и FoB).
Сделайте еще один фильм клип для всех упомянутых выше фильмов и клипов текст. Имя его MyButton инстанции имя: MyB.

Отныне будет лишь немного кодирования предстоит сделать, но вы не должны беспокоиться, это конец в виде штрафа анимации после ровно 6 линий.

Первые два используются для импорта tweening классов и срочный переход / ослабления сорта, и они должны быть включены в окне Действия для первого кадра в "MyButton" кино клип.

импорт xtd.tweening *.;
импорт mx.transitions.easing *.;
импорт flash.filters.DropShadowFilter;

Мы привыкли к той части, когда мы должны стимулировать кнопку. Код ниже собирается шкале FoB как сокращаться оно, в textColoring будет менять цвет в тексте и BackShadow сделает кнопку падения тени.

var StripShrink = новый Твеен (FoB ", _yscale", Bounce.easeOut, 95, 0, 10, ложных);
var textColoring = новый ColorTween (TextLine, Strong.easeOut ", нынешний", "663300", 8, ложных);
var BackShadow = новый FilterTween (BoB новые DropShadowFilter (1, 90, 0x000000, .5, 5, 5, 1, 3), "расстояние", Strong.easeOut ", нынешний", 10,20, ложных);

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

  Как мы уже выбрали "ложных" для "autostart" собственности, tweens начнется, когда имеющие наведите курсор: this.onRollOver = функция () (StripShrink.start (); BackShadow.start (); TextColoring.start (); ); 

  this.onRollOut = функция () (StripShrink.reverse (Regular.easeIn); BackShadow.reverse (Regular.easeOut); textColoring.reverse (Regular.easeOut);) ; 

Когда мышь не по нашей кнопке tweens будет изменен с различными ослабление функций.

Закрытие

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

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