Neste, i symbol du nettopp opprettet, lage en ny firkant av 50x50px

Endre fargen på plassen til # 00CBFF og sentrere det

. Tilbake på scenen, tar noen biter fra biblioteket panel og ordne dem til å lage kolonnene vi vil bruke Du bør slutte med noe sånt som dette:

For hver bit, endre forekomstnavnet på sin . egenskaper panel Gi dem navnene som bildet under viser:

Gå til eiendommer panel og angi klassen feltet til "Main", dette er navnet på den klassen vi skal lage i neste trinn.

(Ikke sikker på hva vi gjør her? Les denne rask innføring dokumentere klasser)

Med scenen ferdig, kan vi nå begynne koding. Først opprette en ny Actionscript 3.0-fil og lagre den som "Main.as"

Legg denne koden til filen.
Pakke {import flash.display.MovieClip; public class Hoved strekker MovieClip {offentlig funksjon main () {}}}

Vi begynner ved å importere de nødvendige klassene. Legg dette under pakken erklæring:..
Import flash.display.MovieClip, import flash.utils.Timer, import flash.events.TimerEvent, import com.greensock *; import com.greensock.easing *;

Deretter vil vi erklære enkelte offentlige variabler. Legg dette under klassen erklæring:
offentlig Var klokke: Timer = new Timer (1000); offentlig Var date: Date = new Date (); offentlig Var hr: int; offentlig Var min: int; offentlig Var sec: int; offentlige Var biter. Array;

Opprette en ny dato objekt setter det automatisk til gjeldende tid

OK så nå la oss legge inn koden som starter klokken. Dette går inne i main () funksjon:
//Med dette gir vi de faktiske verdiene for klokken til hver variablesec=date.getSeconds();min=date.getMinutes();hr=date.getHours();clock.start();clock.addEventListener(TimerEvent.TIMER, fulls);

Dette er funksjonen som vil bli kalt hvert sekund
privat funksjon fulls (e: Timerevent): void {date = new Date (); sek = date.getSeconds (); min = date.getMinutes (); HR = date.getHours ();}

Denne funksjonen vil endre et desimaltall til en binær matrise, som vil bli brukt senere
privat. funksjon dec2bin (dec: int, lengde: int): Array {var bin: Array = new Array (); while ((dec /2) > 0) //oppmerksom på at dette har samme effekt som "while ((dec /2) > = 1)" {bin.push (dec% 2); //desember% 2 er den * resten * når det felles deles på to. 3% 2 = 1; 4% 2 = 0; 5% 2 = 1; 6% 2 = 0; etc. //andre ord felles det% 2 er en hvis DEC er merkelig og 0 hvis DEC er enda. desember = Des /2; //fordi DEC er en int, vil det bli rundet} while (bin.length < lengde) bin.push (0); //dette er bare padding rekken med ekstra nuller tilbake bin;}

Så dec2bin (13, 4) gir [1,1,0,1]

Denne funksjonen tar et desimaltall og bruker dec2bin () for å konvertere den rekken to-kolonne vi har i displayet for bedriften privat funksjon converter. (num: int): Array {var st: String = String (num); if (st.length == 1) st = "0" + st; Var fDigit: int = int (st.charAt (1)); Var sDigit: int = int (st.charAt (0)); Var fColumn: Array = dec2bin (fDigit, 4); Var sColumn: Array = dec2bin (sDigit, 3); Var resultat: Array = fColumn.concat (sColumn); Avkastningen resultat;}

Nå må vi legge til noe som vil slå biter av og på; det er hva denne funksjonen gjør:
//newBits rekken to-kolonne vi får fra converter er (), er target "H" "M" eller "S" for å indikere hvilken kolonne til useprivate funksjons turnBits (newBits: Array, target: String): void {//Loops rekke den 2-kolonne gjennom å endre status for bit for (var en: int = 0; et < newBits.length, en ++) {//Denne sjekker om du prøver nå for å få tilgang element 6 av time kolonner; Husk at H col bare har 5 bits if ((a! = 6) || (target! = "H")) {//hvis det er 0, blir den oppkalt for eksempel eksempel "S0", som vil være den første bit deretter "S1" og så videre if (newBits [a] == 0) this.getChildByName (mål + String (a)) alfa = 0,2.; //det er en, endrer alfa til 1 (Slå den på) ellers this.getChildByName (mål + String (a)) alfa = 1.; }}}

Et par endringer i main () og fulls () Funksjoner: vi trenger bare å kalle funksjonen slik at endringene blir gjort hver andre og i starten:
offentlig funksjon main () {sec = date.getSeconds (); min = date.getMinutes (); HR = date.getHours (); turnBits (Kalkulator (sek), 'S'); turnBits (omformer (min), 'M'); turnBits (omformer (t), 'H'); clock.start (); clock.addEventListener (TimerEvent.TIMER, fulls);} private funksjon fulls (e: Timerevent): void {date = new Date (); sek = date.getSeconds (); min = date.getMinutes (); HR = date.getHours (); turnBits (Kalkulator (sek), 'S'); turnBits (omformer (min), 'M'); turnBits (omformer (t), "H");}

Prøv det ut, og du vil se det på riktig måte vise tiden. Men vi kan gjøre det bedre ...

Trinn 22: A Little Bit of Style

Det er der TweenMax kommer inn Vi vil legge glød og enkelt å gi et bedre utseende til klokken.. Endre turnBits () -funksjonen som så:
private funksjons turnBits (newBits: Array, target: String): void {for (var en: int = 0; et < newBits.length, en ++) {if ((a! = 6) || (target = "H")) {if (newBits [a] == 0) TweenMax.to (this.getChildByName (mål + String (en!)), 1, {glowFilter: {color: 0x00cbff , alfa: 0, blurX: 15, Blury: 15, styrke: 1} alfa: 0,1}); ellers TweenMax.to (this.getChildByName (target + String (a)), 1, {glowFilter: {farge: 0x00cbff, alfa: 1, blurX: 20, Blury: 20, Styrke: 0,8}, alfa: 1}); }}}

Og det er det! Vi har avsluttet vår tutorial =)

Konklusjon

Nå har vi en attraktiv klokke som vi kunne bruke som vår skjermsparer eller legge til en webside.

Dette er mitt første tutorial så jeg håper du likte det. Takk for lesing!