Quick Innledning: Flash NumericStepper, Slider og ProgressBar Components
3
Del
to
Del
Dette Cyber mandag Envato Tuts + kurs vil bli redusert til bare $ 3. Ikke gå glipp av.
Disse tre komponentene all avtale med tall i serier. I denne hurtig Tips vil vi se på hvordan du bruker dem
Den numeriske stepper lar deg sette et tall innenfor en viss rekkevidde ved hjelp av tastaturet eller ved å klikke piltastene.; glidebryteren kan du dra en tommel for å plukke et tall fra et utvalg på en mer grafisk måte, og fremdriftslinjen viser hvor langt gjennom en rekke et visst antall er.
Forhåndsvisning
< p> I forhåndsvisnings SWF ser du to etiketter, to NumericSteppers, to knapper, en blå sirkel og en Slider. De NumericSteppers brukes til å stille inn en rekke tall som vi vil generere et tilfeldig tall mellom. Når knappen klikkes Label vil endres for å vise tilfeldig tall som var generated.The Slider brukes til å endre størrelsen på sirkelen; . dra glidebryteren til høyre øker Circle størrelse, mens du drar Venstre reduserer Circle størrelse
Den andre knappen brukes til å laste inn en SWF; trykk på knappen og en ProgressBar legges til scenen for å vise Loading Progress. Når Loader laster innholdet det er lagt til scenen og ProgressBar fjernes
Trinn 1:. Klardokument
Åpne en ny Flash dokument og angi følgende egenskaper
Dokumentstørrelse: 550 * 360
Bakgrunnsfarge: #FFFFFF
Trinn 2: Legg Komponenter til scenen
< p> Åpne komponenter vinduet ved å gå til Meny > Vindu > Komponenter eller trykke CTRL + F7.
Drag to knapper, to etiketter, to Numeric Step, og en Slider til scenen.
I Egenskaper-panelet gir den første etiketten forekomstnavnet "StepperLabel "
(Hvis Properties panelet ikke vises gå til Meny > Vindu > komponenter eller trykk CTRL + F3)
Sett etikettens X til 19 og dens Y til 9.
Ved hjelp av panelet Egenskaper:
Gi andre etiketten forekomstnavnet "sliderLabel" X: 19 Y: 140
Gi den første NumericStepper forekomstnavnet "fromStepper "X: 19 Y: 144
Gi andre NumericStepper forekomstnavnet" toStepper "x: 130, Y: 44
Gi Slider forekomstnavnet" slider "X: 19, Y: 223
Gi den første Button forekomstnavnet "randomNumButton" X: 60, Y: 82
Gi andre Button forekomstnavnet "loaderButton
Tegn en blå sirkel med oval verktøy (hold shift vil dra for å gjøre det i samsvar med en sirkel) og konvertere den til en MovieClip ved å velge den, høyreklikke og deretter velge "Konverter til Symbol". Gi den en forekomst navnet "theCircle"
Trinn 3:. Klar AS Fil og Importere klassene
Opprett en ny Actionscript-fil og gi den navnet Main.as
Vi vil erklære våre komponenter i Main.as så vi må slå av "auto erklære scenen forekomster". . Fordelen med dette er at du får kode antydet for eksempel
Gå til Meny > Fil > Publish Settings Klikk på Innstillinger Fjern haken ved «automatisk erklære scene forekomster" Anmeldelser I Main.as åpne pakken erklæringen og importere klassene vi skal bruke. Legg til følgende i Main.as. La oss legge klassen, gjør det utvide filmklipp, og sette opp vår konstruktør funksjon Legg følgende til Main.as: Her kan vi definere funksjonene som brukes i vår konstruktør I setupLabels () -funksjonen vi gjøre noen grunnleggende oppsett på våre etiketter. ved hjelp autoSize slik at hver etikett vil automatisk endre størrelsen til å holde all tekst sendes til det. I setupSteppers () I setupButtons () vi legge vår tekst til knappene via etiketten eiendom og legge hendelsen lyttere til knappene. I setupSliders () vi sette minimum og maksimum for glidere enes verdier. Den snapInterval bestemmer hvor mye den glideren sin verdiendringer når du drar; her bruker vi 0,1. Den liveDragging er satt til true, slik at verdien av glideren er tilgjengelig mens du drar - Hvis dette ble satt til false ville vi ikke være i stand til å få verdien inntil brukeren sluttet å dra. Til slutt legger vi en lytter til glidebryteren Legg til følgende Main.as: Her kan vi legge de resterende funksjonene I getrandomNumber () -funksjonen vi ringe en annen funksjon, generateRandomNumber (), som er fra en tutorial her på Activetuts + av Carlos Yanez. Gå videre og sjekke ut at opplæringen for å se hvordan dette fungerer! scaleCircle () -funksjonen får verdien av glideren og setter scaleX og Scaley av theCircle MovieClip. Den scaleX og Scaley brukes til å endre størrelsen (skala) av filmklipp. loadSwf () -funksjonen setter opp et Loader som vi bruker til å laste en ekstern SWF. Vi deretter legge en hendelse lytteren til Loader er contentLoaderInfo; den contentLoaderInfo inneholder informasjon om hva loader laster (her, en SWF). Vi deretter sette opp en ProgressBar og legge den til på scenen. Vi setter ProgressBar kilde til Home contentLoaderInfo av Loader, og siden contentInfoLoader inneholder informasjon om hva loader laster (inkludert bytesLoaded og bytesTotal) dette er hvordan ProgressBar kan oppdatere seg selv å reflektere hvor mye av SWF har ladd. finishedLoading () funksjonen setter x- og y-posisjonen til Loader innhold (dvs. SWF) og deretter legger det til scenen. På dette punktet er vi ferdig med ProgressBar, så fjerner vi det danner scenen Så vi lukke ut klassen og pakken Igjen bruker komponenter er en flott måte å legge til funksjonalitet i Flash-filmer uten å måtte bygge dem fra scratch Du vil merke i komponenter Parametere panel av komponentene som du kan sjekke og velger visse egenskaper. Bildet over er for NumericStepper komponent Eiendommene er som følger for NumericStepper komponent: Egenskapene for Slider er som følger egenskaper for ProgressBar er som følger For å se egenskapene for etikettene og knapper kan du sjekk ut Quick Tips på etiketter og knapper. Hjelpefilene er også et flott sted å lære mer om komponentegenskaper du kan stille inn i parameterpanelet. Takk for lesing og være på utkikk etter mer kommende komponent introduksjoner!
ved siden av Script [Actionscript 3]
pakken {//Våre scenen componets import fl.controls. NumericStepper; import fl.controls.Slider; import fl.controls.ProgressBar; import fl.controls.Label; import fl.controls.Button; //Trengs for å forlenge Class import flash.display.MovieClip; //Nødvendig å autosize vår Etikett Tekst import flash.text.TextFieldAutoSize; //Hendelsene we'l trenger i dette prosjektet import flash.events.MouseEvent; import flash.events.Event; import fl.events.SliderEvent; import flash.events.ProgressEvent; //Trengs for å laste SWF-fil import flash.net.URLRequest; import flash.display.Loader;
Trinn 4:. Sett opp hoved Class
public class Hoved strekker MovieClip {public Var StepperLabel: Etikett; offentlig Var sliderLabel: Etikett; offentlig Var fromStepper: NumericStepper; offentlig Var toStepper: NumericStepper; offentlig Var randomNumButton: Button; offentlig Var loaderButton: Button; offentlig Var slider: Slider; offentlig Var progressbar: ProgressBar; offentlig Var theLoader: Loader; offentlig Var theCircle: Circle; offentlig funksjon main () {setupLabels (); setupSteppers (); setupButtons (); setupSlider (); }
Trinn 5: Hoved Constructor Funksjoner
funksjon vi setter opp våre Step '"minimum" og "maksimal" egenskaper. Disse brukes til å begrense antallet tilgjengelige i stepper. Vi bruker ikke en hendelse lytteren med glidere her (selv om du kan bruke Event.CHANGE at kontrollene oppdage når deres verdi er endret).
private funksjons setupLabels (): void {StepperLabel.text = "Klikk knappen for en Random Number";. //Autosizes etiketten for å holde all teksten StepperLabel.autoSize = StepperLabel.autoSize = TextFieldAutoSize.LEFT; sliderLabel.text = "Dra glidebryteren for å endre Circle Size"; //Autosizes etiketten for å holde all teksten sliderLabel.autoSize = sliderLabel.autoSize = TextFieldAutoSize.LEFT;} private funksjons setupSteppers (): void {//Minimal verdier av Step fromStepper.minimum = 0; toStepper.minimum = 1; //Maksimumsverdiene for Step fromStepper.maximum = 99; toStepper.maximum = 100; //Sett Step verdi her fromStepper.value = 0; toStepper.value = 45;} private funksjons setupButtons (): void {randomNumButton.label = "Klikk"; randomNumButton.addEventListener (MouseEvent.CLICK, getrandomNumer); loaderButton.label = "Load SWF"; loaderButton.addEventListener (MouseEvent.CLICK, loadSwf);} private funksjon setupSlider (): void {//Minimum og maksimumsverdier for glidebryteren slider.minimum = 1; slider.maximum = 3; //Dette angi hvor mye de slider "trinn" av slider.snapInterval = 0,1; //liveDragging betyr Step verdi er tilgjengelige mens du drar //hvis satt til false vi ikke ikke få verdien til vi stoppet å dra slider.liveDragging = true; slider.addEventListener (SliderEvent.CHANGE, scaleCircle);.}
Trinn 6 Tilsett Tilfeldige funksjoner
privat funksjon getrandomNumer (e: Hendelses):.. Void {//Her passerer vi i to tall (de Step verdier) generateRandomNumber (fromStepper.value, toStepper.value); } Private funksjon generateRandomNumber (minNum: Antall, maxNum: Number): void {//Holder generert nummer Var randomNumber = (Math.floor (Math.random () * (maxNum - minNum + 1)) + minNum); //Her har vi kastet tilfeldig tall til en streng, slik at vi kan bruke det i etikettene teksten StepperLabel.text = "Din tilfeldig tall er" + String (randomNumber); } Private funksjon scaleCircle (e: Hendelses): void {//scaleX og Scaley øke eller redusere en MovieClip størrelse //her vi bruker verdien for glideren fra "1-3" theCircle.scaleX = e.target.value; theCircle.scaleY = e.target.value; } Private funksjon loadSwf (e: Hendelses): void {theLoader = new Loader (); theLoader.x = 319,00; theLoader.y = 31.00; theLoader.load (ny URLRequest ("dummy.swf")); //Her får vi lasteren contentLoaderInfo som er hva loader //laster (her en swf) theLoader.contentLoaderInfo.addEventListener (Event.COMPLETE, finishedLoading); progressbar = new ProgressBar (); progressBar.x = 323; progressBar.y = 244; addChild (progressbar); //Fremdriftsindikatoren kilde er satt til lasterens contentLoaderInfo //contentLoaderInfo holder informasjon om SWF sin bytesLoaded /bytesTotal progressBar.source = theLoader.contentLoaderInfo; } Offentlig funksjon finishedLoading (e: Hendelses): void {//Her har vi satt den loader content.x og .Y //IE SWF er .x og .Y theLoader.content.x = 290; theLoader.content.y = 20; //Den vi legge til lastere innhold dvs. swf addChild (theLoader.content); //Siden det loader gjøres lasting vi ikke trenger fremdriftslinjen lenger //Så vi fjerne det removeChild (progressbar); }} //Lukke ut klassen} //lukke pakken
Konklusjon
aktivert: en boolsk verdi som angir om komponenten kan godta brukerundersøkelser
maksimalt. maksimumsverdien i sekvensen av numeriske verdier
minimum. minimumsverdien i sekvensen av numeriske verdier
skrittlengde. nonzero tall som beskriver enheten av endring mellom verdier
verdi: den nåværende verdien av NumericStepper komponent.
synlig: en boolsk verdi som angir om komponentforekomst er synlig
retning: retning av glidebryteren. Akseptable verdier er SliderDirection.HORIZONTAL og SliderDirection.VERTICAL
aktivert. En boolsk verdi som angir om komponenten kan godta brukerundersøkelser
maksimalt. Den maksimale tillatte verdien på Slider komponentforekomst
minimum. Minste tillatte verdien på Slider komponentforekomst
snapInterval: tilvekst av hvor verdien økes eller reduseres som brukeren flytter glidebryteren tommelen.
tickInterval: avstand av flåtten markerer i forhold til den maksimale verdien av komponenten.
verdi: den nåværende verdien av Slider komponent
synlig. en boolsk verdi som angir om komponentforekomst er synlige
retning: Angir fyllet retning for fremdriftslinjen. En verdi på ProgressBarDirection.RIGHT indikerer at fremdriftslinjen er fylt fra venstre mot høyre. En verdi på ProgressBarDirection.LEFT indikerer at fremdriftslinjen er fylt fra høyre til venstre
aktivert. En boolsk verdi som angir om komponenten kan godta brukerundersøkelser
modus: får eller setter metode som skal brukes til å oppdatere fremdriftslinjen. Disse verdiene er gyldige for denne eiendommen: ProgressBarMode.EVENT, ProgressBarMode.POLLED, ProgressBarMode.MANUAL
kilde: en referanse til innholdet som blir lastet og hvor ProgressBar måler fremdriften av lasten drift .
synlig: en boolsk verdi som angir om komponentforekomst er synlig