Share
QR-koder er overalt i disse dager: magasinannonser, reklametavler, til og med TV-reklamer. Sjansen er at du har en telefon i lommen som kan lese en QR-kode og dekode nettadressen eller meldingen som finnes i. I denne opplæringen lærer du hvordan du oppretter en SWF som kan reversere prosessen: opprett en QR-kode fra en nettadresse eller en melding. Les videre!
La oss ta en titt på den endelige appen vi skal jobbe for:
Ved å bruke forhåndsdefinerte grafiske elementer vil vi skape et flott grensesnitt som vil bli drevet av flere ActionScript 3-klasser.
Koden vil gjøre god bruk av en QR Code Encoder klasse, laget av Jean-Baptiste Pin.
Åpne Flash og opprett 480 piksler bredt, 480 piksler høyt dokument. Still inn rammefrekvensen til 24fps.
Et fargerikt fint utseende grensesnitt vil bli vist, dette innebærer flere former, knapper og mer.
Enkelte former ble opprettet ved hjelp av Flash-tegneverktøyene, slik at det ikke vil være nødvendig å inkludere skapelsen.
Bildet over viser Instansnavn brukt i movieclips. De som starter med a Stor bokstav er Biblioteksklassenavn og bør ikke være på scenen.
Vi bruker en annen tween-motor fra standarden som følger med i Flash, dette vil øke ytelsen, så vel som å være enklere å bruke.
Du kan laste ned TweenNano fra sitt offisielle nettsted.
Vi vil gjøre bruk av et fantastisk QR Code Encoder bibliotek som kan lastes ned herfra. Du kan lære mer om bruk av eksterne biblioteker i koden din med denne opplæringen.
Redaktørens notat: Bruk SWC-filen, ikke klassene i \ org \ -mappen, for å få de beste resultatene.
Legg klassenavnet til Klasse felt i publisere delen av Eiendommer panel for å knytte FLA til hoveddokumentklassen.
Opprett en ny (Cmd + N) ActionScript 3.0-klasse og lagre den som Main.as i klassemappen din.
Lag din grunnklassestruktur for å begynne å skrive koden din.
pakke import flash.display.Sprite; offentlig klasse Hoved utvider Sprite offentlig funksjon Main (): void // constructor code
Dette er klassene vi må importere for vår klasse for å jobbe, importere Direktivet gir eksternt definerte klasser og pakker tilgjengelig for koden din.
importer flash.display.Sprite; importer flash.events.MouseEvent; importer org.qrcode.QRCode; importer flash.display.Bitmap; importer com.greensock.TweenNano; importer com.greensock.easing.Expo;
Dette er variablene vi skal bruke, les kommentarene i koden for å få vite mer om dem, noen av navnene deres er selvklart, så det blir ingen kommentar der.
private var textView: TextView; privat var smsView: SMSView = ny SMSView (); private var emailView: EmailView = new EmailView (); privat var linkView: LinkView = ny LinkView (); private var lastView: Sprite; privat var currentTarget: String; // nåværende streng for å konvertere privat var qrImg: Bitmap;
Konstruktøren er en funksjon som kjører når et objekt er opprettet fra en klasse, denne koden er den første som skal utføres når du lager en forekomst av et objekt eller kjører ved hjelp av dokumentklassen.
Det kaller de nødvendige funksjonene for å starte appen. Kontroller disse funksjonene i de neste trinnene.
offentlig sluttfunksjon Main (): void addTextView (); addListeners ();
Den første funksjonen som utføres av konstruktøren. Det vil instantiere TextView og legge det til scenen. Dette blir standardvisningen som skal vises ved å starte programmet. Det inkluderer en samtale for å fjerne den nåværende synlige visningen (i tilfelle det er en) og utfører også en Tween som en detalj i grensesnittet.
privat endelig funksjon addTextView (): void removeLastView (); textView = ny tekstvisning (); textView.x = scene.stageWidth * 0,5; textView.y = 110; addChild (textView); TweenNano.from (textView, 0.5, y: textView.y - 10, alpha: 0, ease: Expo); lastView = textView;
Denne koden håndterer SMSView-posisjonen og animasjonen. Det kalles når SMS-knappen er trykket.
privat endelig funksjon addSMSView (): void removeLastView (); smsView = ny SMSView (); smsView.x = scene.stageWidth * 0,5; smsView.y = 150; addChild (smsView); TweenNano.from (smsView, 0.5, y: smsView.y - 10, alpha: 0, letthet: Expo); lastView = smsView;
EmailView-koden. Den vil plassere og animere denne utsikten på scenen.
privat endelig funksjon addEmailView (): void removeLastView (); emailView = ny e-postvisning (); emailView.x = stage.stageWidth * 0,5; emailView.y = 155; addChild (email); TweenNano.from (emailView, 0.5, y: emailView.y - 10, alpha: 0, letthet: Expo); lastView = emailView;
Dette er den endelige fanen, den fjerner den siste synlige visningen og legger til LinkView til scenen.
privat endelig funksjon addLinkView (): void removeLastView (); linkView = ny LinkView (); linkView.x = scene.stageWidth * 0,5; linkView.y = 110; addChild (linkView); TweenNano.from (linkView, 0.5, y: linkView.y - 10, alpha: 0, ease: Expo); lastView = linkView;
Denne funksjonen fjerner den synlige visningen fra scenen og frigjør den for søppelsamling.
privat endelig funksjon removeLastView (): void if (lastView! = null) removeChild (lastView); lastView = null;
Den neste koden knytter knappene til de tilsvarende funksjonene. Dette vil aktivere den flippbaserte navigeringen.
privat endelig funksjon addListeners (): void abcBtn.addEventListener (MouseEvent.MOUSE_UP, indicatorHandler); smsBtn.addEventListener (MouseEvent.MOUSE_UP, indicatorHandler); emailBtn.addEventListener (MouseEvent.MOUSE_UP, indicatorHandler); linkBtn.addEventListener (MouseEvent.MOUSE_UP, indicatorHandler); refreshBtn.addEventListener (MouseEvent.MOUSE_UP, refreshCode);
Indikatoren MovieClip er den lille pilen som viser den aktive kategorien. Denne funksjonen plasserer den i riktig posisjon og kaller kategorien funksjon.
Accentsconagua
privat endelige funksjonsindikatorHandler (e: MouseEvent): void indicator.x = e.target.x; bytt (e.target.name) case 'abcBtn': addTextView (); gå i stykker; saken 'smsBtn': addSMSView (); gå i stykker; tilfelle 'emailBtn': addEmailView (); gå i stykker; tilfelle 'linkBtn': addLinkView (); gå i stykker; standard: spor ('Knappnavn Feil'); Denne funksjonen vil kjøre når Oppdater knappen er trykket, den bestemmer gjeldende streng for å konvertere og QRObject kode () metode for å generere en bitmap som neste blir lagt til scenen.
privat endelig funksjon refreshCode (e: MouseEvent): void switch (lastView) case textView: currentTarget = textView.textTF.text; gå i stykker; saken smsView: currentTarget = 'SMSTO:' + smsView.phoneTF.text + ':' + smsView.contentTF.text; gå i stykker; case emailView: currentTarget = 'SMTP:' + emailView.toTF.text + ':' + emailView.subjectTF.text + ':' + emailView.bodyTF.text; gå i stykker; case linkView: currentTarget = linkView.linkTF.text; hvis (currentTarget.indexOf (': //') == -1) currentTarget = 'http: //' + currentTarget; // automatisk legge til http: // til forsiden av koblinger hvis nødvendig break; standard: spor ('Målfeil'); hvis (qrImg! = null) removeChild (qrImg); qrImg = null; var qrObj: QRCode = ny QRCode (); qrObj.encode (currentTarget); qrImg = ny Bitmap (qrObj.bitmapData); qrImg.x = scene.stageWidth * 0.5 - (qrImg.width * 0.5); qrImg.y = 300 - (qrImg.height * 0.5); addChild (qrImg); TweenNano.from (qrImg, 1, ala: 0, letthet: Expo); Bruk dette programmet til å generere dine egendefinerte QR-koder og husk å utforske kildefilene.
Jeg håper du likte denne opplæringen, takk for å lese!
