Share
I denne opplæringen lager vi en dynamisk regneeffekt ved hjelp av ActionScript 3.0. Effekten kan tilpasses på mange måter ved bare å endre noen linjer med kode. La oss komme i gang!
La oss se på den endelige effekten vi skal jobbe for:
Vi trekker et enkelt regnfall, og deretter bruker vi våre ActionScript-ferdigheter vi kopierer, flytter og plasserer MovieClip for å få en fin regnfull effekt.
Opprett et nytt ActionScript 3-dokument (File> New ...). Sett Stage-størrelsen til de ønskede dimensjonene, jeg har brukt 600 x 300 px.
Legg til eller tegne et bilde som skal brukes som bakgrunn, jeg brukte et endret bilde av JinThai, lisensiert under Creative Commons.
Gi nytt navn til det første laget til "Bakgrunn", og opprett en annen og kaller den "Kode" (vi bruker denne til å plassere ActionScript på). Du kan låse "Kode" laget for å unngå å plassere uønskede tegninger der inne.
Lag en grafikk som skal brukes som regnfall. Sett fargen til hvit og bruk en lineær gradient for alfaen, min er 40 til 15. Konverter den til en MovieClip og navnet "Drop", husk å merke av for "Export for ActionScript".
La oss starte noen kode i en egen ActionScript-fil:
pakke klasser / * Import obligatoriske klasser * / import flash.display.MovieClip; importere flash.events.Event;
Her importerer vi klassene som vi skal bruke. Husk at ordet ved siden av "pakke" er navnet på mappen der vår klasse ligger.
// Vi må forlenge klassen, slik at vi kan bruke addChild () -metoden. offentlig klasse Rain utvider MovieClip
Ved å utvide MovieClip-klassen får vi klassen til å arve alle metodene, egenskapene og funksjonene som MovieClip har. I dette tilfellet bruker vi det for å få tilgang til addChild () -metoden.
Her bruker vi en eksklusiv Flash Player 10 Class "Vector". Enkelt sagt fungerer Vector Class som en Array, men er betydelig raskere.
private var offset: int = 50; // Dette er kompensasjonsområdet i piksler som effekten vil ta. Uten dette vil hjørnene i effektområdet bli regnfri private var dropsNumber: int; // Antall regnfall; dens verdi er satt i parametrene private var dropsVector: Vector.= Ny Vector. (); // Vektoren som lagrer hvert regnfall
offentlig funksjon init (dråper: int, fallSpeed: int, windSpeed: int, hArea: int, vArea: int, dir: String): void dropsNumber = drops;
Hovedfunksjonen, med noen parametere gjør effekten enkel å tilpasse seg dine behov. Du kan endre antall dråper, hastigheten der dråpene faller, hastigheten der dråpene vil bevege seg horisontalt, størrelsen på effektområdet og regnens retning (venstre eller høyre).
Vi angir dropsNumber verdien her.
Som standard er offsetvaren satt til å fungere med venstre side, så vi må sjekke hvor regnet vil gå og endre forskyvningen dersom retningen er riktig.
hvis (dir == "høyre") offset * = -1;
For å vise forskjellige forekomster av Drop MovieClip må vi opprette et nytt Drop Object i en "For" -oppgave:
for (var jeg: int = 0; i < drops; i++) var drop:Drop = new Drop(); drop.fallSpeed=fallSpeed; drop.windSpeed=windSpeed; drop.dir=dir; drop.hArea=hArea; drop.vArea=vArea;
Vi bruker variabelen "dråper" for å få brukerdefinert antall dråper og angi variablene i MovieClip for senere bruk.
Sett en innledende tilfeldig posisjon for Drops.
drop.x = Math.random () * (hArea + offset); drop.y = Math.random () * vArea;
drop.scaleX = Math.round (((Math.random () * 0,8) + 0,3) * 10) / 10; drop.scaleY = drop.scaleX;
Dette setter skalaen til Drops mellom 0,3 og den opprinnelige størrelsen.
dropsVector.push (dråpe); addChild (dråpe); // End of For inTheDirection (); // End of init-funksjonen
Denne koden legger til Drop MovieClip til Vector og deretter til scenen. Den kaller også "retning" -funksjonen.
Accentsconagua
privat funksjon inTheDirection (): void for (var i: int = 0; i < dropsNumber; i++) switch (dropsVector[i].dir) case "left" : dropsVector[i].addEventListener(Event.ENTER_FRAME, moveLeft); break; case "right" : dropsVector[i].scaleX*=-1; //Our Drop was created going to the left, so we flip it to make it look like it's going to the right dropsVector[i].addEventListener(Event.ENTER_FRAME, moveRight); break; default : trace("Error"); I denne funksjonen bruker vi en annen "For" for å få tilgang til MovieClips inne i Vector. Deretter sjekker vi retningsparameteren og legger til en lytter til den tilsvarende funksjonen. Dette vil alle ta vare på bevegelsen og stillingen.
privat funksjon moveLeft (e: Event): void e.target.x- = e.target.windSpeed; e.target.y + = Math.random () * e.target.fallSpeed; hvis (e.target.y> e.target.vArea + e.target.height) e.target.x = Math.random () * (e.target.hArea + (offset * 2)); e.target.y = - e.target.height; privat funksjon moveRight (e: Event): void e.target.x + = e.target.windSpeed; e.target.y + = Math.random () * e.target.fallSpeed; hvis (e.target.y> e.target.vArea + e.target.height) e.target.x = Math.random () * (e.target.hArea - offset * 2) + offset * 2; e.target.y = - e.target.height;
Dette beveger Drops basert på parametrene til hovedfunksjonen. Den tilbakestiller deretter posisjonen når dråper beveger seg utenfor effektområdet.
Det er klassen ferdig, for å gjøre bruk av det, går vi tilbake til Flash IDE, åpner handlingspanelet og skriver:
importere klasser.Rain; var regn: regn = ny regn (); rain.init (200, 50, 5, 600, 300, "left"); addChild (regn);
Dette vil skape et nytt regnobjekt, og ring deretter hovedfunksjonen for å starte effekten. Til slutt legger vi til effekten på scenen.
Husk at du kan spille med parametrene for å få ulike effekter, og at du også kan endre dråpene ved å tegne det du vil. Fortsett å prøve forskjellige kombinasjoner for å få den nøyaktige effekten du vil ha.
Jeg håper du likte å lese tut så mye som jeg skrev det. Takk for at du leste!
