Macromedia Flash MX

Az előző fejezetben létrehoztunk néhány objektumot, és animáltuk őket. Ehhez szimbólumokat használtunk. Emlékezzünk rá, hogy amikor létrehozunk egy szimbólumot, akkor a három típusból lehet választani.

Az a fajta szimbólum, amit az előző fejezetben létrehoztunk a legalapvetőbb típusú: a grafikai szimbólum. A második típus a Button (gomb) típus (és a harmadik a Movie Clip típus, amivel a következő részben foglalkozunk). A gomb szimbólum tölti meg interaktivitással a Flash animációnkat. Reagál arra, ha fölé kerül az egér, vagy ha rákattintunk. Mi határozhatjuk meg, hogy ilyenkor mit történjen. Azt már megtanultuk, hogyan lehet egy egyszerű Flash mozit elkészíteni. Egy alap gomb elkészítése olyan, mintha egy négykockás mozit csinálnánk.

Az eddig elkészített mozinkkal dolgozzunk tovább! Mentsük el új néven, aztán vágjunk bele a gombgyártásba! Első lépésként lére kell hoznunk egy gombszimbólumot. Az előző fejezetben úgy készítettünk szimbólumot, hogy létrehoztunk egy ábrát a Stage-en, és ezt definiáltuk szimbólumként. Most a Symbol Editor-t (szimbólum szerkesztőt) használjuk.

Nyissuk meg a Library panelt és kattintsunk a jobb felső sarkában lévő Options menü gombra. A menüből válasszuk a New Symbol (új szimbólum) pontot!

Az új szimbólumot nevezzük el egyszerűen például Gomb-nak, és a Behavior (viselkedés) rádiógombok közül a Button-t (gombot) kapcsoljuk be. Az OK gomb megnyomása után már szerkeszthetjük is a szimbólumunkat. Mialatt a szimbólummal dolgozunk, a mozi rejtve marad.

Aktiváljuk a View / Grid / Show grid (rács megjelenítése) menüpontot, ez segít az elemek elhelyezésénél. Válasszuk a Text Tool-t (szöveg eszközt). Most a Properties panelen a szövegszerkesztő programokból ismerős dolgokat látunk. Állítsunk be egy szimpatikus betűtípust, kb. 18 pontos betűméretet és készítsük el a gomb feliratát a Stage közepére. A szöveg rétegét nevezzük el Felirat-nak.

Hozzunk létre egy új réteget, és nevezzük el Téglalap-nak. Válasszuk a Rectangle (négyszög) eszközt, a vonalvastagságot állítsuk két pontra, a vonal színét sötét szürkére, a kitöltést mondjuk narancssárgára. Rajzoljunk egy téglalapot az új rétegre, a szöveg köré. Most nem látjuk a szöveget, mert a téglalap felette van. Kattintsunk a Téglalap rétegre a Timeline-on, és vonszoljuk a felirat alá. gy már jó lesz a sorrend.

Láthatjuk, hogy a Gomb szimbólum Timeline-ja négy képkockából áll, és mindegyiknek külön neve van: Up (fent) Over (fölé) Down (lent) és Hit (célzás). A képkockák a gomb egyes állapotainak felelnek meg. Az állapotok mindegyikéhez különböző felhasználói műveletek rendelhetők. Az előbbi ábránkat az Up állapothoz rajzoltuk, ami azt jelenti, hogy így fog kinézni a gomb, amikor csak úgy magában áll. Az Over állapot mutatja, hogy fog kinézni a gomb, ha a felhasználó fölé viszi az egérkurzort. Amikor rá is kattint, akkor látszik a Down állapot. A Hit adja meg a gomb érzékeny területét (hot area) - az HTML image map-hez hasonlóan, ez jelzi azt a területet, ahol az egérnek kell lennie ahhoz, hogy működtetni tudjuk a gombot.

Az Over állapot létrehozásához egyszerűen illesszünk be egy kulcskockát mindkét rétegre az Over képkockához. Jelöljük ki a fekete nyíllal a feliratot, és változtassuk meg a színét, mondjuk halvány sárgára. Ugyanígy változtassuk a téglalap színét, például cölinkékre.

Illesszünk be egy kulcskockát a Down képkockához. A nyíl eszközt használva kerítsük körbe a gombobjektumunkat, és mozdítsuk el lefelé és jobbra egy picurkát. Ez azt az illúziót kelti, mintha a gomb benyomódott volna, mikor rákattint a felhasználó. Ha létrehozunk egy új réteget, árnyékot is adhatunk a gombunknak, amivel a benyomódás érzetét fokozhatjuk.

Annak meghatározásához, hogy melyik terület legyen érzékeny (és melyik ne), létre kell hoznunk egy tömör objektumot a Hit képkockában. Először szúrjunk be egy Blank Keyframe-et (üres kulcskockát) a Hit képkockához. Aztán menjünk az Up kockához, és másoljuk ki innen a téglalapot. Menjünk vissza a hit kockához, és az Edit / Paste in Place menüponttal illesszük be a téglalapot. Ez a funkció a téglalapot ugyanabba a pozícióba helyezi, ahol az Up képkockában volt.

Hát ezzel meg is volnánk. Már csak az van hátra, hogy elhelyezzük a gombot az animációnkba! A mozi szerkesztéséhez úgy térhetünk vissza, hogy a Stage felett a csapó ikonra kattintunk, vagy az Edit / Edit Document menüpontot használjuk.

Az általam elkészített gombot a 06-lesson-1.fla fájl tartalmazza. A gombkészítés műveleteit megnézheti a bemutatóban.