Bygg en ActionScript 3.0 HTML-boks med XML- og CSS-støtte

I denne opplæringen lager vi en HTML-boks som analyserer innhold lastet fra XML og CSS. Vi bygger den ved hjelp av ActionScript 3.0, slik at vi kan kompilere den i FlashDevelop. Jeg vil også demonstrere hvordan å kompilere det i Flash IDE. Vi vil fokusere på å lage eksterne skriptfiler (klasser), laste inn og bruke XML- og CSS-filer, som alle vil anta litt forståelse av ActionScript. La oss komme i gang!




Introduksjon

Under de følgende trinnene oppretter vi en HTML-boks ved hjelp av ActionScript 3.0. Underveis ser vi:

  • Opprette eksterne skript (klasser).
  • Laster, analyserer og bruker XML- og CSS-filer.
  • Opprette nye arrangementer med "dispatchEvent".
  • Bruke "TextEvent".
  • Bruke htmlText-koder.

Du kan lage filene som vi vil se nedenfor i en tekstredaktør som notisblokk etc., jeg bruker FlashDevelop som et utviklingsmiljø. Våre filer vil være:

  • "Styles.css"
  • "Source.xml"
  • "CSS.as"
  • "XMLLoader.as"
  • "Main.as"

og for de som ønsker å kompilere i Flash IDE:

  • "HtmlBox.fla"

Trinn 1 - Starte HTML-boksen

I FlashDevelop, start et nytt prosjekt. Velg "AS3-prosjekt" og navnet "htmlBox".

Etter å ha opprettet prosjektet, vil "Main.as" bli opprettet automatisk. Du må opprette andre filer manuelt. Legg til en mappe med navnet "keremk" til src-mappen.

I denne mappen oppretter vi "XMLLoader.as" og "CSS.as" ved å høyreklikke på "keremk" og skal legge til> Ny klasse ... Vi vil også legge til vår "source.xml" og "styles.css "filer til bin-mappen ved å høyreklikke" bin "og gå til Legg til> Ny XML-fil ... og Legg til> Ny CSS-fil.

For Flash IDE, opprett en mappe med navnet "htmlBox" i exploreren din. Opprett "Main.as" ved å høyreklikke og gå til Ny> Flash ActionScript-fil, og opprett "htmlBox.fla" ved å høyreklikke og gå til Nytt> Flash Document. Deretter oppretter du en mappe med navnet "keremk" da i denne mappen opprett "XMLLoader.as" og "CSS.as". Du må opprette "styles.css" og "source.xml" i "htmlBox" -mappen (samme mappe som "Main.as" og "htmlBox.fla" -filer). Du kan opprette dem ved å høyreklikke og gå til Nytt> Tekstdokument og gi nytt navn til utvidelsene. Du kan bruke alle redaktører til å skrive "som", "xml" og "css" -filer. Du kan også skrive "som" filer i Flash IDE ved å dobbeltklikke på dem.

Trinn 2 - Opprette CSS-filen

Jeg vil bruke font-familie, skriftstørrelse, tekstjustering, font-vekt, farge og
tekst-dekorasjon egenskaper i min CSS-fil. Jeg lager også en "hW" -kode for overskrifter og "aktivL", "passivL", "side" og "para" -klasser for andre tekster.

 hW: Overskriftsstiler activeL: Aktive lenke stiler passiveL: Passiv lenke stil side: Sidetall stiler para: Paragraf stiler

Her er koden. Jeg vil ikke forklare det line for line fordi jeg tror det er ganske forståelig.

 A: link text-decoration: understreke;  A: svever tekst-dekorasjon: ingen;  hW font-family: "Courier New", Courier, monospace; skriftstørrelse: 20px; tekst-align: center; font-weight: bold; farge: #CCCCCC;  .activeL font-family: "Comic Sans MS", kursiv; skriftstørrelse: 12px; tekst-align: center; font-weight: normal; farge: #EEEEEE;  .passiveL font-family: "Comic Sans MS", kursiv; skriftstørrelse: 12px; tekst-align: center; font-weight: normal; farge: # 666666;  .para font-familie: Verdana, Arial, Helvetica, sans-serif; skriftstørrelse: 12px; tekstjustering: rettferdiggjøre; font-weight: normal; farge: #CCCCCC;  .page font-family: Verdana, Arial, Helvetica, sans-serif; farge: #CCCCCC; skriftstørrelse: 12px; tekstjustering: høyre; font-weight: normal; 

Trinn 3 - Opprette XML-filen

Når du oppretter XML-fil, bruker vi Flash-htmlText-koder som vises nedenfor. For mer informasjon, kan du besøke Adobe for TextField.htmlText.

 Ankermerke (lenke):  Fet etikett: Break-tag:
Bildetikett: Kursiv tag: Liste element tag:
  • Stikkord:

    Span-kode: Understrekk tag:

  • Vi begynner å lage vår "source.xml" ved å definere firstchild som . Mellom koder, vi skriver vår html-kode.

             

    Trinn 4 - Skrive HTML-sider i XML-filen

    Vi starter med en pause "
    "for å forbedre presentasjonen. Merk at vi må lukke alle merkene vi bruker i XML, ellers kan ikke XML-filen analyseres. "
    "er en lukket tag.
    Etter "break" -taggen skriver vi en overskrift i "hw" -taggen og starter avsnittet i " ". For listene bruker vi en"" stikkord.


    OVERSKRIFT
  • Trinn 5 - Legge til "Neste" og "Forrige" Lenker til Sider

    For å legge til neste og forrige koblinger, bruker vi "event: next" og "event: prev" som "href". Disse vil bli fanget av flashplayer som en begivenhet. Når linkene klikkes, sendes "event: next" en "link" -hendelse med en "neste" tekst i flash.

     ...  < PREVIOUS |   | NESTE>  

    På denne siden (for første side) blir det ikke en forrige side. Så tidligere kobling skal være passiv og "href" må være tom.

    Forresten, for å se "<", "&" etc. symbols in htmlbox we should use their codes shown below.

    < : < (less than) > :> (større enn) &: & (ampersand) ":" (dobbelt anførselstegn) ' : '(apostrof, enkelt sitat)

    Trinn 6 - Legge til sidetal på sider

    Når du legger til sidetall, trenger vi bare å bruke «side» -kursen for «span». Mønsteret på sidetall er opp til deg. Jeg skrev dem slik: "(side 1/3)".

    ... (side 1/3) 

    Og her er min XML-fil med en side.

        
    AS3 HTML BOX med XML og CSS support
    Hei alle sammen.

    Denne HTML-boksen er opprettet med bare AS3. Og alle koder er skrevet i eksterne "som" filer.

    Med opplæringen nedenfor lærer du:
  • Hvordan lage eksterne klasser.
    Slik laster du inn, analyserer og bruker XML- og CSS-filer i en HTML-tekst.
    Hvordan lage nye hendelser med "dispatchEvent" og bruk disse hendelsene.
    Slik bruker du "TextEvent" i htmlText.
    Slik bruker du htmlText-koder.






  • < PREVIOUS | | NESTE>

    (side 1/3)

    Forresten, kan du legge til bilder på sidene dine som vist nedenfor:

        

    Trinn 7 - Handlingsskriptfiler (Eksterne klasser)

    Vi har opprettet mappen "keremk" og vi bruker denne mappen til våre "XMLLoader" og "CSS" -klasser.

    Vi må derfor starte klassene våre med:

     pakke keremk 

    Trinn 8 - Opprette CSS-klassen

    Vi starter vår CSS-klasse med "pakke keremk ". Klassens navn vil være det samme som filnavnet "CSS". Merk: ActionScript er saksfølsomt. Siden vi sender hendelser med denne klassen, vil den utvide "EventDispatcher".

     pakke keremk // CSS er i keremk mappe offentlig klasse CSS strekker EventDispatcher // CSS vil sende hendelser offentlig funksjon CSS (): void loader = ny URLLoader; // når en CSS er opprettet, vil ny loader bli definert 

    Trinn 9 - CSS: Importerer Flash-klasser

     importer flash.net.URLLoader; // Vi laster css fil med urlader import flash.net.URLRequest; // og det bør være en forespørsel om å laste. importer flash.text.StyleSheet; // Vi analyserer css-filen som et stilark. importerer flash.events.SecurityErrorEvent; // Vi sender forsendelser, så vi må også importere relaterte klasser. importer flash.events.IOErrorEvent; importere flash.events.Event; importer flash.events.EventDispatcher;

    Du kan også importere disse klassene innen 3 linjer ved å bruke "*" for å importere alle "hendelser" og "nett" -klasser, men jeg foretrekker å importere dem en etter en. Vi trenger ikke alle "hendelser" og "nett" -klasser. Hvis du foretrekker å skrive mindre kode, er det forkortet tilsvarende.

    importer flash.events. *; importer flash.net. *; importer flash.text.StyleSheet;

    Trinn 10 - CSS: Variabler

    Vi trenger bare to variabler i denne klassen, en URLLoader og et stilark.

    privat var loader: URLLoader; offentlig var ark: StyleSheet;

    Forresten, private variabler er ikke tilgjengelig fra ut av sine klasser. Jeg bruker "loader" bare i CSS-klassen, så jeg kan lage den som privat. Jeg bruker "ark" fra hovedklassen, så jeg må lage den som "offentlig" (nås).

    Trinn 11 - CSS: Lastfunksjon

    Vi bruker denne lastfunksjonen fra vår hovedklasse, så vi må lage den som offentlig. Det vil kreve en streng å laste, det vil være "_req: String"

    Public Function Load (_req: String): void // funksjonen vil laste filen som den er sti gitt. loader.load (ny URLRequest (_req)); // banen skal transformeres til en URLRequest for å laste filen. loader.addEventListener (SecurityErrorEvent.SECURITY_ERROR, secError); // Vi lytter til 3 hendelser for å overføre til hovedklassen. loader.addEventListener (IOErrorEvent.IO_ERROR, ioError); loader.addEventListener (Event.COMPLETE, lastet); 

    Trinn 12 - CSS: Event Handlers og Dispatchers

    I Trinn 11 la vi til 3 hendelseslyttere til loader, Security Error, IO Error og Complete. En av dem vil bli sendt til slutt. Når det er skjedd, må vi overføre det til hovedklassen ved å lytte og sende. Vi bør også sjekke om det er noe problem når du analyserer CSS-filen etter "Fullfør" -hendelse. Vi sjekker det ved å bruke "prøve fange".

    privat funksjon ioError (e: IOErrorEvent): void // Når IO-feil oppstår, dispatchEvent (ny hendelse ("CSS_IOError")); // denne linjen sender "CSS_IOError".  privat funksjon secError (e: SecurityErrorEvent): void // Når det er et sikkerhetsproblem, sendesEvent (ny hendelse ("CSS_SecurityError")); // denne linjen sender "CSS_SecurityError".  privat funksjon lastet (e: Event): void // Hvis du laster filen er ferdig, prøv // prøve å analysere den. ark = nytt StyleSheet (); sheet.parseCSS (loader.data); dispatchEvent (ny hendelse ("CSS_Loaded")); // Hvis parsing er OK, sender denne linjen "CSS_Loaded".  fange (e: Feil) dispatchEvent (ny hendelse ("CSS_ParseError")); // Hvis parsing ikke er OK, sender denne linjen "CSS_ParseError"

    Med hendelseshåndterere og dispatchere er vår CSS-klasse ferdig. Her er den fulle CSS.as-filen:

     pakke keremk import flash.net.URLLoader; importere flash.net.URLRequest; importer flash.text.StyleSheet; importere flash.events.SecurityErrorEvent; importer flash.events.IOErrorEvent; importere flash.events.Event; importer flash.events.EventDispatcher; offentlig klasse CSS strekker EventDispatcher private var loader: URLLoader; offentlig var ark: StyleSheet; offentlig funksjon CSS (): void loader = ny URLLoader;  offentlige funksjonsbelastning (_req: String): void loader.load (ny URLRequest (_req)); loader.addEventListener (SecurityErrorEvent.SECURITY_ERROR, secError); loader.addEventListener (IOErrorEvent.IO_ERROR, ioError); loader.addEventListener (Event.COMPLETE, lastet);  privat funksjon ioError (e: IOErrorEvent): void dispatchEvent (ny hendelse ("CSS_IOError"));  privat funksjon secError (e: SecurityErrorEvent): void dispatchEvent (ny hendelse ("CSS_SecurityError"));  privat funksjon lastet (e: hendelse): void prøv sheet = new StyleSheet (); sheet.parseCSS (loader.data); dispatchEvent (ny hendelse ("CSS_Loaded"));  fangst (e: Feil) dispatchEvent (ny hendelse ("CSS_ParseError")); 

    Trinn 13 - Opprette XMLLoader

    Vi starter vår XMLLoader-klasse med "pakke keremk " og den vil utvide "EventDispatcher" også.

     pakke keremk // XMLLoader er i keremk mappe. offentlig klasse XMLLoader utvider EventDispatcher offentlig funksjon XMLLoader () loader = ny URLLoader; // når en XMLLoader er opprettet, vil ny loader bli definert. 

    Trinn 14 - XMLLoader: Importerer Flash Classes

    Vi trenger de samme klassene som vi gjorde for CSS uten klassen "StyleSheet". De er som følger:

     importer flash.events.SecurityErrorEvent; // Eventklasser for å lytte og sende. importer flash.events.IOErrorEvent; importere flash.events.Event; importer flash.events.EventDispatcher; importer flash.net.URLLoader; // nettklasser for å laste xml-filer. importere flash.net.URLRequest;

    Trinn 15 - XMLLoader: Variabler

    Vi trenger nå 5 variabler:

     privat var loader: URLLoader; // for å laste XML-filen private var data: XML; // for å holde XML-fildata for å analysere den. privat var jeg: uint; // motsetning til bruk i parsing. privat var lenXML: uint; // for å sjekke hvor mange sider det finnes i XML. offentlige var-sider: Array = []; // for å holde sider etter analyse av XML-en.

    Trinn 16 - XMLLoader: Lastfunksjon

    Funksjonen "last" vil være den samme som med "CSS.load". Vi bruker den fra hovedklassen, og den bør også være offentlig.

    offentlig funksjonsbelastning (_req: String): void // funksjonen vil laste filen for hvilken sti som er gitt. loader.load (ny URLRequest (_req)); // banen skal transformeres til en URLRequest for å laste filen. loader.addEventListener (SecurityErrorEvent.SECURITY_ERROR, secError); // Vi lytter til 3 hendelser for å overføre til hovedklassen. loader.addEventListener (IOErrorEvent.IO_ERROR, ioError); loader.addEventListener (Event.COMPLETE, lastet); 

    Trinn 17 - XMLLoader: Event Handlers og Dispatchers

    Vi har lagt til 3 hendelseslyttere til loader, Security Error, IO Error og Complete. En av dem vil bli sendt til slutt. Når det er skjedd, må vi overføre det til hovedklassen ved å lytte og sende. Vi bør også sjekke om det er noe problem når du analyserer XML-filen etter "Fullfør" -hendelsen. Det kan være to forskjellige hendelser å sende: "XML_Loaded" eller "XML_ParseError". Vi sjekker det ved å bruke "prøve fange".

     privat funksjon ioError (e: IOErrorEvent): void // Når IO-feil oppstår, sendEvent (ny hendelse ("XML_IOError")); // denne linjen sender "XML_IOError".  privat funksjon secError (e: SecurityErrorEvent): void // Når det er et sikkerhetsproblem, sendesEvent (ny hendelse ("XML_SecurityError")); // denne linjen sender "XML_SecurityError".  privat funksjon lastet (e: Event): void // Hvis du laster filen er ferdig, prøv // prøve å analysere den. data = ny XML (loader.data); // tar XML-data til "data" lenXML = data.children (). lengde (); // sjekker nummeret på sidene for (i = 0; i < lenXML; i++) //parses XML data to array pages.push(data.children()[i]);  dispatchEvent(new Event("XML_Loaded"));//if parsing the XML is OK, dispatch "XML_Loaded".  catch (e:Error)  dispatchEvent(new Event("XML_ParseError"));//if something is wrong with XML data, this line dispatches "XML_ParseError".  

    Med håndtere og dispatchere er vår XMLLoader-klasse ferdig. Her er den ferdige XMLLoader:

    pakke keremk import flash.events.SecurityErrorEvent; importer flash.events.IOErrorEvent; importere flash.events.Event; importer flash.events.EventDispatcher; importer flash.net.URLLoader; importere flash.net.URLRequest; offentlig klasse XMLLoader utvider EventDispatcher privat var loader: URLLoader; private var data: XML; privat var jeg: uint; privat var lenXML: uint; offentlige var-sider: Array = []; offentlig funksjon XMLLoader () loader = ny URLLoader;  offentlige funksjonsbelastning (_req: String): void loader.load (ny URLRequest (_req)); loader.addEventListener (SecurityErrorEvent.SECURITY_ERROR, secError); loader.addEventListener (IOErrorEvent.IO_ERROR, ioError); loader.addEventListener (Event.COMPLETE, lastet);  privat funksjon ioError (e: Event): void dispatchEvent (ny hendelse ("XML_IOError"));  privat funksjon secError (e: Event): void dispatchEvent (ny hendelse ("XML_SecurityError"));  Privat funksjon lastet (e: Event): void prøv data = new XML (loader.data); lenXML = data.children (). lengde (); for (i = 0; i < lenXML; i++)  pages.push(data.children()[i]);  dispatchEvent(new Event("XML_Loaded"));  catch (e:Error)  dispatchEvent(new Event("XML_ParseError"));    

    Trinn 18 - Opprette hovedklassen

    Siden hovedklassen vil være i prosjektets rotmappe, begynner vi å skrive den med "pakke ". Det vil utvide "sprite" og vi starter vår kode i "Main" -funksjonen:

     pakke // inngangspunkt for import. offentlig klasse Main utvider Sprite // inngangspunkt for vars. offentlig funksjon Main (): void // inngangspunkt for koder.  // inngangspunkt for tilleggsfunksjoner. 

    Trinn 19 - Hoved: Importerer Flash-klasser

     importere flash.display.Sprite; // Hovedklassen vil utvide "Sprite" .Så, vi trenger "Sprite" -klassen. importer flash.display.StageAlign; // Vi trenger "StageAlign" for å justere scenen. importer flash.display.StageScaleMode; // Vi trenger "StageScaleMode" for å administrere skala modus av scenen. importere flash.events.Event; // Vi trenger klassen "Event" for å bruke hendelser som vi har opprettet i "XMLLoader" og "CSS" klasser. importere flash.events.TextEvent; // Vi trenger "TextEvent" for å bruke sidelinkene i "htmlText". importere flash.text.TextField; // Vi lager en "TextField" for å vise HTML-sider og legge til vår css til den med "TextFormat" import flash.text.TextFormat; import keremk.CSS; // Og i den "Main" -klassen bruker vi våre "CSS" og "XMLloader" -klasser som vi har opprettet tidligere. importere keremk.XMLLoader;

    Trinn 20 - Hoved: Variabler

     private var xml: XMLLoader; // dette vil holde XML-data privat var css: CSS; // dette vil holde vårt PrivateSheet-data private var-felt: TextField; // vi bruker dette til å vise våre HTML-sider private var cssBool: Boolean = false; // disse to booleanene vil fortelle oss om våre CSS- og XML-filer er lastet private var xmlBool: Boolean = false; private var stgW: Number = stage.stageWidth; // disse to kontrollerer trinnets høyde og bredde. private var stgH: Number = stage.stageHeight; // slik at vi kan endre vår HTML-boks bredde og høyde fra html-filen. privat var pageNum: int = 0; // dette vil definere siden vi viser i HTML-boksen. (Siden arrayindeksen starter fra 0, er sidenNum 0) privat var boxBorder: Sprite; // dette vil være grensen til vår HTML-bok. Vi kan aktivere grensen på TextField, men på denne måten kan vi styre margene.

    Trinn 21 - Hoved: Hovedfunksjon

    Hovedfunksjonen vil bli utført automatisk når vi starter HtmlBox. Vi må derfor skrive starterkoder i denne funksjonen.

    offentlig funksjon Main (): void stage.align = StageAlign.TOP_LEFT; // Disse to linjene er valgfrie. Jeg vil helst holde scenen rettet opp til venstre og nonscaled. stage.scaleMode = StageScaleMode.NO_SCALE; boxBorder = new Sprite (); // Dette er vår grense for htmlbox. I utgangspunktet er det et ufylt rektangel. Og vi lager en ny Sprite for å tegne den. boxBorder.graphics.lineStyle (2, 0xC0C0C0, 1); // thicknes = 2px, farge = 0xC0C0C0 (grå), alfa = 1 (100%). Du kan endre disse verdiene som du ønsker. boxBorder.graphics.drawRect (5, 5, stgW - 10, stgH - 10); // margin = 5. Det er avstanden mellom grensen og scenen. addChild (boxBorder); // etter at vi har opprettet og tegnet grensen vår, må vi legge den til scenen. field = new TextField (); // Vi lager en ny TextField for å vise HTML-sider. addChild (field); // siden det er mange egenskaper å definere, legger vi til felt til scenen først. med (felt) // etter at vi legger til "feltet" til scenen, kan vi bruke "med" for å definere egenskapene. x = 10; // Jeg har definert x og y som 10 for å lage en 5px mellom felt og kantlinje. y = 10; width = stgW-20; // Og bredden skal være stgW-20. Fordi, hvis vi ønsker å lage en 10px avstand mellom felt og scene, må bredden på feltet være 20px (10px fra venstre + 10px fra høyre) kortere enn scenens bredde. height = stgH-20; // Og vi skal beregne høyden som bredden. multiline = true; // Feltet må være multilint. Fordi våre html-tekster er multiline. selectable = false; // Hvis du vil gjøre teksten din valgbar, kan du endre dette til "true". wordWrap = true; // Without "wordWrap" våre avsnitt vil være enkeltlinjer. condenseWhite = true; // Dette er en viktig egenskap som gjør at teksten ser bedre ut. Uten dette vil det være flere mellomrom i overalt i HTML-teksten.  // Etter at vi har opprettet grensen og tekstfeltet, kan vi laste inn våre filer. xml = ny XMLLoader (); // Vi lager en ny XMLLoader xml.load ("source.xml"); // og laster inn vår XML-fil. // Vi må lytte etter hendelser for å vite hva de skal gjøre neste. xml.addEventListener ("XML_Loaded", xmlDone); // Hvis vi fanger "XML_Loaded", fortsetter vi å lage HTML-boks. xml.addEventListener ("XML_IOError", feil); // Jeg lager bare en funksjon for alle feil. xml.addEventListener ("XML_SecurityError", feil); // Så alle feil hendelser vil gå til denne "feil" -funksjonen xml.addEventListener ("XML_ParseError", feil); css = nytt CSS (); // Vi lager en ny CSS css.load ("styles.css"); // og laster inn vår CSS-fil. // css hendelser er ganske de samme med xml hendelsene. css.addEventListener ("CSS_Loaded", cssDone); // Hvis vi fanger "CSS_Loaded", fortsetter vi å lage HTML-boks. css.addEventListener ("CSS_IOError", feil); // Og alle feilhendelser går også til "feil" -funksjonen. css.addEventListener ("CSS_SecurityError", feil); css.addEventListener ("CSS_ParseError", feil); 

    Trinn 22 - Hoved: "Feil" Funksjon

    Siden alle feilene går til "feil" -funksjonen, må vi ordne dem med "byttesett". Vi kontrollerer hvilken feil som oppstod, og skriv den nødvendige teksten til "feltet". I dette trinnet viser jeg bare to feil. Du får se alle feilene i den ferdige hovedklassen i trinn 25

     privat funksjonsfeil (e: Event): void switch (e.type) // Vi skal sjekke typen feilen som oppstod tilfelle "XML_IOError": // Hvis feilen er "XML_IOError", skriver vi nødvendig tekst om "XML_IOError" til "field". field.htmlText = '


    XML IO ERROR
    Vennligst kontroller XML-banen din!

    'break; // Hvis feilen er "XML_IOError", bryter vi operasjonen og stopper "switch case". tilfelle "XML_SecurityError": field.htmlText = '


    XML SECURITY ERROR
    Vennligst kontroller dine policyfiler!

    ' gå i stykker;

    Trinn 23 - Hoved: "Ferdig" Funksjoner

    Vi lager tre "Ferdig" -funksjoner. "xmlDone", "cssDone" og "allDone". "xmlDone" og "cssDone" vil bli utført etter at våre filer er lastet inn, og de vil informere "allDone". Når både css og xml-filer er lastet, vil "allDone" legge StyleSheet til "field" og skrive den første siden.

     privat funksjon cssDone (e: Event): void cssBool = true; // Vi lager cssBool "true". Fordi CSS-filen er lastet inn. allDone (); // Og utfør allDone.  privat funksjon xmlDone (e: Event): void xmlBool = true; // Vi lager xmlBool "true". Fordi XML-filen er lastet inn. allDone (); // Og utfør allDone.  privat funksjon allDone (): void if (cssBool && xmlBool) // hvis både css og xml filer er lastet vellykket, field.styleSheet = css.sheet; // vi stiller våre stiler til "field". field.htmlText = xml.pages [pageNum]; // vi skriver den første siden til feltet. addEventListener (TextEvent.LINK, textEvent); // Og vi legger til hendelselytter for linkhendelser som sendes av htmlText. 

    Trinn 24 - Hoved: "textEvent" -funksjon

    I denne funksjonen vil vi se etter "neste" og "tidligere" hendelsetekster.

     privat funksjon textEvent (e: TextEvent): void if (e.text == "next") // Hvis "neste" lenke klikkes, ++ pageNum; // vi vil øke sidenNum field.htmlText = xml .pages [pageNum]; // og skriv den nye siden til "field".  hvis (e.text == "prev") // Hvis "prev" -linken klikkes, --pageNum; // vi vil redusere sidenNum field.htmlText = xml.pages [pageNum]; // og skriv den nye siden til "feltet". 

    Trinn 25 - Hoved: Ferdig

    Her er den ferdige hovedklassen:

     pakke import flash.display.Sprite; importer flash.display.StageAlign; importer flash.display.StageScaleMode; importere flash.events.Event; importer flash.events.TextEvent; importer flash.text.TextField; importer flash.text.TextFormat; importere keremk.CSS; importere keremk.XMLLoader; offentlig klasse Hoved utvider Sprite private var xml: XMLLoader; privat var css: CSS; privat var-felt: TextField; private var cssBool: Boolean = false; privat var xmlBool: Boolean = false; private var stgW: Nummer = scene.stageWidth; privat var stgH: Number = stage.stageHeight; privat var sideNum: int = 0; private var boxBorder: Sprite; offentlig funksjon Main (): void stage.align = StageAlign.TOP_LEFT; stage.scaleMode = StageScaleMode.NO_SCALE; boxBorder = new Sprite (); boxBorder.graphics.lineStyle (2, 0xC0C0C0, 1); boxBorder.graphics.drawRect (5, 5, stgW - 10, stgH - 10); addChild (boxBorder); felt = nytt TextField (); addChild (felt); med (felt) x = 10; y = 10; bredde = stgW-20; høyde = stgH-20; multiline = sant; selectable = false; wordWrap = true; condenseWhite = true;  xml = ny XMLLoader (); xml.load ( "source.xml"); xml.addEventListener ("XML_Loaded", xmlDone); xml.addEventListener ("XML_IOError", feil); xml.addEventListener ("XML_SecurityError", feil); xml.addEventListener ("XML_ParseError", feil); css = nytt CSS (); css.load ( "styles.css"); css.addEventListener ("CSS_Loaded", cssDone); css.addEventListener ("CSS_IOError", feil); css.addEventListener ("CSS_SecurityError", feil); css.addEventListener ("CSS_ParseError", feil);  privatfunksjonsfeil (e: hendelse): void switch (e.type) tilfelle "XML_IOError": field.htmlText = '


    XML IO ERROR
    Vennligst kontroller XML-banen din!

    ' gå i stykker; tilfelle "XML_SecurityError": field.htmlText = '


    XML SECURITY ERROR
    Vennligst kontroller dine policyfiler!

    ' gå i stykker; tilfelle "XML_ParseError": field.htmlText = '


    XML PARSE ERROR
    Vennligst feilsøk XML-filen din!

    ' gå i stykker; tilfelle "CSS_IOError": field.htmlText = '


    CSS IO FEIL
    Vennligst kontroller CSS-banen din!

    ' gå i stykker; tilfelle "CSS_SecurityError": field.htmlText = '


    CSS SECURITY ERROR
    Vennligst kontroller dine policyfiler!

    ' gå i stykker; tilfelle "CSS_ParseError": field.htmlText = '


    CSS PARSE ERROR
    Vennligst feilsøk CSS-filen din!

    ' gå i stykker; privat funksjon cssDone (e: Event): void cssBool = true; ferdig(); privat funksjon xmlDone (e: Event): void xmlBool = true; ferdig(); privat funksjon allDone (): void if (cssBool && xmlBool) field.styleSheet = css.sheet; field.htmlText = xml.pages [pageNum]; addEventListener (TextEvent.LINK, textEvent); privat funksjon textEvent (e: TextEvent): void if (e.text == "next") ++ pageNum; field.htmlText = xml.pages [pageNum]; hvis (e.text == "prev") --pageNum; field.htmlText = xml.pages [pageNum];

    Trinn 26 - Kompilere i FlashDevelop

    Vi har skrevet koden vår, nå er det på tide å kompilere det. Hvis du har opprettet prosjektet ditt i FlashDevelop, trenger du bare å trykke "F5" for å sjekke det og "F8" for å bygge prosjektet. Før det kan du endre innstillingene for utdata. For å gjøre det, gå til Prosjekt> Egenskaper ...

    I egenskapspanelet kan du endre:

    • "Target" -> Flash Player versjon
    • "Output-fil" -> Utgang filnavn og bane (Vår fil filbane er "bin /")
    • "Dimensjoner" -> Bredde og høyde på utdatafilen
    • "Bakgrunnsfarge" -> Bakgrunnsfarge på utdatafilen (jeg har brukt svart "# 000000")
    • "Framerate" -> Framerate av utdatafilen (Siden det ikke er noen ramme i prosjektet, har jeg brukt 30fps som standard.)
    • "Test Movie" -> Slik spiller du testfilmen når du trykker på "F5"

    Etter "Build Project" -operasjonen kan du bruke htmlBox fra bin-mappen. Hvis du planlegger å flytte den til en annen mappe, må du flytte "htmlBox.swf", "source.xml" og "styles.css" -filene til samme mappe. Hvis du planlegger å bruke "index.html", trenger du hele katalogen "bin". Som standard vil htmlBox-dimensjoner være 100% i "index.html". Du kan endre dette i "swfobject.embedSWF ();" fungere i "index.html".

    Trinn 27 - Kompilering i Flash IDE

    Hvis du bruker Flash CS3 eller CS4, åpner du "htmlBox.fla" -filen. I egenskapsvinduet, skriv "Hoved" i "Klasse" -boksen. Du kan også endre "Rammehastighet", "Størrelse" og "Bakgrunnsfarge" av htmlBox i egenskapsvinduet.

    Etter at du har definert "Dokumentklasse", kan du teste den ved å trykke "Ctrl + Enter" og publisere den ved å trykke "Ctrl + F12". Hvis du vil endre publiseringsinnstillingene (for eksempel versjon), kan du åpne publiseringsinnstillinger ved å trykke "Ctrl + Shift + F12" eller ved å gå til Arkiv> Publiser innstillinger ...

    Igjen, hvis du planlegger å flytte den til en annen mappe, må du flytte "htmlBox.swf", "source.xml" og "styles.css" -filene til samme mappe. Hvis du planlegger å bruke "index.html", må du ha filen "AC_RunActiveContent.js" i samme katalog. Som standard vil htmlBox dimensjoner være det samme med swf-filen i "index.html". Du kan endre den i html-filen, eller du kan bruke "HTML" -fanen i "Publiser innstillinger".

    Konklusjon

    Vi er ferdige! Du kan bruke denne html-boksen i webmaler, for tekst som du ikke ønsker å bli kopiert eller noe prosjekt du kan forestille deg. Takk for at du leser denne opplæringen, håper jeg du likte det.