E-learn.ro
Panou utilizatori
Utilizator Parola
Creeaza cont nou    Recupereaza parola
Login
Newsletter
Introdu adresa ta de email
Inscrie-te
Inchide panoul de utilizatori
Add to Google

Tutoriale Adobe Flash

Descarca toolbar

Toolbar E-learn.ro Facebook Twitter

GRAFICA 2D  /  Adobe Flash  /  Navigare (3)

Meniu in flash cu sunet

22.04.2008
Meniu in flash cu sunet

Realizarea unui meniu cu sunet si cu efect de rollover.

Total vizualizari: 7322 7322 afisari   |   Comentarii  1   |   Rating   |   (4 voturi)   |   Timp necesar: 30 min 30 min   |   Nivel de cunostiinte necesar: Mediu  Mediu

Sursa:  www.toxiclab.org  
Autor:  Toxiclab.org
Download
Adauga la tutoriale favorit Adauga la tutoriale favorite
Pagina:
1 2 »
comenteaza printeaza

Pentru codul sursa click pe link-ul de download de mai sus.


Realizeaza un nou document Flash, cu dimensiunile de 250x180px. Seteaza frame rate la 42 fps (frames per second / cadre pe secunda), si culoarea de fundal (background) #E3E3E3.

Crearea meniului
Selecteaza Line Tool (N), culoarea #C0C0C0 si tipul liniei sa fie Solid, cu grosimea setata pe 1. Vezi imaginea de mai jos.

Meniu cu sunet

Deseneaza 5 linii care vor reprezenta liniile meniului.

Meniu cu sunet

Alege Text Tool (T), mergi la Properties Panel (Ctrl+F3) de sub stage si efectueaza urmatoarele modificari:
- Selecteaza campul Static Text si fontul Trebuchet MS font sau un alt font daca ai alta preferinta.
- Alege marimea fontului 12, cu bold
- Textul sa aiba culoarea neagra
- Ca metoda de randare a textului alege: Anti-alias for readability.

Meniu cu sunet

Scrie textul ca in imaginea de mai jos.

Meniu cu sunet

Folosind uneltele Flash deseneaza in partea stanga a fiecarui text 2 sageti.

Meniu cu sunet

Alege Selection Tool (V) si selecteaza primul text din meniu (in acest exemplu "home page"), incluzand sagetile. Apoi apasa F8 pentru a transforma acest text in Movie Clip Symbol.

Meniu cu sunet

Cat timp noul Movie Clip este selectat, mergi in Properties Panel (Ctrl+F3) de sub stage. In partea stanga, vei gasi campul de introducere al numelui instance (instance name). Numeste acest Movie Clip HomePage.

Meniu cu sunet

Dublu click cu Selection Tool (V) pe movie clipul de pe stage. Acum ar trebui sa fii in interiorul filmului.

Meniu cu sunet

Alege Selection Tool (V) si selecteaza numai sagetile. Apoi apasa Ctrl+X (cut), creeaza un nou layer, selecteaza-l si apasa Ctrl+Shift+V (paste in aceeasi pozitie)

Mergi inapoi la layer 1, selecteaza textul din nou si apasa F8 pentru a-l transforma iar Movie Clip Symbol.

Meniu cu sunet

Click pe frame 10 si 20 si apasa tasta F6. Cat timp esti in frame 20, alege Selection Tool (V), click o data pe movie clipul "home page" pentru a-l selecta si mergi in Properties Panel (Ctrl+F3) de sub Stage. In dreapta, vei vedea meniul de culoare. Selecteaza Tint si la culoare alege alb.

Meniu cu sunet

Apoi mergi inapoi la frame 10 si folosind tastele directionale sau cu mouse-ul, muta textul ("home page") mai spre stanga. Alege Selection Tool (V), click inca o data pe Movie Clip ("home page"), selecteaza si mergi la Properties Panel (Ctrl+F3) de sub stage. In dreapta vei vedea meniul pentru culori. Selecteaza Tint si pentru Tint color alege alb (white).

Meniu cu sunet

Click de dreapta oriunde pe zona gri dintre frame 1 si frame 10, si frame 10 si frame 20 de pe Timeline si alege Create Motion Tween din meniul care apare.

Meniu cu sunet

Blocheaza layer-ul 1, selecteaza layer-ul 2 (arrows) si apasa F8 (Convert to Symbol) pentru a transforma sagetile in Movie Clip Symbol

Click pe frameurile 10 si 20 si apasa F6. Apoi, cat timp inca te afli pe frame-ul 20, alege Selection Tool (V) si click o data pe sageti ca sa le selectezi. Apoi mergi la Properties Panel (Ctrl+F3) si in meniul pentru culori selecteaza Tint. Pentru culoare alege iar alb (white) si la cantitate (Tint Amount 100%).

Mergi inapoi la frame 15 si folosind tastele directionale sau cu mouse-ul, muta sagetile un pic mai la dreapta. Apoi repeta pasul din paragraful anterior.

Meniu cu sunet

Click de dreapta oriunde pe zona gri dintre frame-urile 1 si 10, si frame-urile 10 si 20 pe timeline si alege Create Motion Tween din meniul care apare.

Meniu cu sunet

Blocheaza layerul 2 si creeaza un nou layer deasupra acestuia (layer3). Alege Rectangle Tool (R). In zona de culori la panoului de unelte, blocheaza "Stroke color" cu click pe icoana mica reprezentand un creion si apoi pe patratul mic cu linia diagonala rosie. Pentru culoarea de umplere (Fill) seteaza #D9031C.

Meniu cu sunet

In partea stanga a sagetilor, deseneaza un dreptunghi de aproximativ 2,5px x 21px.

Meniu cu sunet

Cat timp dreptunghiul este inca selectat, apasa F8 pentru a-l transforma in Movie Clip Symbol.

Meniu cu sunet

Click pe frame-ul 30 al layerului 3 si apasa F6. Apoi, alege Free Transform Tool (Q), apasa si tine apasata tasta Alt si procedeaza ca in imaginea de mai jos.

Pagina:
1 2 »
comenteaza printeaza
Alte tutoriale Adobe Flash:
Noteaza acest tutorial
Rating tutorial
 
(4 voturi)
Pentru a nota acest tutorial, trebuie sa fii logat!
COMENTARII (1) spune-ti parerea
exodian95 , Joi, 25 Noiembrie 2010, ora 15:19
#1

Merci, ma ajutat mult. :)

Raporteaza acest comentariu ca injurios!
Posteaza un comentariu
Pentru a posta un comentariu, trebuie sa fii logat!
0 TOP UTILIZATORI* 0 0
Tutoriale scrise de claibornelara
claibornelara Rang utilizator claibornelara - Incepator
4930
Tutoriale scrise de mcuemica
mcuemica Rang utilizator mcuemica - Incepator
4875
Tutoriale scrise de ellarichards
ellarichards Rang utilizator ellarichards - Incepator
4740
Tutoriale scrise de emonclercheap
emonclercheap Rang utilizator emonclercheap - Incepator
4695
Tutoriale scrise de beacherrosa
beacherrosa Rang utilizator beacherrosa - Incepator
4510
* Acest top reprezinta punctajele acumulate in ultimele 30 de zile.
Dreamweaver Lightroom Python Action Script HTML Outlook Fotografie StyleSheet PHP SEO JSON XHTML Verilog COREL DRAW Vista XML Powerpoint Flash Gimp Swift 3D MySQL RoR Excel Java SWF CSS Ruby on Rails AJAX Javascript Fireworks Bridge Illustrator Sony Vegas Photoshop PSD Word
Promovare:
Daca faci parte din comunitatea E-learn.ro si doresti promovarea acesteia, poti accesa pagina de promovare.
Arhiva newsletter:
Daca ai ratat un numar mai vechi, sau vrei sa revezi care au fost noutatile E-learn.ro la un moment dat, poti accesa arhiva de newslettere.
  Copyright © 2008-2013 E-LEARN.ro. Toate drepturile rezervate. Termeni si conditii.
Conceput si realizat de Neokinetics Software