Прехвърляне към съдържание


Снимка
- - - - -

Active flash icon


  • Please log in to reply
No replies to this topic

#1 graf_kaberne

graf_kaberne

    Нов

  • Потребители
  • 34 Мнения:
  • Точки:0
  • Новини:0
  • Уроци:0

Публикувано: 18 May 2009, 12:32

В този урок ще видите как да създадете активна флаш икона.


Стъпка 1

Отворете нов Flash документ. Изберете Modify > Document (Ctrl+J ).Настройте ширината на 200px височината 150px Frame rate 32fps.

Стъпка 2

Използвайте инструмента за рисуване или импортирайте някаква икона.Виж по-долу:

Публикувано изображение

Стъпка 3

Вземете Текст Tool (T), и над иконата напишете "flash icon" или нещо друго.

Публикувано изображение

Стъпка 4

Маркирайте иконата и текста (Ctrl+A), натиснете F8 или Modify > Convert to Symbol за да конвертирате иконата и текста в movie clip symbol.

Публикувано изображение

Стъпка 5

Можете да използвате flash filters, за да придадете малко Drop Shadow към иконата или каквото прецените.

Публикувано изображение

Стъпка 6

Кликнете веднъж върху иконата с инструмента Selection Tool (V), отворете Properties panel и на Instance name напишете icon.

Публикувано изображение

Стъпка 7

Щракнете върху иконата два пъти с инструмента Selection tool (V), или клик с десния бутон на мишока върху иконата и от падащото меню изберете Edit in Place.

Публикувано изображение

Сега би трябвало да сте в рамките на movie clip.

Публикувано изображение

Стъпка 8

Сега маркирайте само текста ("flash icon"), натиснете Ctrl + X (Cut), направете нов слой (layer2), и натиснете Ctrl+Shift+V (Paste in Place) и го заключете. Върнете се на layer1 натиснете F8 (Convert to Symbol) и конвертирайте иконата (без текста) в Movie Clip.

Публикувано изображение

Стъпка 9

Клик на кадър 10 и натиснете F6. След това с помощта на мишока или чрез стрелките на клавиатурата, преместете "иконата" малко нагоре.

Стъпка 10

Докато иконата е маркирана отидете на (Property inspector). В горния десен ъгъл ще видите менюто за цветове. Изберете Tint и цвят който желаете със стойност 43%.

Публикувано изображение

Стъпка 11

Щракнете с десния бутон на мишката между кадър 1и10 от менюто изберете Create Motion Tween.

Публикувано изображение

Стъпка 12

Заключете layer1 и отключете layer 2, кликнете на кадър 10 натиснете F6 вземете инструмента Selection Tool (V), и преместете текста под иконата.Виж по-долу:

Публикувано изображение

Стъпка 13

Щракнете с десния бутон на мишката между кадър 1и10 от менюто изберете Create Motion Tween.

Публикувано изображение

Стъпка 14

Кликнете кадър 10 отворете Action Script Panel (F9), и напишете следното:

stop();

Стъпка 15

Вземете Selection Tool (V), и преместете слоя layer 2 под слоя layer 1.

Стъпка 16

Върнете се на главната сцена (Scene1), направете нов слой с име Invisible Button и създаде Невидим бутон върху иконата.Виж по-долу:

Публикувано изображение

Публикувано изображение

Стъпка 17

Маркирайте бутона отворете Action Script Panel (F9), и поставете този скрипт:

on (rollOver) {
_root.mouse_over_icon = true;
}

on (rollOut) {
_root.mouse_over_icon = fstartlse;
}

on (release){
getURL("http://www.photoshop-bg.com/", "blank");

}

Стъпка 18

Създайте нов слой с име AS. Щракнете на кадър 1 отворете Action Script Panel (F9) и поставете този scritp:

_root.icon.onEnterFrame = function() {
if (mouse_over_icon) {
_root.icon.nextFrame();
} else {
_root.icon.prevFrame();
}
};

Това е всичко!

Приятен ден!:)

източник

превод: graf_kaberne

резултат

fla file




0 потребители четат тази тема

0 регистрирани потребители, 0 гости и 0 анонимни потребители