. .. : Swf.hu 1.0 archívum : Swf.hu főoldal >>> : .. .




 
 
SEGÉDLETEK ActionScript

Adatok beolvasása, a LoadVars osztály bemutatása
  feltöltve: 2005.10.14 | szerző: Giruna | olvasva: 9248 alkalommal

   
 

A LoadVars osztály egy nagyon egyszerű eszköz a kezünkben arra, hogy adatokat (változók tartalmát) cseréljünk a Flash alkalmazásunk és a szerver között. Tekinthetjük a megszokott loadVariables() függvény alkalmazását kiváltó alternatív megoldásnak is, de amellett, hogy mindazt, amit a loadVariables tud elvégeztethetjük vele, szebb, színesebb, szagosabb és könnyebben kezelhetőbb, ráadásul közelebb is áll az objektum orientált programozási szemléletéhez.

Az egyik lényeges különbség a LoadVars objektum és a loadVariables függvény között, hogy míg az előbbi csak a saját mezőjeként őrzött és általunk meghatározott változókat küldi el, addig az utóbbi kivédhetetlenül küldi az összes változóját annak a Movie Clip-nek, ahonnan meghívtuk.
A szerverrel való kommunikáció során az adatokat url-encoded formában és név-érték párokba rendezetten küldi és fogadja, ugyanúgy, mintha a loadVariables-t használnánk. Pl.: age=26&name=Gary
Szintén alkalmas a változók küldésén-fogadásán túl a nagyobb méretű külső szövegek betöltésére is, amely szöveg lehet egy statikusan tárolt szövegfájl tartalma, de lehet egy dinamikusan (PHP-n, adatbázison keresztül, stb.) előállított szöveges tartalom is. Azt hiszem annak előnyét pedig nem kell külön ecsetelnem, ha a fla-ba nyúlás, átírás, publish-olás, majd az swf fájl szerverre másolása helyett csak egy szövegfájlt kell átírnunk és a szerverre felmásolunk. Nem mellékesen a szöveges tartalomhoz lehet admin felületet is készíteni, így annak, aki módosítja a tartalmat nem kell értenie a Flash-hez.

Fontos még megemlíteni, hogy a LoadVars csak Flash 6-os player-től kezdve használható.
A forrásfájlok Flash MX 2004-gyel készültek.


Első lépés: a deklarálás

A következő egysoros példával már létre is hoztuk a LoadVars osztály my_lv nevezetü példányát:

var my_lv:LoadVars = new LoadVars();


Eseménykezelők

LoadVars.onLoad
A LoadVars osztályú példány leginkább használt eseménykezelője, amely akkor hívódik meg, amikor egy LoadVars.load() vagy egy LoadVars.sendAndLoad() művelet végrehajtódott. Nagyon hasznos, hogy paramétereként kapunk egy Boolean tipusú változót, melyet hibaellenörzésre tudunk használni. Ha az adatátvitel sikeres volt true, ha bármi probléma lépett fel false értékkel tér vissza.
Ha a művelet sikeresen végrehajtódott, akkor a LoadVars-példányban létrejönnek a letöltött változók és az eseménykezelő lefutásakor a példány egy-egy mezőjeként elérhetővé is válnak. (pl. my_lv.szoveg)
Ez az eseménykezelő nincs definiálva alapból, így nekünk kell hozzárendelnünk a LoadVars-unkhoz, ez történhet így például:

var my_lv:LoadVars = new LoadVars();

my_lv.onLoad = function(success:Boolean) {
   if (success) {
      trace("Sikeres adatfogadás.");
   } else {
      trace("Hiba!");
   }
}



LoadVars.onData
Nagyon hasonlít az onLoad-ra. Szintén egy LoadVars.load() vagy egy LoadVars.sendAndLoad() metódushívás után hívódik meg akkor, amikor befejeződött az adatok letöltődése a szerverről, vagy ha bármiféle hiba adódott a letöltés során. Az eseményezelő még azelött hívódik, hogy az adatok elemezve (feldolgozva, parse-olva) lennének, azaz megjelennének mint a LoadVars példány változói. Ezért az onData kifejezetten szöveg fogadásra alkalmas eseménykezelő, két okból is. Egyrészt paraméterként itt a teljes nyers szöveget kapjuk meg, amivel azt kezdünk amit akarunk, másrészt az adathalmaz feldolgozatlansága miatt nincs jelentősége az url-encoded szabvány szerinti szövegírásnak. Megkerülhető tehát a % a + vagy az & jelek url-encoded formára hozása (& jel helyett %26, + jel helyett %2B-t, stb.), mivel ezek a karakterek csak az adatfeldolgozás során bírnak különleges jelentőséggel és nem is jelennek meg a szövegekben (az & jel például a változókat választja el egymástól, mint ahogyan ezt a bevezetőben említettem is (age=26&name=Gary)). Ha ezt az eseménykezelőt használjuk, akkor ezzel nem kell foglalkoznunk. Hibaellenőrzésre itt is használhatjuk az eseménykezelő paraméterét, amely értéke hiba esetén undefined lesz.
Alapból definiált változatában a LoadVars.onData meghívja a LoadVars.onLoad eseménykezelőt. Ha saját függvényt rendelünk az eseményhez - ahogy az elöbb is tettük - akkor a LoadVars.onLoad természetesen nem hívódik meg, hacsak mi meg nem hívjuk az új függvényünkből. Ezt csak akkor tegyük meg, ha valamiért az onData után szükségünk lenne még az onLoad-ra is.
Példa:

var my_lv:LoadVars = new LoadVars();

my_lv.onData = function(src:String) {
   if (src == undefined) {
      trace("Hiba!");
   } else {
      trace("Megérkezett a nyers szöveg.");
   }
}



Főbb metódusok

load

Ezzel a metódussal tudunk letölteni változókat egy meghatározott URL-ről. A változók automatikusan jönnek létre a feldolgozás során. Ha a LoadVars példányunknak volt már elötte ilyen nevű mezője, akkor annak a tartalma felülíródik az új adattal. A betöltött változóktól eltérő nevü változóink természetesen megmaradnak.

A metódus szintaktikája:
my_lv.load(url:String)

Az egyetlen paraméter az URL, ahonnan az adatokat várjuk.

A következő két példában már működőképes dolgokat fogunk összehozni; először egy külső szövegfájlból töltünk változókat - ezt az onLoad eseménykezelővel oldjuk meg - másodjára egy hosszabb szövegrészt töltünk be a szövegfájlból, aminek töltődését az onData eseménykezelővel kísérjük figyelemmel, a fentebb már említett nehézségek elkerülése végett. Az egyszerűség kedvéért mindkét esetben egy-egy kódból létrehozott szövegmezőbe fogjuk kiiratni az eredményt:

1. példa - load és onLoad használata:



Mivel az egyetlen gombon kívül minden script-ből lett létrehozva, nem írnám le az elkészítését és screenshot-ot sem csinálok róla - a forrás meg úgyis mellékelve van :)
Azt persze nem szabad elfelejteni, hogy a gombnak instance name-t kell adni - my_btn.
A szövegfájlnak pedig ez az egy sor a tartalma, ami alapján két változó jelenik meg a LoadVars-ban - age és name:
age=26&name=Gary
Ezek értékeit íratjuk ki az ablakba.

Az actionscript:

// A szövegmező létrehozása
this.createTextField("my_txt", 0, 12, 12, 140, 80);
my_txt.border = true;
my_txt.multiline = true;
my_txt.background = true;
my_txt.backgroundColor = 0xFCFCFC;
// ----------------------------------
// LoadVars létrehozása
var my_lv:LoadVars = new LoadVars();
// onLoad eseménykezelő
my_lv.onLoad = function(success:Boolean) {
   if (success) {
   // Ha sikeres volt a betöltés
      my_txt.text = "Sikeres adatfogadás.\n\nAge: "+this.age+"\nName: "+this.name;
   } else {
         // Ha nem volt sikeres a betöltés
      my_txt.text = "Hiba!";
}
}
// Gombra kattintáskor indul el a betöltés
my_btn.onRelease = function () {
   // A szövegfájlból a változók betöltése
   my_lv.load("images/loadvars_load-onload.txt");
}




2. példa - load és onData használata:



Ez a példa nagyban hasonlít az előzőre, azzal a különbséggel, hogy egy most HTML formázott szöveget töltünk be.
A formázáshoz hasznos segítség lehet a Flash által támogatott HTML tag-ek listája.

Az actionscript:

// A szövegmező létrehozása
this.createTextField("my_txt", 0, 4, 36, 400, 280);
my_txt.border = true;
my_txt.multiline = true;
my_txt.background = true;
my_txt.backgroundColor = 0xFCFCFC;
my_txt.html = true;
// Tudjon fogadni HTML formázott szövegeket
my_txt.condenseWhite = true; // A fölösleges szüneteket törli ki a szövegből (space, sortörés, stb)
my_txt.wordWrap = true;
// ----------------------------------
// LoadVars osztálypéldány létrehozása
var my_lv:LoadVars = new LoadVars();
// onData eseménykezelő
my_lv.onData = function(src:String) {
   if (src == undefined) {
   // Ha nem volt sikeres a betöltés
      my_txt.htmlText = "Hiba!";
   } else {
                        // Ha sikeres volt a betöltés
      my_txt.htmlText = src;
   }
}
// Gombra kattintáskor indul el a betöltés
my_btn.onRelease = function () {
   // A szövegfájlból a HTML formázott szöveg betöltése
   my_lv.load("images/loadvars_load-ondata.html");
}




send
Ezt a metódust a LoadVars-ban létező változók egy meghatározott URL-re való elküldésére használhatjuk. Az összes létező változót egy sztringgé fűzve küldi el, az application/x-www-form-urlencoded formának megfelelően. A küldéshez POST metódust használja ha a paraméter megadását elmulasztjuk, vagy nem határozzuk meg, hogy GET legyen.
A POST és a GET metódus közötti alapvető különbség a webszervernek küldött adatok utaztatási helye. A GET metódusnál a függvény magához az URL-hez fűzi az adatokat, a POST metódusnál a HTTP kérés törzsébe ágyazza.
A küldött változók automatikusan megjelennek a PHP-n belül, ezeket a $_POST['változónév'] vagy a $_GET['változónév'] asszociatív tömbökön keresztül lehet elérni, részletesebben lásd itt.
Régebbi verziójú PHP-knál (4.1.0. elöttieknél) pedig a $HTTP_POST_VARS['változónév'] vagy a $HTTP_GET_VARS['változónév'] módon érhetjük el adatainkat.

A send metódus szintaktikailag így néz ki:
my_lv.send(url:String,target:String [, method:String])

Mint látható 3 paramétere van, melyek közül az adatküldés tipusa - a harmadik paraméter - opcionális, tehát elhagyható, mint azt már fentebb említetettem.
Az első paraméter a megcímzett URL, ahova az adatainkat szánjuk. A szerveroldalon bármilyen CGI program lehet (PHP, ASP, Perl, de akár C-ben, Delphi-ben is lehet ilyet írni), az egyszerűség kedvéért most PHP-t fogunk használni.
A második paraméterként azt az ablakot, vagy frame-et kell megadni, melyben a szervertől jött választ dolgozzuk fel. A send metódus mindenképp új ablakot nyit. Ha ezt el szeretnénk kerülni, akkor majd a következőben tárgyalt sendAndLoad metódust kell használnunk.
A második paraméter lehet:
_self - az aktuálisban, azaz magában nyitja meg.
_blank - új ablakban nyitja meg.
_parent - az aktuális szülőjében nyitja meg.
_top - a legfelső szinten lévőben nyitja meg.
vagy egy frame-ben, ekkor a frame nevét kell ideírni

Lássunk rá egy példát:




A fla ismét rendkivül egyszerü. Mindössze egy statikus szövegmező, egy beviteli szövegmező - ahova az elküldendő adatot írjuk - és a küldésre szolgáló gomb a tartalma, mindezek külön layer-en. Így néz ki belülről:




és az elmaradhatatlan actionscript:
input_txt.restrict = "0-9"; // Csak számjegyeket fogadjon el
// LoadVars objektum létrehozása
var my_lv:LoadVars = new LoadVars();
// Gombra kattintáskor indul el a küldés
my_btn.onRelease = function () {
   my_lv.szam = parseInt(input_txt.text, 10);
// Egész számmá konvertálás
   my_lv.send("images/loadvars_send.php", "_blank", "POST"); // Az adatok elküldése a PHP-nak
}

Persze ehhez jár egy kis PHP kód is:
$szam = $_POST['szam'];  // az átküldött szám fogadása
$dupla = 2*$szam;            //szorozva kettővel :)
// Majd a böngészőben megjelenítjük az adatokat
echo "<b>A fogadott szám:</b> $szam<br><b>A szám kétszerese:</b> $dupla";

Még nincs vége... lapozz!

 
   
 
 

© Devnet.hu. A segédletek semmilyen formában nem másolhatók, publikálhatók a Devnet.hu és a szerzők közös írásos engedélye nélkül.
 
. .. : Swf.hu 1.0 archívum : Swf.hu főoldal >>> : .. .