Маркет Витрина

Урок третий. Для начала рисуем кружок, примерно 60Х60, заливаем его зелёным градиентом (если кто забыл: я рассказывал про это в первом уроке). В результате получаем подобное «чудо»

Далее F8 – button – OK. Теперь двойной клик по нему, это вы попали в окно редактирования объектов (если вы выделите какой либо один объект в вашей сцене для редактирования, то вся остальная затянется дымкой. Это значит, что она в данный момент не доступна для редактирования, чтобы вновь перейти к ней, нужно щелкнуть по ней дважды). Вернемся к нашему шару: вот что вы должны увидеть на таймлайне

Где :
1 – положение кнопки в нормальном состоянии;
2 – положение кнопки при наведении мышки;
3 – при нажатии на ней;
4 – при переходе по ссылки;
Вот вы все, что нужно для создания кнопки узнали, постарайтесь теперь сделать свою кнопку (задайте положение и цвета на своё усмотрение). У меня пример получился такой

Здесь пожалуй я думаю стоит сделать небольшое лирическое отступление и рассказать вам про Экшен скрипт (Action Scripts). Это язык управления сценариев(я сейчас подробно не буду ничего рассказывать, смотрите 5ое занятие, лишь в общих чертах расскажу, что это такое). С помощью него можно придавать различные свойства объектам, управлять воспроизведением клипа и тп. Давайте сделаем так, чтобы при нажатии на кнопку, происходило отправление по адресу (урл). Для того необходимо выделить нашу кнопочку в главной сцене, открыть панельку Actions (F8)

1 – иерархия видов и типов действий;
2 – панель кода;
3 – дополнительные параметры для выбранных участков кода;
Далее выбираем Actions – Movie control – Browser/network – далее двойной клик на GET URL и вот, что мы получаем

3 – ссылка (не забудь! «не» www.pupkin.com «a» http://www.pupkin.com!);
2 – окно;
1 – работаем с переменными;
Теперь давайте создадим кнопку с анимацией типа вот такой

Для начала создайте прямоугольник, залейте его каким либо теплым цветом, теперь создаем новый символ (control+F8). Вставляем в него наш прямоугольник, создаем анимацию типа Shape tween кадров на 10, в последнем фрейме прописываем в панели Аctions (f8) – movie control – stop. Теперь перейдем к окну редактирования нашей кнопки. Во втором фрейме вставляем пустой ключевой кадр(F7), открываем окно библиотеки (control+L) выбираем там наш клип с анимацией и перетаскиваем его во второй ключевой кадр, прямо из окна библиотеки. Примерно получиться то, что вы видели наверху.
Теперь давайте создадим кнопку со звуком. Для этого необходимо импортировать звук в библиотеку. Выбираем file – import to library – далее находите ваш звуковой файл, либо можно воспользоваться готовыми шаблонами (window – common librarias – sound). Теперь перейдем к редактированию на третий фрейм (положение «при нажатие») и выбираем наш звук в библиотеке и перетаскиваем его прямо из библиотеки в наш фрейм. Тут ты наверно догадался, что смотря в какой фрейм (в обычном состояние, при нажатие, при наведении) перетащишь звук, он по разному будет себя вести. Вообще коль речь зашла про звук, то более подробно эта тема будет затронута на следующем занятие. У меня пример получился такой

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

Готов спорить, что вы уде не раз видели подобное, на javascripts, сейчас сделаем это во Flash. Для начала рисуем прямоугольник любого понравившегося типа, что то вроде того на котором у меня написано «пример», а да он должен быть без обводки. Теперь превращаем его в объект типа movie clip – дайте название scene2, затем заходим в него и тот же самый прямоугольник превращаем теперь в объект «кнопка». Теперь перейдем в scene2 и переименуем слой с нашим прямоугольником – кнопкой в static и делаем его видимым до кадра 21 (F5 на кадре 21). Теперь создаем еще 7 слоев с названиями: 1 static text – actions – actmenu1 – actmenu2 – actmenu3 – cover. В слое static text создаем текстовую надпись которая будет красоваться там, где у меня написано «пример». В слое actmenu1 ставим ключевой кадр на фрейме 6, рисуем там прямоугольник, который у меня в примере с текстом «пункт 1», превращаем его в кнопку и делаем анимацию до 11го фрейма, далее то же самое проделываем со слоями actmenu2 – actmenu3

Наша задача в том, чтобы перевести в слое actmenu1 кнопку из состояния 1 в состояние 2, в слое actmenu2 из состояния 2 в состояние 3, ну и в слое actmenu3 кнопку нужно перевести из состояния 3 в 4, притом в начале анимации всем менюшкам нужно задать alpha=0% а к концу alpha=100%

Что касается Анимации вроде всё, теперь поговорим про программирование всего этого хозяйства, для начала в слое action вставьте ключевой первый фрейм, выделите его и пропишите actions – movie control – stop, теперь вставьте ключевой кадр на отметке 6 и 21, кроме того в 21ом кадре снова пропишите stop(), теперь перейдите к первому кадру scene2 выделяем наш прямоугольник и в панели actions прописываем следующее (предварительно необходимо переключиться в экспертный режим)
on (release, rollOver){
gotoAndPlay("6");
}
ну все теперь последний штрих, нам нужно под всю нашу сцену подстелить какую ни будь закарюку, все зависит от формы вашего меню, у меня например это выглядит так

этому «ковру» нужно задать цвет фона, чтобы его не было видно, и превратить его в объект типа кнопка, а затем разместить его под меню (!не как у меня на рисунке!, а !под! меню). Зачем мне понадобился ковер? А если ваш юзверь ткнет своей мышкой не именно на пункты нашего меню, а между ними? Оно просто свернётся, попробуйте сами без ковра.