Snelle tip werken met SharedObjects

In deze snelle tip laat ik u zien hoe u SharedObjects (het Flash-equivalent van cookies) kunt opslaan en openen, zodat u gebruikersgegevens tussen sessies kunt opslaan en laden.


Eindresultaat voorbeeld

Laten we eens kijken naar het eindresultaat waar we naartoe zullen werken:

Merk op dat de intro-animatie niet wordt afgespeeld als je deze al één keer hebt gezien. Probeer u aan te melden (u kunt elke gebruikersnaam / wachtwoord combinatie gebruiken) en ververs dan de browser zonder uit te loggen. Uw gegevens worden automatisch ingevoerd.

Om de gegevens die zijn opgeslagen in SharedObject opnieuw in te stellen, logt u in en weer uit.


Stap 1: Het document instellen

Het eerste dat u moet doen, is de bronbestanden downloaden voor deze zelfstudie. Omdat deze tutorial een snelle tip is, sla ik de lay-outstappen over. Zodra u de bestanden hebt gedownload, opent u het bestand 'sharedObject.fla'. Wanneer het bestand is geladen, zult u merken dat we drie keyframes op de tijdlijn hebben.

Het eerste keyframe bevat de intro-animatie. De animatie is slechts een filmclip met een paar bewegings-tweens en een 'stop'-actie aan het einde.

Het tweede keyframe is het inlogscherm. Hier kan een gebruiker informatie invoeren. Ze kunnen ervoor kiezen om het op te slaan of niet. Als de gebruiker op de knop 'Bekijk animatie opnieuw' klikt, worden ze teruggebracht naar het eerste hoofdframe. Ook wordt het SharedObject dat we gaan instellen, verwijderd.

Het laatste hoofdframe bevat een eenvoudige RSS-lezer van de ActiveTuts + -feed. Als de gebruiker op de knop 'Uitloggen' klikt, worden deze teruggebracht naar het tweede hoofdframe en wordt SharedObject gewist. Dit betekent dat de gebruiker de intro-animatie de volgende keer dat ze de site bezoeken zal bekijken.


Stap 2: De documentklasse

Maak een nieuw 'ActionScript'-bestand en sla het op in dezelfde map als' sharedObject.fla '. Geef het bestand de naam 'sharedObject.as.' Koppel het Flash-bestand en het ActionScript-bestand vervolgens aan elkaar in het paneel Properties. Ga naar deze andere snelle tip voor meer informatie over het instellen van de documentklasse.


Stap 3: De invoer

Dit zijn de importstatements die we voor dit bestand gaan gebruiken. Omdat we meer dan één frame van de tijdlijn gebruiken, moeten we het uitbreiden als een filmclip.

 pakket import flash.display.MovieClip; import flash.display.SimpleButton; import flash.events.Event; import flash.events.MouseEvent; import flash.net.SharedObject; import flash.net.URLLoader; import flash.text.TextField; public class sharedObject breidt MovieClip uit openbare functie sharedObject () 

Stap 4: Beginnen met SharedObject

Dit is wat de ActionScript 3.0-taalhandleiding zegt over SharedObjects:

De SharedObject-klasse wordt gebruikt om beperkte hoeveelheden gegevens op de computer van een gebruiker of op een server te lezen en op te slaan. Gedeelde objecten bieden real-time gegevensuitwisseling tussen meerdere client-SWF-bestanden en objecten die persistent zijn op de lokale computer of externe server. Lokale gedeelde objecten zijn vergelijkbaar met browsercookies en externe gedeelde objecten lijken op real-time apparaten voor gegevensoverdracht. Als u gedeelde externe objecten wilt gebruiken, hebt u Adobe Flash Media Server nodig.

In dit voorbeeld werken we alleen met lokale gedeelde objecten. Om aan de slag te gaan met SharedObjects, maken we een variabele met de naam 'shared' en casten deze als een SharedObject. Vervolgens gebruiken we de methode 'getLocal' van de klasse SharedObject. Ik gaf het een naam 'voorbeeld', maar je kunt het elke naam geven die je wilt.

Nadat we ons SharedObject hebben geïnitialiseerd, noemen we de 'init'-functie. In de 'init'-functie stoppen we de hoofdtijdlijn. We controleren ook SharedObject om te zien of de intro-animatie is bekeken. Als dit het geval is, sturen we de gebruiker naar frame 2. Als de 'watched' eigenschap op het 'data'-object van ons SharedObject niet is ingesteld, spelen we de animatie en luisteren we ernaar om een ​​ENTER_FRAME-gebeurtenis te beëindigen.

 pakket import flash.display.MovieClip; import flash.display.SimpleButton; import flash.events.Event; import flash.events.MouseEvent; import flash.net.SharedObject; import flash.net.URLLoader; import flash.text.TextField; public class sharedObject breidt MovieClip uit private var shared: SharedObject; openbare functie sharedObject () shared = SharedObject.getLocal ("example"); in het();  private function init (): void this.stop (); if (shared.data.watched === true) this.gotoAndStop (2); frame2handler ();  else this.addEventListener (Event.ENTER_FRAME, onEnter); 

Stap 5: omgaan met de Intro-animatie

In de functie 'onEnter' luisteren we of de animatie het einde van de frames heeft bereikt. Zodra dit het geval is, verwijderen we de gebeurtenislistener, gaan we naar het tweede hoofdframe op de hoofdtijdlijn en noemen we de functie 'frame2handler'. We hebben ook de 'watched' eigenschap ingesteld op het 'data'-object van SharedObject. Omdat 'data' een object is, kunnen we er elke waarde aan toewijzen. Ik heb zojuist 'bekeken' als indicator voor de intro-animatie gebruikt.

Vervolgens noemen we de 'flush'-methode van SharedObject. Hiermee wordt SharedObject opgeslagen in het juiste lokale bestand en toegankelijk voor later gebruik.

 private function onEnter (event: Event): void if (animation.currentFrame === animation.totalFrames) this.removeEventListener (Event.ENTER_FRAME, onEnter); this.gotoAndStop (2); frame2handler (); shared.data.watched = true; shared.flush (); 

Stap 6: Het inlogscherm

In de functie 'frame2handler' merk je dat ik de methode 'addFrameScript' aanroer. Met behulp van deze methode hebben we toegang tot verschillende MovieClips in verschillende delen van de tijdlijn. 'addFrameScript' is gebaseerd op nul, dus om toegang te krijgen tot de MovieClips op frame 2, geven we het 1. We geven het ook een inline-functie door om logica in frame 2 te verwerken. Binnen die functie controleren we of de SharedObject heeft de waarden 'gebruiker', 'wachtwoord' en 'onthoud' ingesteld. Als dit het geval is, vullen we de tekstvelden met de juiste informatie.

 private function frame2handler (): void this.addFrameScript (1, function () if (shared.data.user! = null && shared.data.password! = null) user.text = shared.data.user; wachtwoord .text = shared.data.password; remember.selected = shared.data.remember; remember.label = "Remember me"; enter.addEventListener (MouseEvent.CLICK, onClick); watcher.addEventListener (MouseEvent.CLICK, onClick) ;); 

Stap 7: Omgaan met de knopklikken

Omdat de app klein is, gaan we alle klikken verwerken met één functie. In de functie 'onClick' controleren we de naam van het doelwit van de gebeurtenis. Als de naam 'Enter' is, controleren we vervolgens of de gebruiker zijn inloggegevens heeft onthouden. Als dat zo is, voegen we eenvoudig meer waarden toe aan het object 'data'. Als dat niet het geval is, verwijderen we die waarden uit het object 'data'. Daarna sturen we de gebruiker naar frame 3 en bellen met de 'frame3handler'. Als de gebruiker op de knop 'watcher' heeft geklikt, verwijderen we de waarde die aan de intro-animatie is gekoppeld. De gebruiker keert dan terug naar het eerste frame en we noemen de 'init' -functie met behulp van 'addFrameScript.' Wanneer u ten slotte in het derde frame op de knop 'clearer' klikt, wissen we het object 'data' en worden alle waarden van SharedObject gewist. De gebruiker wordt vervolgens teruggestuurd naar frame 2 en geen van hun informatie wordt bewaard.

 privéfunctie onClick (event: MouseEvent): void switch (event.target.name) case "enter": if (remember.selected) shared.data.user = user.text; shared.data.password = wachtwoord.text; shared.data.remember = remember.selected; shared.flush ();  else delete shared.data.user; verwijder shared.data.password;  this.gotoAndStop (3); frame3handler (); breken; case "watcher": verwijder shared.data.watched; this.gotoAndStop (1); this.addFrameScript (0, function () init ();); breken; case "clearer": shared.clear (); this.gotoAndStop (2); breken; 

Stap 8: Frame 3

In de functie 'frame3handler' gebruiken we opnieuw 'addFrameScript' om MovieClips in frame 3 te openen. Binnenin de inline-functie laden we de RSS-feed en gebruiken we de componenten List en TextArea om de informatie weer te geven..

 private function frame3handler (): void this.addFrameScript (2, function () clearer.addEventListener (MouseEvent.CLICK, onClick); var url: URLLoader = new URLLoader (); url.addEventListener (Event.COMPLETE, function () var xml: XML = nieuwe XML (url.data); var xmlList: XMLList = xml ... item; for (var i: int = 0; i 

Conclusie

Er is een massa toepassingen voor SharedObjects. Bekijk gewoon elke site zoals Pandora of spelsites zoals Adult Swim. De beste manier om te leren is echter om zelf te experimenteren en je natuurlijk te abonneren op Tuts+.

Bedankt voor het volgende!