Rejestracja | Zaloguj




Poprzedni temat «» Następny temat
[Medium] Zaawansowane menu
Autor Wiadomość

Pomar1 





Program: MS Paint, GIMP, Flash
Posty: 15
Dołączył: 25 Sie 2008
Wiek: 16
Skąd: Zabrze

GFXPoints: 28
Piwa: 2/1
Wysłany: 2008-08-26, 08:07 [Medium] Zaawansowane menu


Teraz coś z wyższej półki. Pobawimy się trochę w Action Script i zrobimy ładne menu na np. stronę internetową.

Umiejętności Potrzebne:
→ Znajomość budowy Action Script

1. Najpierw zróbcie w PS'sie, GIMP'ie czy w czym tam chcecie, takie oto grafiki:

550 x 35 px - Tło menu
103 x 34 px - Buttony (ja zrobiłem 4)
16 x 8 px - Strzałeczka (Skierowana w górę!)

Jeżeli już to macie, to włączamy Flash'a i tworzymy nowy plik o wymiarach 550 x 35 px.

2. Teraz tworzymy 3 Layery. O nazwach:
"Background" "Tabela" i "Action"

3. W "Background" umieszczamy nasze tło menu i blokujemy ten Layer.

4. W "Tabela" wklejamy 4 razy nasz button oraz na tych buttonach piszemy teksty, np: Home, Gallery, Conact i GrafArt.

http://img144.imageshack....=guide01rg6.jpg

Zaznacz teraz teksty i przesuń je na dół (na tło menu) używając skrótu SHIFT + STRZAŁKA W DÓŁ.

Powinno to wyglądac tak:

http://img515.imageshack....=guide02vp9.jpg

5. Zaznaczamy teraz pierwszy z buttonów i uzywając F8 tworzymy z niego Movie Clip o nazwie "Button".

Otwórz Button i utwórz tam 15 klatek kluczowych (Keyframe).

W 1, 5, 10 i 15 w panelu Actions wpisz:
Aby móc zobaczyć zawartość umieszczoną w tagu [ CODE ] musisz się zarejestrować[/code:

Klatki powinny wyglądać tak:

http://img525.imageshack..../guide03wi2.jpg

Opis klatek:

1 - Wygląd buttona
2 do 5 - Gdy kursor dotknie buttona
6 do 10 - Gdy kursor zjedzie z buttona
11 do 15 - Gdy klikniemy button

Tak więc teraz w tych klatkach umieść animację jaką sobie wymyślisz :nerd: .

6. Potem wracamy do sceny głównej, zaznaczamy nasz button i w Properties w polu Label wpisujemy "Button01_mc".

7. Zaczyna się zabawa skryptem:

Aby móc zobaczyć zawartość umieszczoną w tagu [ CODE ] musisz się zarejestrować[/code:

7a. Teraz kopiujemy button cztery razy i zastępujemy nim wcześniejsze jego wersje.
Pamiętaj aby nazwać pozostałe trzy buttony inaczej niż pierwszy! Tak więc w miejscach "Label" wpisujemy: Button02_mc, Button03_mc, Button04_mc.

http://img376.imageshack....=guide04qn5.jpg

7b. W Actions kopiujemy skrypt z Button01_mc cztery raz i zamieniamy w kopiach Button01_mc na kolejno Button02_mc, [...]03_mc i [...]04_mc.


Teraz, wreszcie mozemy zablokować Layer "Tabela" i przejść do "Action".

8. Wklejamy na scenę naszą "Strzałkę" i umieszczamy ją na górze i (odwróconą) na dole.
Tak jak na screenie:

http://img521.imageshack....=guide05gl7.jpg

Potem tworzymy z niej nowy Movie Clip o nazwie Arrow_mc.

http://img524.imageshack....=guide06wd3.jpg

Obu nadajemy "labele": Arrow01_mc i Arrow02_mc!

9. Już po raz ostatni otwieramy Actions - Frame panel i wpisujemy:

Aby móc zobaczyć zawartość umieszczoną w tagu [ CODE ] musisz się zarejestrować[/code:

10. No i wreszcie koniec :)

Moje menu:

http://img152.imageshack....e=menu02gy2.swf

Mam nadzieję że się przyda tutek :)

+80 GFX - samborek
_________________
http://img79.imageshack.us/img79/3305/pomar1ny6.jpg

Pierwszy Tutorial - Menu
Ostatnio zmieniony przez samborek 2008-08-26, 08:34, w całości zmieniany 1 raz  
Postaw piwo autorowi tego posta
 
 
     

Asiek 





Program: Photoshop CS3, CorelDraw X3, Flash 8
Posty: 263
Dołączyła: 06 Sty 2008
Wiek: 21
Skąd: Sosnowiec

GFXPoints: 1486
Piwa: 36/10
Wysłany: 2008-08-28, 18:01 


Niewiem dlaczego, ale nie chce mi się twój outcome załadować. Zrób upload jeszcze raz bo zapowiada się ciekawie ;)
_________________
Flash master
AKCJA - PAJACYK: http://grafart.org/topics...0465.htm#111652
Gifts:
Groove | Widmo

http://img99.imageshack.us/img99/6417/abstract22lf6.pnghttp://img369.imageshack.us/img369/4915/oceniamdk4.png
Postaw piwo autorowi tego posta
 
     

Pomar1 





Program: MS Paint, GIMP, Flash
Posty: 15
Dołączył: 25 Sie 2008
Wiek: 16
Skąd: Zabrze

GFXPoints: 28
Piwa: 2/1
Wysłany: 2008-08-28, 18:04 


Nie wiem co jest z linkiem, ale tu jest nowy:

http://img152.imageshack....e=menu02gy2.swf

;-)
_________________
http://img79.imageshack.us/img79/3305/pomar1ny6.jpg

Pierwszy Tutorial - Menu
Postaw piwo autorowi tego posta
 
 
     

Asiek 





Program: Photoshop CS3, CorelDraw X3, Flash 8
Posty: 263
Dołączyła: 06 Sty 2008
Wiek: 21
Skąd: Sosnowiec

GFXPoints: 1486
Piwa: 36/10
Wysłany: 2008-08-28, 21:36 


No i teraz działa cacy :)
Ciekawe wykożystanie sledzenia ruchów myszki.
Ale powiem ci, że to czasem wkurza, tym bardziej że twój skrypt ma błąd i mapuje ruchy myszy po x-e w całym dokumencie a nie tylko na obszarze menu. proponuję dodać if-a, który będzie sprawdzał, czy myszka znajduje się wewnątrz mc. albo coś podobnego.
Widziałam taki efekt na kilku stronach i wiem, że jest to niezwykle wkurzające. dlatego zamiast tego, stosuję ten efekt z mojego tutka na menu ;)

Ale i tak fajny tutek. Dziekli wielkie. Piwo już ode mnie dostałeś za poprzedni. Rób kolejne, Ja też będę, a może wreszcie zarazimy to forum Flashem :)
_________________
Flash master
AKCJA - PAJACYK: http://grafart.org/topics...0465.htm#111652
Gifts:
Groove | Widmo

http://img99.imageshack.us/img99/6417/abstract22lf6.pnghttp://img369.imageshack.us/img369/4915/oceniamdk4.png
Postaw piwo autorowi tego posta
 
     

Pomar1 





Program: MS Paint, GIMP, Flash
Posty: 15
Dołączył: 25 Sie 2008
Wiek: 16
Skąd: Zabrze

GFXPoints: 28
Piwa: 2/1
Wysłany: 2008-08-28, 21:40 


"mapuje ruchy myszy po x-e w całym dokumencie" - Sorry, jakby co to nie skryptem tylko starczy zmniejszyć wielkość tego dokumentu do wielkości menu i tyle.
_________________
http://img79.imageshack.us/img79/3305/pomar1ny6.jpg

Pierwszy Tutorial - Menu
Postaw piwo autorowi tego posta
 
 
     

Asiek 





Program: Photoshop CS3, CorelDraw X3, Flash 8
Posty: 263
Dołączyła: 06 Sty 2008
Wiek: 21
Skąd: Sosnowiec

GFXPoints: 1486
Piwa: 36/10
Wysłany: 2008-08-28, 21:43 


No dobra, ale co jak chcesz na przykład umieścić go w większym elemencie, np na całej stronie we flashu? to znaczy na przykład robisz templates?

Nie wnerwiaj się poza tym, bo też ten efekt stosuję ;P
_________________
Flash master
AKCJA - PAJACYK: http://grafart.org/topics...0465.htm#111652
Gifts:
Groove | Widmo

http://img99.imageshack.us/img99/6417/abstract22lf6.pnghttp://img369.imageshack.us/img369/4915/oceniamdk4.png
Postaw piwo autorowi tego posta
 
     

Pomar1 





Program: MS Paint, GIMP, Flash
Posty: 15
Dołączył: 25 Sie 2008
Wiek: 16
Skąd: Zabrze

GFXPoints: 28
Piwa: 2/1
Wysłany: 2008-08-28, 21:51 


Kod:

this.loadMovie("menu.swf");


Np. takim skryptem :D
_________________
http://img79.imageshack.us/img79/3305/pomar1ny6.jpg

Pierwszy Tutorial - Menu
Postaw piwo autorowi tego posta
 
 
     
Wyświetl posty z ostatnich:   
Odpowiedz do tematu
Nie możesz pisać nowych tematów
Nie możesz odpowiadać w tematach
Nie możesz zmieniać swoich postów
Nie możesz usuwać swoich postów
Nie możesz głosować w ankietach
Nie możesz załączać plików na tym forum
Nie możesz ściągać załączników na tym forum
Dodaj temat do Ulubionych
Wersja do druku

Skocz do:  
Powered by phpBB modified by Przemo © 2003 phpBB Group
Style created by GrafArt.org & DeXteR007
statystyka
Polecane serwisy [ Dodaj swój link ]
Lost: Zagubieni | Wyniki Na Żywo | InterPatrol.pl | Forum windows | Zjawiska paranormalne | serwery hosting www | Zakłady Bukmacherskie | wiersze | Forum Tuningowe | Szkolenia Linuksowe |Najlepszy darmowy CMS-EF | Kurs HTML

Graphic Addicts Topsites: Graphic Art - Animation - Music - Gaming szablony na bloga

Za treść postów administracja nie odpowiada. W przypadku naruszenia prawa, wszelkie zgromadzone dane o osobie łamiącej prawo, zostaną przekazane odpowiednim władzom. Kopiowanie elementów graficznych oraz rozwiązań technologicznych zastosowanych na niniejszej witrynie surowo wzbronione.