feltöltve: 2005.11.23 | szerző: Peet86 | olvasva: 7218 alkalommal
A LocalConnection-nel ismerkedünk meg, mely lehetővé teszi az SWF fájlok közti kommunikációt szkriptnyelvek nélkül tisztán Flashben. A segédlet egy egyszerű példán mutatja be az objektum alkalmazását.
A segédlet elkészítéséhez két mozira lesz szükségünk. Az elsőben egy egyszerű drag&drop eseménnyel fogunk eltüntetni egy labdát, ami a másikban animálva jelenik meg. Az első mozinak továbbá egy reset funkciója is van, mely mindkét mozit alaphelyzetbe állítja.
Az első mozi:
1. lépés: Hozzunk létre egy tetszőleges méretű flash dokumentumot! (Az egész segédletre vonatkozik, hogy méret és elrendezés független, de a változók és objektumok nevei azonosak kell, hogy legyenek az ActionScript beli elnevezésekkel!)
2. lépés: Készítsük el a mozi elemeit! Szükségünk lesz egy 'teleportáló' mc-re, amire a logo-t draggelhetjük. Rajzoljunk egy akármilyen alakzatot (a példában egy félkör) és nevezzük el 'teleport'-nak.
Kell egy másik mc, amit draggelünk. Ebben az esetben az swf.hu logojával ellátott labda, melyet 'logo' névre kereszteltünk a properties ablakban. A színpadon a teleport feletti rétegre helyezzük el. A harmadik elem egy tetszőleges gomb, melyre késöbb 'resetgomb' néven hivatkozunk az AS kódban, ezért feltétlenül ezt a nevet adjuk neki!
3. lépés: Az első réteg első framejére illesszük be az alábbi AS kódot:
//a logo eredeti helyének meghatározása eredetiX = logo._x;
eredetiY = logo._y; //a reset gombot alaphelyzetben láthatatlanná teszi resetgomb._visible=false
//stop drag logo.onRelease = function() {
this.stopDrag(); //ha a teleport fölé érkezik a logo mc if (eval(this._droptarget) ==teleport) {
logo._x = teleport._x;
logo._y = teleport._y;
logo._visible=false //reset gomb megjelenítése resetgomb._visible=true // a tovabbitas fv-t hívja meg. tovabbitas("teleportalas") //ha nem találtál bele } else {
logo._x = eredetiX;
logo._y = eredetiY;
}
};
//reset gomb visszaállítja mind a két mozit alaphelyzetbe resetgomb.onRelease = function(){
logo._x = eredetiX;
logo._y = eredetiY;
logo._visible=true
resetgomb._visible=false //a másik moziban is resetel a LocalConnection segítségével.
tovabbitas("reset")
} function tovabbitas(parancs){ //új LocalConnection objektum létrehozása my_Lc= new LocalConnection(); //a "parancs" átadása a létrehozott LocalConnection segítségével my_Lc.send("_myLocalConnection","recievedValue",parancs)
}
A fenti programkód feladata, hogy a labda és a sötét terület koordinátáinak egyezésekor meghívja a tovabbitas() függvényt, melynek átadja a "teleportalas" parancsot. A függvényben ezután létrejön egy új LocalConnection objektum, melyet a send utasítással 'ráveszünk', hogy elküldje a "parancs" nevű változónkat. A kód továbbá a reset gomb eseménykezelését is tartalmazza, mely a "reset" parancsot küldi el a másik mozinak ugyancsak a tovabbitas() függvény segítségével, továbbá alaphelyzetbe állítja a mozit.
4. lépés: Mentsük el munkánkat movie1 néven és exportáljuk swf, illetve a beágyazás kódja miatt html fájlba (a segédlet végén a közös beágyazáshoz használjuk fel a html kódot).
A második mozi:
Most már jöhet a második mozi, ami fogadja az elsőből elküldött adatokat.
(hasonló látványos trükkel oldható meg 2 banner vizuális
összjátéka/kommunkációja egy portál oldalon belül)
1. lépés: Hozzunk létre egy tetszőleges méretű flash dokumentumot, ugyan úgy mint az előbb. Erre a legegyszerűbb megoldás, ha az egész fla fájlt elmentjük movie2.fla néven és kicsit átszerkesztjük.
2. lépés: A képi elemeket pozícionáljuk a példa-animációhoz hasonlóan! A 'teleport'-on egyszerűen forgassunk 180 fokot, a 'logo'-t pedig pozícionáljuk y=0-ra. A reset gombot és az első frame AS kódját töröljük ki, és a kód helyére ezt másoljuk:
//fogadó objektum létrehozása myReceiving_Lc = new LocalConnection() // a " _myLocalConnection"-t még a movie1-ben hoztuk létre. myReceiving_Lc.connect("_myLocalConnection") //a parancs végrehajtása myReceiving_Lc.recievedValue = function(parancs){ //ha teleportálás if (parancs=="teleportalas"){
logoanim.gotoAndStop(2) //ha reset }else{
logoanim.gotoAndStop(1)
}
}
Ez a kód fogadja a movie1-ből küldött parancsot a LocalConnection objektum segítségével, majd végrehajtja a 'parancsot'.
3. lépés: A kódból kitűnik, hogy egy animációt ("logoanim") vezérlünk vele. Fogjuk tehát a logo-t és konvertáljuk a jobb egér > Convert to Symbol parancsával egy újabb movie clip-be. Az így kapott mozit nevezzük el a properties ablakban logoanim-nak, hogy az ActionScript parancsok helyesen működjenek. A logoanim animáción belül két layert hozzunk létre. A második layer első frame-jét üresen hagyjuk, a másodikba helyezzük át a logo-t.
4. lépés:Másoljuk be az animációt megállító stop() utasításokat:
Frame1: stop()
Frame2: stop()
5. lépés: Animáljuk a logot! A logo mc-re kattntva másoljuk a kódszerkesztőbe ezt:
6. lépés: Mentsük el munkánkat movie2 néven és exportáljuk swf, illetve a beágyazás kódja miatt html fájlba.
Francia ágy, avagy Két mozi egy oldalban:
Nincs más hátra, az elkészült két flash mozit egy közös HTML oldalba kell ágyazni. A forrásfájlban elhelyezett teszt.html tartalmazza az ehez szükséges HTML kódot, ide nem írom le, mert mindössze arról van szó, hogy a mozi1 és mozi2 beágyazási html kódját egy közös, a segédletben teszt.html nevű oldalba másoljuk.
A két mozi külön külön oldalban is működik, ekkor azonban vigyázni kell, hogy ne fusson a vezérelt moziból egy másik példány is, mert kavarodást okozhat.
Végül nyissuk meg egy böngészőben és próbáljuk ki az elkészült anyagot.
Remélem hasznodra vált ez a segédlet. Ha bármilyen kérdésed lenne a leírtakkal kapcsolatban, szívesen segítek!