Adobe AIR: Fra web til desktop og mobil

Hvad er Adobe AIR?

Adobe AIR® er en runtime-platform, der muliggør udvikling af rige internetapplikationer (RIAs) på tværs af flere operativsystemer og skærme. Med AIR kan udviklere udnytte deres eksisterende webudviklingsfærdigheder til at skabe og distribuere applikationer til både desktop-computere og mobile enheder. Dette åbner op for en verden af muligheder, hvor velkendte teknologier som HTML, JavaScript, Ajax og ActionScript 3.0 kan anvendes til at levere avancerede brugeroplevelser uden for browseren.

AIR's styrke ligger i dens alsidighed og evne til at bygge bro mellem web- og desktop-miljøer. Uanset om du foretrækker at arbejde med ActionScript og Adobe Flex eller Flash (SWF-baseret), eller om du er mere komfortabel med HTML, JavaScript og Ajax (HTML-baseret), tilbyder AIR en fleksibel ramme for dine projekter. Platformen understøtter en rig mængde frameworks og API'er, herunder:

• AIR-specifikke API'er leveret af runtime og AIR-frameworket.
• ActionScript API'er til SWF-filer og Flex-frameworket.
• HTML, CSS og JavaScript.
• Native Extensions (ANE'er), der giver adgang til platformsspecifikke funktioner via native kode, hvilket muliggør integration med eksisterende eller højtydende native kode.

Denne brede understøttelse giver udviklere enestående kreativ kontrol og mulighed for at udvide deres applikationer til nye platforme, herunder desktops, mobile enheder og fjernsyn. Adobe AIR transformerer måden, applikationer skabes, distribueres og opleves på.

Kom godt i gang med AIR til Android

Mobiludvikling er uden tvivl et spændende felt, men for mange udviklere, der primært fokuserer på back-end eller interne Flex-applikationer, kan det virke intimiderende at kaste sig ud i mobiludvikling. Heldigvis gør nye værktøjer som Adobe AIR til Android (i udviklerprøveversion) og Adobe Flash IDE processen betydeligt nemmere. Dette afsnit guider dig igennem de essentielle trin til at starte med at udvikle til Android med AIR ved hjælp af Adobe Flash Professional CS5.

Nødvendige værktøjer til udvikling

For at komme i gang med Android-udvikling ved hjælp af Flash, skal du have følgende værktøjer installeret:

• Google Android SDK: Dette SDK indeholder de nødvendige værktøjer til Android-udvikling, uanset om du laver native Java-applikationer eller AIR til Android-applikationer i Flash. Specifikt vil du bruge værktøjerne adb (Android Debug Bridge) og ddms (Dalvik Debug Monitor Service) undervejs.
• AIR til Android: Denne runtime er tilgængelig via Adobes prerelease-program og kræver, at du tilmelder dig. Når du er tilmeldt, får du adgang til installationsfilen for AIR til Android samt en Flash Professional CS5-udvidelse og medfølgende dokumentation.

Installation og opsætning

Når du har downloadet de nødvendige værktøjer, er det tid til at installere dem. Processen er generelt ligetil, men der kan være små forskelle afhængigt af, om du bruger Windows eller Mac.

1. Udpak Android SDK: Sørg for at placere mappen med SDK-filerne et let tilgængeligt sted, da du skal tilgå flere elementer fra kommandolinjen.
2. Forbind din enhed: Tilslut din Android-telefon til din computer via USB. Brug adb-værktøjet fra SDK'ens 'Tools'-mappe til at verificere, at din enhed er korrekt forbundet. På PC'er kan det være nødvendigt at installere en specifik driver til din telefon. Åbn et kommandopromptvindue, naviger til 'Tools'-mappen, og kør kommandoen ./adb devices. Hvis din enhed vises på listen, er forbindelsen etableret. Hvis ikke, skal du sikre dig, at 'USB-fejlfinding' (USB Debugging) er aktiveret under telefonens indstillinger (typisk under Indstillinger > Programmer > Udvikling).
3. Installer AIR til Android: Placer den downloadede AIR runtime-fil (normalt en .apk-fil) i 'Tools'-mappen under din Android SDK for nemheds skyld. Kør derefter følgende kommando i kommandoprompten: /adb install Runtime_Device_Froyo_20100720.apk (merk, at filnavnet kan variere afhængigt af opdateringer).

Du bør se en bekræftelsesmeddelelse, der indikerer, at installationen er lykkedes. Du kan også verificere dette direkte på din Android-telefon ved at gå til Indstillinger > Programmer > Administrer programmer, hvor 'Adobe AIR' nu bør være synlig på listen.

Bygning af mobilapplikationer i Flash Professional CS5

For at starte et nyt projekt skal du først installere AIR til Android-udvidelsen til Flash Professional CS5. Dobbeltklik på installationsfilen for at åbne Extension Manager og installer udvidelsen. Når installationen er fuldført, vil du se en ny mulighed for at oprette en AIR til Android-applikation under 'Opret fra skabelon' ved opstart af Flash CS5 IDE'en. Vælg denne mulighed, som typisk sætter dokumentstørrelsen til 480x800 pixels og tilføjer en 'AIR til Android Settings'-knap i applikationens Properties-panel.

Som et eksempel kan vi se på en simpel applikation kaldet 'KidsStorybook'. Denne applikation består af fem frames, der indeholder tekst fra en børnefortælling. Koden, der primært er placeret i første frame, håndterer navigationen mellem siderne ved hjælp af knapper. Den bruger standard ActionScript-kode, der ville fungere identisk, hvis applikationen skulle køre i en browser.

Kodeeksempel (grundlæggende navigation):

import flash.events.Event; import flash.events.MouseEvent; stop(); this.addEventListener(Event.ENTER_FRAME, handleEnterFrame); nextBtn.addEventListener(MouseEvent.MOUSE_DOWN, nextFrameHandler); prevBtn.addEventListener(MouseEvent.MOUSE_DOWN, prevFrameHandler); function nextFrameHandler(event:MouseEvent):void { goNextFrame(); } function goNextFrame() { if (currentFrame < totalFrames) { gotoAndStop(currentFrame + 1); } } function prevFrameHandler(event:MouseEvent):void { goPreviousFrame(); } function goPreviousFrame() { if (currentFrame > 1) { gotoAndStop(currentFrame - 1); } } function handleEnterFrame(event:Event) { prevBtn.visible = true; nextBtn.visible = true; if (currentFrame == 1) { prevBtn.visible = false; } else if (currentFrame == totalFrames) { nextBtn.visible = false; } } 

Det er værd at bemærke, at eksemplet bruger MouseEvent i stedet for TouchEvent. Dette anbefales ofte til Android, da MouseEvent bruger mindre hukommelse og fungerer fint, når der trykkes med en finger. Dette viser, hvordan Flash- og ActionScript 3.0-udviklere nemt kan overføre deres eksisterende færdigheder til mobilapplikationsudvikling.

Udnyttelse af touch-skærmen: Swipe-gestus

For at gøre applikationen mere interaktiv og udnytte touch-skærmens potentiale, kan vi nemt tilføje understøttelse for swipe-gestus. Dette gøres ved at tilføje en event listener for TransformGestureEvent.GESTURE_SWIPE og håndtere swipe-retningen.

Kodeeksempel (swipe-håndtering):

import flash.events.TransformGestureEvent; stage.addEventListener(TransformGestureEvent.GESTURE_SWIPE, swipeHandler); function swipeHandler(event:TransformGestureEvent):void { if (event.offsetX == -1) { goNextFrame(); } else if (event.offsetX == 1) { goPreviousFrame(); } } 

Denne tilføjelse gør det muligt for brugerne at navigere mellem siderne ved at swipe til venstre eller højre, hvilket giver en mere intuitiv brugeroplevelse på mobile enheder.

Udgivelse af din første applikation

Når din applikation er bygget, er det tid til at udgive den til din Android-enhed. Dette gøres via indstillingerne for publicering i Flash Professional CS5.

1. Rediger AIR-indstillinger: I Properties-panelet for din Flash-applikation, klik på 'Rediger'-knappen ved siden af AIR til Android-indstillingerne. Dette åbner et nyt vindue med faner som 'Generelt', 'Udgivelse' og 'Ikoner'.
2. Generelle indstillinger: Her kan du indstille applikationens navn, version og billedformat.
3. Udgivelsesindstillinger: Fanen 'Udgivelse' er afgørende. Her skal du konfigurere dit certifikat (et selvsigneret certifikat er tilstrækkeligt til test). Du kan også vælge mellem en debugging- eller release-build. Vigtigst af alt kan du aktivere automatisk installation og lancering af applikationen på en tilsluttet telefon til test. Angiv stien til adb-værktøjet i din Android SDK 'Tools'-mappe. Klik på 'Udgiv', og din AIR-applikation bør blive installeret og startet på din mobile enhed.
4. Tilføjelse af ikon: For at give din applikation et professionelt udseende, kan du tilføje et brugerdefineret ikon via fanen 'Ikoner'. Opret et ikonbillede (f.eks. en 72x72 PNG-fil) og tilføj det i indstillingerne.

Konklusion: Du er nu mobiludvikler!

Med disse trin er du officielt i gang som mobiludvikler. Selvom din første applikation måske ikke var banebrydende, har du nu et solidt fundament. Du kan fortsætte med at udforske mulighederne med touch-skærmen, accelerometeret og andre mobile funktioner for at skabe endnu mere avancerede og engagerende applikationer. Adobe AIR og Flash Professional CS5 giver en kraftfuld og tilgængelig platform for at bringe dine kreative ideer til live på mobile enheder.

For yderligere information og inspiration, besøg Adobe's Mobile and Devices Developer Center. Opdag også inspirerende eksempler på Flash-indhold, der kører på mobile enheder, i Adobe Flash Showcase for mobile.

Hvis du vil læse andre artikler, der ligner Adobe AIR: Fra web til desktop og mobil, kan du besøge kategorien Software.