În acest tutorial vă voi arăta cum să creați ineraktivnuyu hartă că, atunci când treceți peste luminile orașului în sus, iar indicatorul va fi o imagine mică a orașului. Acest lucru este util pentru noi Motion Tween clasa pentru a controla mișcarea cursorului, care se va muta din oraș în oraș, dacă am folosit o animație simplă cu MotionTween. ar fi foarte practic și foarte consumatoare de timp. Deci, vom folosi matrice și funcții. care va face codul nostru mai practic și mai ușor să se schimbe.
Toate imaginile pe care le-am folosit, puteți descărca aici.
Crearea unui nou ActionScript 1 sau 2 video, setați dimensiunea scenei ca 620x420px, framerate set 30, culoarea de fundal poate lăsa orice, nu este important. Primul strat și redenumiți Harta imortiruetsya principal (fundal) Kartika pe acest strat. Acest lucru va fi fundalul și orice manipulare cu această imagine producem nu vom, așa că vă sfătuiesc să blocați stratul.
Creați un nou strat și butoanele sale nazovtie. Pe acest strat, vom crea primul buton și apoi duplica-l și puneți toate butoanele de pe spatiul urban rezultat care ar trebui să fie evidențiate ubudt. Selectați instrumentul Oval și desena un cerc cu un diametru de aproximativ 25px oriunde pe stratul. În timp ce cifra este încă selectată prin apăsarea F8 și de ao transforma într-un myButton buton, numele. De asemenea, merită să vă asigurați că punctul de înregistrare este pe piețele centrale. Pointer va acoperi până la punctul de înregistrare, astfel încât este foarte important.
Pe harta orașului sunt deja marcate la punctele îngroșate, astfel încât programul de nu avem nevoie de chei. Vom face butonul transparent, prin schimbarea timeline'a acestuia. Dublu clic pe butonul pentru a schimba, cronologia principal al scenei trebuie să fie înlocuit pe butoanele de cronologie constând din patru cadre. Acum, pur și simplu trageți și plasați conținutul primul cadru la ultimul, astfel încât primul cadru (sus) nu a fost nimic, ci pe ultimul (Hit) - conținutul primului cadru, și anume, cerc. Acest lucru va face butonul invizibil, dar zona atunci când treceți pe care eticheta se va deplasa la butonul va rămâne.
Butonul nostru este gata, Verma pe scena principală și pune butonul în loc un asterisc care indică orașul pe harta Muscat. Acum, deschide inspectorul Properties și setați numele de exemplu, butonul ca muscat_btn.
Primul nostru buton este gata, dar orașele de pe harta 3 mai mult, astfel încât butonul nostru copie de trei ori și plasați copia de pe orașe. Pentru fiecare buton, trebuie să specificați numele instanței, care se întâlnește atât în oraș ea reprezintă: sohar_btn, dubai_btn și abu_dabhi_btn.
Blocați stratul cu butoanele și de a crea un altul pentru indexul nostru, numesc un marker. imaginea indicatorul se află în arhiva cu cardul, astfel încât doar să importe această imagine pe scenă. In timp ce imaginea este încă selectată, apăsați F8. pentru a converti într-un clip video și denumiți-o myMarker. Punct de înregistrare atribuie piața centrală inferioară. Când totul se face, bloc strat.
Acum, clipul video pe care tocmai l-am creat un alt strat și un cadru. Noi numim acest marker strat. și se adaugă patru cadre suplimentare (apăsați F5 de patru ori) pe acest strat. Adăugați un alt strat și nume îl orașe. adauga patru straturi cheie suplimentare (F6 de patru ori). Cronologie clipului video ar trebui să arate imaginea de mai jos:
Acum vom adăuga imagini mici pentru fiecare oraș. Orașele de pe stratul click pe al doilea strat și du-te la File> Import> Import to Stage și selectați Muscat.jpg. Imaginea urmează să plaseze pe index, după cum se arată mai jos:
Faceți clic pe al doilea cadru și deschide inspectorul Properties. înscriem ca fiind ca muscat numele celui de al doilea cadru.
Și așa, unul câte o imagine de import pentru fiecare oraș pe diferite cadre pe stratul orașelor. plasându-le în același mod ca și primul (de mai sus marker). Notăm cadre cu imagini, respectiv, numele orașului în care corespund: / strong> Sohar, Dubai și abu_dhabi. comandă nu contează stivuire, pentru că trecerea la fiecare cadru se va face atunci când vă mutați să-l orice buton adecvat.
Acum, deschide Acțiuni (F9) și se adaugă un panou
codul pentru primul cadru, prevenind imaginea de redare a clipului video.
Să ne întoarcem la capul scenei și să specificați numele instanță pentru clipul video cu imagini, cum ar fi marker_mc.
Toate podgotolveno pentru a adăuga interactivitate harta. Sozadim un nou strat pe scenă și denumiți-l principalelor acțiuni. în cazul în care și a pus următorul cod:
import mx.transitions.Tween;
import mx.transitions.easing * .;
orașe var: Array = [ "muscat", "Sohar", "Dubai", "abu_dhabi"]
Funcția mover (targetX, targetY) currentX = marker_mc._x;
currenty = marker_mc._y;
var xTween: Tween = new Tween (. marker_mc, "_x", Strong.easeOut, currentX, targetX 5, true);
var yTween: Tween = new Tween (marker_mc, "_y", Back.easeOut, currenty, targetY, 1,5, true);
>
pentru (var i = 0; i
my_btn.myCity = orașe [i];
my_btn.onRollOver = function () mover (this._x, this._y);
marker_mc.gotoAndStop (this.myCity);
>
>
cod explicație
Primele două linii de cod clase isportiruyut Tween și micșorând. necesare pentru noi pentru a crea efectul dorit.
import mx.transitions.Tween;
import mx.transitions.easing * .;
Cea de a doua parte a codului creează o matrice care conține numele orașelor, acestea sunt numele prima parte a numelor de buton, iar numele coincid cu cadrul din clipul video cu fotografii și un index. Este demn de remarcat faptul că acest caz este foarte importantă, pentru că în cazul în care numele nu se potrivește, atunci întregul film nu poate rabortat.
orașe var: Array = [ "muscat", "Sohar", "Dubai", "abu_dhabi"]
Cea de a treia parte a codului creează o funcție care, folosind clasa Tween se va muta cursorul din poziția sa curentă butonul, care se răsturnase.
Funcția mover (targetX, targetY) currentX = marker_mc._x;
currenty = marker_mc._y;
var xTween: Tween = new Tween (. marker_mc, "_x", Strong.easeOut, currentX, targetX 5, true);
var yTween: Tween = new Tween (marker_mc, "_y", Back.easeOut, currenty, targetY, 1,5, true);
>
Partea finală a codului de bucle prin matrice de numele orașelor și generează butoane name'y exemplu Daubal denumirii „_btn“ oraș. Apoi, atunci când treceți peste butonul începe funcția mover. descrisă în a doua parte a codului. Această funcție face ca token-ul pentru a trece la butonul pentru care poziția cursorului ecranului.
pentru (var i = 0; i
my_btn.myCity = orașe [i];
my_btn.onRollOver = function () mover (this._x, this._y);
marker_mc.gotoAndStop (this.myCity);
>
>
Totul! Noi testeaza videoclipul nostru asupra performanței. Dacă ceva nu funcționează, verifică numele orașelor din matrice, în cazul în care nu ajuta, atunci caută o greșeală de la început. Puteți adăuga mai multe orașe pentru a crea butoane suplimentare, cerandu-le model nume de instanță cadre suplimentare „cityName_btn“, cu fotografii și de a face numele orașelor din matrice.