Movieclip

Привет.

Что это за зверь - Movieclip?
Movieclip - это оболочка для графики. Movieclip - самый часто используемый тип символа. Почему не Graphics или Button? Потому что из Movieclip можно сделать и то, и другое.

Хорошо. Что я могу с ним сделать?
Так как Flash изначально разрабатывался для создания видео-роликов, то все символы имеют кадры, расположенные на временной шкале. Соответственно, мы можем создавать анимацию. За счет того, что Adobe предоставила нам ActionScript 3.0, можно манипулировать символами ( перемещать, масштабировать, переключать кадры и т.д. ).

Отлично! Только я ничего не понял. Покажи пример!
Пожалуйста.

Уау! Кнопка! Как ты это сделал, демон?!

Для начала, нарисуем кнопку.

Выделим наш рисунок.

Жмем F8. Заполняем поля, жмем OK.

Каким будет Registration по-сути не важно.

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

Переводим взгляд вправо. Там должна быть панель Properties, если нет - жмем Window -> Properties. В поле <Instance name> наберем theButton. Да-да, опять пишем то же самое.

О нет! Что я сделал? Зачем это все?
То, что мы сейчас сделали означает, что именно у этой кнопки будет имя theButton. Это дает нам возможность управлять кнопкой из кода.
Можно, кончено обойтись и без этого, но так легче.

Эй! Мы же делаем кнопку, а при создании символа можно было вместо Movieclip выбрать Button!
Мы же не ищем легких путей, верно? :)

Итак, у нас есть кнопка. Не спешите запускать. Нужно еще нарисовать состояния кнопки.

ЧТО?
Состояния кнопки: нажата, отпущена, мышь над кнопкой, мышь за пределами кнопки.

Кликаем 2 раза по кнопке. Теперь ее можно редактировать. Но нас интересует не это, а временная шкала:

Если ее не видно - Windows -> Timeline.

Выделяем следующие 3 кадра, жмем по ним правой кнопкой -> Convert to Keyframes. Теперь у нас есть целых 4 кадра! Но они все одинаковые, надо это исправить.

• 1-ый кадр - обычное состояние кнопки
• 2-ой - мышь над кнопкой
• 3-ий - кнопка нажата
• 4-ый - кнопка отпущена

Можно просто изменить размер, неважно. Главное, чтобы была видна разница.

Ну, теперь все?
Если бы мы выбрали Button, а не Movieclip, то этого было бы достаточно. Сейчас пишем код.

Подключаем Main.as как главный класс.

Main.as:

package
{
    import flash.events.MouseEvent;
    import flash.display.MovieClip;
    
    public class Main extends MovieClip
    {
        public function Main () : void
        {
            // Эти 2 строки нужны, чтобы над кнопкой появлялся курсор в виде руки
            theButton.useHandCursor = true;
            theButton.buttonMode = true;
            // Ставим кнопку в обычное состояние
            this.mouseOutHandler();
            // Подписываемся на события
            theButton.addEventListener( MouseEvent.MOUSE_OVER, mouseOverHandler );
            theButton.addEventListener( MouseEvent.MOUSE_DOWN, mouseDownHandler );
            theButton.addEventListener( MouseEvent.MOUSE_OUT, mouseOutHandler );
            theButton.addEventListener( MouseEvent.MOUSE_UP, mouseUpHandler );
        }
        
        private function mouseOutHandler ( e : MouseEvent = null ) : void
        {
            theButton.gotoAndStop( 1 );
        }
        private function mouseOverHandler ( e : MouseEvent = null ) : void
        {
            theButton.gotoAndStop( 2 );
        }
        private function mouseDownHandler ( e : MouseEvent = null ) : void
        {
            theButton.gotoAndStop( 3 );
        }
        private function mouseUpHandler ( e : MouseEvent = null ) : void
        {
            theButton.gotoAndStop( 4 );
        }
    }
}

Запускаем... Должно работать. :)

Код, который я привел выше не имеет Объектно-ориентированного подхода. Поэтому, следующий урок будет про классы.

Исходник.

Удачи!