Jak stworzyć menu we flashu?
I merely much like the very helpful facts you provide to the articles. I most certainly will bookmark your blog…
Na przykładzie strony GDAQ.PL pokażę krok po kroku jak stworzyć menu we flashu. Będzie to menu pionowe umieszczone w headzie strony.
Do stworzenia takiego menu potrzeba podstawowej wiedzy na temat Flasha.
1. Tworzymy nowy dokument o rozmiarach 214x200px
2. Tworzymy napis jaki ma się znaleźć na buttonie i klikając prawym przyciskiem myszki przekształcamy go w symbol graficzny, aby móc wykonywać na nim efekty. Następnie tę grafikę przekształcamy w MovieClip w celu umieszczenia w nim animacji. Proponuję nazywać symbole w odpowiedni sposób, aby móc się połapać później w tym co mamy w bibliotece np.: G_onas (co oznacza symbol graficzny “o nas”).
3. Klikamy w nasz MoviClip 2 razy w celu wejścia w niego. Na scenie aktualnie mamy tylko nasz napisz “o nas” i tak samo nazwijmy warstwę (layer) na, której się on znajduje naciskając na nią 2 razy. Po lewej stronie napisu narysowałem strzałkę, którą przekształciłem w symbol graficzny i umieściłem na oddzielnej warstwie.
4. Pod tym przyciskiem będą znajdowały się także inne dlatego na dole przycisku umieszczę kreskę, która będzie oddzielała je od siebie. Kreskę zamieniam w symbol graficzny. Na nowej warstwie “tło” umieszczam pomarańczowy prostokąt o wymiarach width=158.0 height=0.2 idący od środka strzałki wzdłuż napisu (także zamieniamy w symbol).
5. Teraz zajmiemy się animacją. Rozciągamy każdą z warstw do 15 klatki. Przechodzimy do klatki nr. 15 i na każdej warstwie w tej klatce klikamy F6 w celu stworzenia nowej klatki kluczowej. Następnie w 15 klatce na każdej warstwie zmieniamy wygląd symbolu dzięki tej operacji będziemy mieli inaczej wyglądający symbol w klatce 1 i inaczej w klatce 15.
a) nasz cienki prostokąt rozciągamy na wysokość height=33.6,
b) klikamy na napis i na dole w “properties” w “color” zaznaczamy “tint” i ustawiamy 100% koloru białego,
c) tak samo robimy ze strzałką
6. Zaznaczamy pierwszą klatkę i w “properties” > “tween” klikamy “Motion” (animacja symboli). W ten sposób uzyskujemy animację. Po kliknięciu Enter możemy ją zobaczyć. Aby animacja była szybsza i bardziej efektowna należy zmienić ilość klatek w filmie, ja ustawiłem na 46. Tak jak na poniższym screenie powinien wyglądać teraz twój ekran.
7. Dla ozdoby napis podczas animacji cofa się. W połowie 15 klatek należy przycisnąć przycisk F6 zaznaczyć napis i strzałką przesunąć go. Aby animacja nie zapętlała się cały czas, w klatce numer 1 i numer 20 ustawiłem akcję stop filmu. Należy rozwinąć paletę “actions” i wpisać “stop();”.
8. Następnie, aby na końcu filmu nie pozostały puste klatki na każdej warstwie w klatce nr.20 klikamy F5. Aby nadać smaku przyciskowi dodałem do niego przelatujące przez niego linie i błysk.
W tym celu stworzyłem biały prostokąt o wymiarach 158×4,8 następnie umieściłem go na środku wzdłuż przycisku w klatce nr.15 (zamieniamy na symbol graficzny). W klatce nr.20 przyciskiem F6 stworzyłem nową klatkę kluczową i umieściłem w niej ten sam prostokąt tylko powyżej przycisku w “properties” w “color” zaznaczamy “tint” i ustawiamy 0% koloru białego. Dzięki temu po ustawieniu w klatce 15 “properties” > “tween” > “Motion” tworzy się animacja przelatującego prostokąta znikającego na końcu. W celu lepszego efektu dodałem jeszcze jedną dość cienką linię na tej samej zasadzie co opisałem powyżej.
9. Posiadamy już pełną animację, która ma być odgrywana podczas najechania na przycisk, teraz zajmiemy się animacj, która ma być odtwarzana podczas zjazdu z przycisku. Jest to ta sama animacja tylko stworzona od drugiej strony. Zatem musimy zrobić odbicie lustrzane wszystkich klatek, które stworzyliśmy do tej pory. Każda pojedyncza animacja ma być odwrócona (najlepiej i najszybciej jest kopiować istniejące już klatki w odpowiednie miejsca). Na ostatniej klatce w warstwie action nie ustawiamy żadnej akcji. Patrz obrazek poniżej. Wracamy na scenę główną klikając na przycisk “Scene 1”.
10. Do działania naszego przycisku potrzebujemy nałożyć na nasz MovieClip button. Tworzymy prostokąt o rozmiarach 158×34 następnie zamieniamy go na symbol “Button” i klikamy w niego 2 krotnie. Aby przez button było widać naszą animację robimy go przezroczystego poprzez przesunięcie prostokąta tylko do pola “HIT” klikamy tam F6 i usuwamy prostokąt z pozostałych pól. Po powrocie na scene ujrzymy prześwitujący o kolorze morskim button.
11. Do powyższego przycisku przypisujemy akcje w panelu “Action”. W naszym MovieClipie ustawiliśmy w pierwszej klatce “stop”, aby przycisk od razu po wyświetleniu nie uruchamiał animacji. Akcja w przycisku informuje iż po najechaniu na niego ma odtwarzać animację od klatki nr.2 na klatce 20 animacja się zatrzymuje gdyż tam ustawiliśmy “stop” dalej w przycisku jest zapisana informacja, iż po zjechaniu z niego ma się odtwarzać nasz MC od klatki nr. 21. Na końcu podany jest link do przycisku.
“button_onas” – oznacza nasz przycisk, tę nazwę należy przypisać w “Instance name” naszego MC (nie przycisku a MC).
Akcja przycisku:
on (rollOver){
_root.button_onas.gotoAndPlay(2);
}
on (rollOut){
_root.button_onas.gotoAndPlay(21);
}
on (release) {
getURL(“http://www.gdaq.pl/?page=onas”);
}
12. Nasz przycisk jest już GOTOW. W celu stworzenia innych przycisków, wybieramy w bibliotece nasz MovieClip prawym przyciskiem klikamy “Duplicate” i zmieniamy nazwę na MC_
oferta. W przycisku dalej widnieje nazwa “O nas”, aby to zmienić należy kliknąć 2 razy na nowy Movie Clip i zamiast symbolu graficznego “G_onas” wstawić nowy z “G_oferta” z napisem “Oferta”. W ten sposób należy postępować z każdym przyciskiem.
13. Ja w swoim menu zrobiłem 5 przycisków dodałem logo oraz cień do menu. Poniżej przedstawiam efekt mojej pracy. Życzę powodzeni, a w razie wątpliwości czekam na komentarze z pytaniami lub e-maile.
Jak stworzyć menu we flashu?,o autorze
Od 2009 prowadzi owego seo bloga i dzieli się swoją wiedzą z zakresu seo.
Autor publikacji/produktów z zakresu seo m.in.: znanych list katalogów i profili, ebooków, szkoleń, artykułów w miesięczniku SEMspecialist.
Gościnnie trener w Mieście Szkoleń oraz na Search Marketing Week.
Witam. Ostatni krok jest dla mnie najtrudniejszy. Nie moge zrobic kolejnych przyciskow wg. metody, jaka opisales. Albo jestem ciemny, albo czegos nie wiem. Jak zduplikuje mc i zmienie nazwe to w poprzednim mc nazwa takze sie zmienia. Nie rozumiem. Mysle, ze punkt 12 nalezy rozwinac, bo nie mozna zrozumiec. Pozdrawiam
Witam. Ja mam problem z przypisaniem “??Instance name”. Nie wiem, gdzie i jak…
Zrobił?e?m całą? grafikę?, ale nic nie dział?a, chyba dlatego, że nie wpisał?em “??Instance name”
Bardzo proszę? o odpowiedź
Z góry dzięki.
Pozdrawiam
Witam!
Ja też mam problem, ale z umieszczeniem “Instance name”. Nie wiem jak i gdzie? Zrobiłem całą grafikę i button mi nie działa – pojawiają sie błędy to chyba z powodu nie wpisanego “Instance name”.
Bardzo proszę o odpowiedź.
Pozdrawiam
Tutaj jest screen http://www.gdaq.pl/blog/moje/webdesign/menu_flash/11.jpg w ktorym jest zaznaczone pole “instance name”.
Pozdrawiam
Gdaq
ja tam mam nastepujacy problem jestem poczatkujacym w flashu i chcialbym wiedziec jak rozszerzyles ten pasek bo mi jakos sie to nei udaje a jak usuwam go z klatki 15 i tworze nowy to nic mi sie tam nie zmienia T_T pomocy
oki doszedlem do rozszerzenia ale teraz nastepny problem jak daje “montion” to pasek nie zmienais ie wogule nie powieksza i tak trwa do 14 klatki a na 15 wskakuje juz powiekszony
oki wszystko zrobione psza jednym moj niby prstokat nie ejst nim dokonca ma zaokraglone konce i ty moje pytanie jak sie ich pozbyc??
KUWA MAć STARY TO NIE DZIAłA!!! MOZESZ POWIEDZIEć O CO CHODZI?
**Error** Scene=Scene 1, layer=Layer 1, frame=1:Line 9: This type of quotation mark is not allowed in ActionScript. Please change it to a standard (straight) double quote.
getURL(“?http://www.gdaq.pl/?page=onas“);
**Error** Scene=Scene 1, layer=Layer 1, frame=1:Line 10: ?)? or ?,? expected
}
**Error** Scene=Scene 1, layer=Layer 1, frame=1:Line 8: Statement block must be terminated by ?}?
on (release) {
**Error** Scene=Scene 1, layer=Layer 1, frame=1:Line 10: Syntax error.
}
Total ActionScript Errors: 4 Reported Errors: 4
strasznie mi sie to podoba ale wylatuje ten błąd HELP
może ten skrypt jest lewy? HELPP
dobra mam ten skrypt jest lewy ;/
Witam mam problem z 11pkt. mianowicie nie moge w tym buttonie dodac akcji… pisze ze niemozna.
Dlaczego nie możesz? Jaki jest z nim problem? Klikasz na niego, na dole w panelu wybierasz actions i piszesz.
witam
czy mozna poprosic o plik zródłowy bede wdzieczny.Chciałbym go przeanalizować.
Poszukam tego pliku aczkolwiek było to robione ponad 2 lata temu więc będzie ciężko 🙂 Jeśli masz jakieś pytanie pisz na blogu lub na email blog@gdaq.pl
skrypt działa …jedyny błąd to …getURL(?http://www.gdaq.pl/?page=onas?);
} ….a ma być getURL(‘http://www.gdaq.pl/?page=onas’);
[…] tysiącami wiadomości znalazłem kilka Waszych komentarzy. Jeden z moich artykułów pt.: “Jak stworzyć menu we flashu?” cieszył się dość dużym zainteresowaniem z Waszej […]
O co chodzi w tej stronie http://strasznyfilm5.wordpress.com/ ???
I merely much like the very helpful facts you provide to the articles. I most certainly will bookmark your blog post as well as analyze all over again the following usually. We’re slightly i will probably be shared with a lot of new material right here! All the best for!