PhoneGap är en öppen källkod för att bygga mobila applikationer på plattformen med HTML, CSS och JavaScript. Det här är en idealisk lösning för webbutvecklare som är intresserade av mobilutveckling, eftersom det gör det möjligt för dem att utnyttja befintliga färdigheter istället för att börja skrapa med ett enhetsspecifikt kompilerat språk. Det här är också en idealisk lösning för dem som är intresserade av att skapa en applikation som kan köras på flera enheter med samma kodbas. I den här handledningen lär du dig hur du installerar PhoneGap-utvecklingsmiljön och lär dig några av de grundläggande utvecklingshänsynen på plattformen.
Program som är byggda med PhoneGap är inte bara som vanliga mobila webbplatser. PhoneGap-applikationer kan interagera med maskinvaran för mobila enheter, till exempel Accelerometer eller GPS, på sätt som inte är tillgängliga för vanliga webbapplikationer. PhoneGap-applikationer är också byggda och förpackade som inhemska applikationer, vilket innebär att de kan distribueras via Apples App Store eller Android Market.
PhoneGap stöder ett antal olika mobila plattformar, inklusive:
PhoneGap SDK tillhandahåller ett API som är ett abstraktionslager som ger utvecklaren tillgång till maskinvaru- och plattformsspecifika funktioner. Eftersom PhoneGap sammanfattar den inbyggda mobilplattformen kan samma kod användas på flera mobila plattformar med liten eller ingen förändring, vilket gör din ansökan tillgänglig för en bredare publik.
Maskinvarespecifika funktioner som stöds av PhoneGap API inkluderar:
För att skapa applikationer med PhoneGap måste du först installera standard SDK för de mobila plattformarna du vill rikta in för din app. Det beror på att PhoneGap faktiskt kommer att använda dessa SDK-enheter när du sammanställer din app för den plattformen.
Så, om du utvecklar för Android, behöver du:
Det finns också några ytterligare PhoenGap-specifika krav för Android-utveckling, inklusive:
TelefonGap Android-dokumentationen ger en komplett lista över krav med installationsinstruktioner för varje.
Om du utvecklar för iPhone behöver du:
Läs vår Introduktion till iPhone Development-handledningen för mer information om hur du installerar en iPhone-utvecklingsmiljö.
När du har laddat ner och lossat phonegap ser du det innehåller en separat mapp för varje plattform som stöds av PhoneGap:
PhoneGap levereras med en standard applikation som kan användas för att visa upp SDK: s kraftfulla funktionalitet. Resten av denna handledning kommer att vara avsedd för att visa dig hur du konfigurerar den här standardappen för både Android och iPhone.
För att skapa en arbetsyta för din PhoneGap-app på Android, gå till mappen "phonegap-android" på kommandotolken eller terminalen.
Kör följande kommando:
ruby. /droidgap "[android_sdk_path]" [namn] [paketnamn] "[www]" "[sökväg]"
När det här kommandot körs kommer applikationsverktyget att genereras i den sökväg du har gett. Då kan du öppna Eclipse och först välja "New Android Project" och välj sedan "Skapa från befintlig källa" och välj det arbetsutrymme för program som skapades med föregående kommando.
När det är klart, kopiera följande filer från phonegap / phonegap-android / example-mappen till www-mappen i din arbetsyta:
Klicka sedan på kör för att se phonegap example app i android simulatorn.
För att skapa en PhoneGap-app för iPhone, gå till phonegap-iphone-mappen där du släppte upp PhoneGap-filerna.
När du är i den mappen i din terminal skriver du "Make" för att bygga PhoneGapLibInstaller.pkg.
Då måste du köra PhoneGapLibInstaller.pkg som installerar PhoneGapLib och PhoneGap-mallen i Xcode.
Då kan du starta Xcode och skapa ett "nytt projekt". Välj sedan PhoneGap-baserad applikationsmall.
Kopiera sedan följande filer till www-mappen i ditt arbetsområde:
Kör programmet för att starta demo PhoneGap-appen i iPhone Simulator.
Så nu har du demo PhoneGap app som körs på din simulator. Du kan leka med appen och se hur den fungerar. Den här grundläggande appen visar allmänt användandet av de olika API: erna som exponeras
av PhoneGap SDK.
Fortsätt och öppna index.htm. Överst på sidan ser du följande kod:
PhoneGap
Det första är en länk till master.css som ger all stil till knappen du såg på skärmen.
Den andra raden innehåller phonegap.js som genereras när vi har skapat en arbetsyta för vår applikation. Den här filen gör allt för att kalla de inbyggda API-erna via JavaScript.
Nu om du bläddrar till slutet av index.html ser du följande kod:
Välkommen till PhoneGap!
den här filen finns på tillgångar / index.html
Plattform:
Version:
UUID:
Denna HTML skapar länkarna som visas som knappar på skärmen på mobilenheten. Det finns onclick handlers kopplade till dessa länkar som kallar JavaScript-funktioner som definieras i samma fil som ansvarar för att ringa PhoneGap API för att interagera med den inbyggda maskinvaran.
Den första funktionen som ska kallas i JavaScript är init (). Det här registrerar vår JavaScript-funktion enhetsinformation till PhoneGap-händelsen.
Deviceready Event
De deviceready Eventen avfyras av PhoneGap när alla SDK-komponenter är inlagda korrekt. Det är därför vettigt att JavaScript APIs i PhoneGap ska användas efter det att händelsen brinner.
Du kan läsa mer om deviceready i API-dokumentationen.
Enhetsobjekt
Enhetsobjektet innehåller grundläggande information om enheten som appen körs på, som plattformen, versionen etc. Dessa värden kan användas för att utföra enhetsspecifika kontroller i din kod.
Du kan läsa mer om enhetens objekt i den officiella API-dokumentationen.
Accelerometer
Den första länken i kroppen kallar funktionen watchAccel:
Watch Accelerometer
Denna del av API: n kollar och skickar meddelanden om enhetsacceleration med jämna mellanrum. Den returnerar nuvarande acceleration av enheten genom att passera x-, y- och z-koordinaterna till callBackonSuccess funktion registrerad. Värdena x, y, z kan sedan användas i applikationen för att svara på rörelse.
Läs mer om accelerometern här.
GPS och positionering
Den andra länken i kroppen är ansvarig för att samla den aktuella enhetens plats:
Få plats
De callBackonSuccessfunktionen skickas ett objekt som innehåller GPS-koordinaterna som kan användas i din applikation för att utföra platsbaserad bearbetning.
Du kan läsa mer om Geolocation API.
Ringa
Den tredje raden i kroppen kommer att starta enheten dialer med numret "411":
Ring 411
Enhetsmeddelanden
De två följande raderna i kroppen brukar pipa eller vibrera en enhet:
Beep Vibrate
Läs mer om pip och vibrera i de officiella dokumenten.
Använda kameran
Nästa rad i kroppen kallar funktionen show_pic att ta ett foto:
Få en bild
Denna api lanserar kamerans kameraapplikation och väntar
för användaren att fånga en bild.
Läs mer om att ta bilder i den officiella API-dokumentationen.
Slutsats
PhoneGap är ett mycket kraftfullt ramverk för plattformsutveckling. Om du redan har en stark webbutvecklingsbakgrund och är intresserad av att skapa appar för en eller flera enheter, är PhoneGap säkert en stark konkurrent att överväga!