Create en Glowing Mouse Trailer i Flash
Del
Del
Del
Del
Dette Cyber ​​mandag Envato Tuts + kurs vil bli redusert til bare $ 3. Ikke gå glipp av.

Mus Tilhengere er objekter som følger musepekeren når du flytter den. I denne opplæringen, vil jeg hjelpe deg å lage en blå og blank mus trailer ved hjelp av Actionscript 3.0.

Endelig resultat Forhåndsvisning

La oss ta en titt på endelige resultatet vi skal jobbe mot:

Trinn 1: Kort oversikt

Ved hjelp av Action vi vil duplisere en MovieClip deretter endre sine alfa, skala, og posisjons egenskaper for å få en fin trailer effekt.

Trinn 2:. Starte

Åpne Flash og skape en ny Flash-fil (Actionscript 3)

Sett scenen størrelsen til ønsket oppløsning og legge til en bakgrunnsfarge. Jeg har brukt 600x300 i størrelse og lagt en blå radial gradient (# 4584D4, # 184D8F). Også har jeg lagt en svart firkant med 60% alfa og tekst for å vise en instruksjonsmelding. La oss ta en titt på bildet

Trinn 3:.. Opprette hoved Shape

Denne traileren er sammensatt av en enkel form som er duplisert og skalert når du beveger musen
< p> Velg Oval Tool, tegne en 6x6 px sirkel og fyll den med en radial gradient (#FFFFFF, # 5CFAFF).

Konverter denne formen til en MovieClip legge en Glow filter, bruke verdiene i følgende image:

Konverter dette til en MovieClip og gi den navnet "Lightball", må du huske å sjekke "Export for Action" alternativet

Trinn 4:. Action

Opprett en ny Action File (Command + N) og lagre den som "MouseTrailer.as»

Trinn 5: Import Nødvendige Classes

Dette er de klassene vi trenger, hvis du trenger spesifikk hjelp med noe av dem kan du se Flash hjelp (F1)
pakke {import flash.display.Sprite.; import flash.ui.Mouse; import flash.events.MouseEvent; import flash.events.Event;
Trinn 6: Mouse Trailer Class

Vi utvider Sprite klasse å få tilgang til addChild () -metoden. Husk at navnet på klassen må være den samme som filnavnet
public class MouseTrailer strekker Sprite {
Trinn 7:. Variabler

Det er bare én variabel i denne klassen, Lightball variable . Dette brukes til å opprette en ny forekomst av Lightball som vi opprettet i Fla
Var Lightball. Lightball;
Trinn 8: Constructor

I konstruktør-funksjonen vil vi legge til linjene som skjule musepekeren og lytteren som vil starte Trailer
offentlig funksjon MouseTrailer (): void {Mouse.hide ();. stage.addEventListener (MouseEvent.MOUSE_MOVE, startTrailer);}
Trinn 9:. Begynn Trailer Funksjon

Denne funksjonen vil håndtere trailer, sette sine egenskaper
privat funksjon startTrailer (e: MouseEvent): . void {
Trinn 10: dupliserer Lightball

Denne koden oppretter en ny Lightball når musen beveges Twitter /* Lag en ny Lightball objekt * /Lightball = new Lightball ();
Trinn 11:. Posisjon

Den nye Lightball posisjon er basert på bredden og høyden av klippet og posisjonen til musepekeren Twitter /* posisjon * /lightBall.x = mouseX + Math.random () * lightBall.width; lightBall.y = mousey - Math.random () * lightBall.height;
Trinn 12: Legge til Stage

Vi legger til Lightball til scenen med følgende kode: Twitter /* Legg til Stage * /addChild (Lightball); /* Legg List å animere funksjon * /lightBall.addEventListener (Event.ENTER_FRAME, animere);
Trinn 13:. Animer Funksjon

alfa, er skala og vertikal posisjon håndtert i denne funksjonen
privat funksjon animere (e: Hendelses): void {
Trinn 14: Alpha

Den alpha er redusert med 5% hver ramme Twitter /* Alpha * /e.target.alpha - = 0,05.;
Trinn 15: Fjern Invisible Objekter

Når Lightball er ikke lenger synlig (alfa < 0) objektet fjernes Twitter /* Hvis Lightball er ikke lenger synlig, fjerner du det * /. if (e.target.alpha < = 0) {e.target.removeEventListener (Event.ENTER_FRAME, animere); removeChild (e.target som Sprite); }
Trinn 16:. Scale

Omfanget er redusert med 10% hver ramme Twitter /* Scale * /e.target.scaleX - = 0,1; e.target.scaleY - = 0,1;
Trinn 17: Vertikal posisjon Twitter /* Y posisjon * /e.target.y + = 3;}
Trinn 18: Bruke Class

På tide å gå tilbake til Fla.

Velg Egenskaper Panel, legge til "MouseTrailer" som Document klasse og du vil være klar til å teste filmen!

Konklusjon

Nå har du en hyggelig ser Mouse Trailer wich du kan tilpasse slik du vil. Prøv å endre formen på MovieClip, størrelsen, fargen - det er mange alternativer! Jeg håper du likte denne tut, takk for lesing.