Převedení projektu Cordova na projekt PhoneGap
PhoneGap je rozhraní s otevřeným zdrojem pro rychlé vytváření mobilní aplikace pro různé platformy pomocí specifikace HTML5, JavaScript a CSS.Adobe PhoneGap sestavení je cloudové služby, která vám umožní rychle vytvářet mobilní aplikace a snadno zkompilovat bez sady SDK, kompilátoru a hardwaru.Tento článek popisuje, jak převést Apache Cordova projekt vytvořen pomocí sady Visual Studio na projekt PhoneGap a používat cloudové služby PhoneGap sestavení.
Jedním z hlavní rozdíly mezi projektu sady Visual Studio a PhoneGap projekt, který je definice aplikace v konfiguračním souboru (config.xml).Chcete-li změnit svůj projekt Visual Studio do projektu PhoneGap jsou nutné následující úkoly:
Sestavení projektu Cordova z vašeho projektu sady Visual Studio
Vytvořit strukturu projektu PhoneGap
Aktualizovat config.xml
Uložit do cloudu sestavení
Kód přihlášení a zřízení aplikace.
Sestavení projektu Cordova z vašeho projektu sady Visual Studio
Společnost Microsoft bude spuštěn prohlédnete příklad projektovou strukturu pro projekt vytvořen pomocí nástroje Visual Studio Tools pro Apache Cordova.
K sestavení úspěšně, vyžaduje PhoneGap sestavení cloudové pouze webové aktiva vaší aplikace, které jsou omezeny na HTML, CSS, obrázky, soubory JS, atd.Sestavení PhoneGap bude, které by mohly selhání kompilace aplikace, jsou-li nativní soubory nahrán (h, .m, .java atd.).Nejjednodušší způsob, jak získat majetku webové aplikace je k sestavení projektu sady Visual Studio, ke které poté vytvoří Cordova CLI projekt ve složce bld/ladění, jako v příkladu níže.Složka www projektu Cordova CLI hostuje veškerého majetku web používá ve vaší aplikaci, jako v příkladu níže.
Poté, co jste vygenerovali složce www, můžete vytvořit PhoneGap sestavení projektu.Doporučujeme vytvořit novou složku (mimo své umístění projektu sady Visual Studio) k hostování PhoneGap projektu a zkopírujte složku www pro projekt Cordova CLI z bld/debug do nového umístění.
Vytvoření projektu PhoneGap struktury
Při vytváření projektu PhoneGap struktury, ujistěte se, že config.xml a index.html jsou na nejvyšší úrovni struktury složky aplikace.Podle potřeby v ostatních případech mohou členění vaší aplikace.Zkopírujte config.xml ze složky bld/debug ke složce www PhoneGap sestavení projektu.Také kopírovat nativní zdroje z projektu Cordova CLI (bld\Debug\res\icons a bld\debug\res\screens v uvedeném pořadí) do kořenového adresáře PhoneGap sestavení projektu.
Poté, co můžete zkopírovat všechny soubory a složky, PhoneGap sestavení projektu by mělo vypadat jako.
Vzhledem k tomu, že vaše aplikace může obsahovat soubory nebo složky, není nutné v konečné potřebným aplikaci (například nepoužívané úvodní obrazovky bower balíčky, grunt artefakty, zrušeno kompilovaný menší soubory, atd.), sestavení PhoneGap podporuje speciální soubor s názvem .pgbomit.
.pgbomit je soubor, který můžete vytvářet a přidávat do složky můžete dát pokyn PhoneGap sestavení mají být vyloučena složku jako zdroj pro soubory nativní aplikace.(Však můžete v této složce pro ukládání všech souborů potřeby během procesu sestavení PhoneGap až do kroku kompilace.) Jako Typickým příkladem můžete chtít umístit .pgbomit do složky obsahující ikony a úvodní obrazovky.Proto umístíte .pgbomit ve složce www/rozlišení PhoneGap sestavení projektu; žádná z soubory a složkami v www/rozlišení v důsledku toho budou zahrnuty v balíčku binární aplikace, s výjimkou těch, kopírovat a použít pro ikony a úvodní obrazovky pro konkrétní platformu.Následující obrázek ukazuje soubor .pgbomit ve složce www/rozlišení.
Vzhledem k tomu, že PhoneGap sestavení nepodporuje sloučení složky projektu Cordova CLI ve výchozím nastavení, je nutné zkopírovat specifické pro platformu obsah ze složky sloučení své Cordova CLI projektu do složky www PhoneGap sestavení projektu.
Aktualizovat Config.xml
Sestavení PhoneGap podporuje konfigurační soubor XML config.xml, což je velmi liší od verze generovaných projekt Visual Studio.Tento soubor konfigurace umožňuje upravit například název aplikace, ikony, úvodní obrazovky a jiné vlastnosti.
Spusťte odebráním oboru názvů VS a přidání oboru názvů PhoneGap do config.xml.Výsledek je zde zobrazen.
<widget xmlns:cdv="http://cordova.apache.org/ns/1.0"
id="io.cordova.appb64ec64666e9432a9caf5f01009feb88"
version="1.0.0.0"
xmlns:gap="http://phonegap.com/ns/1.0"
xmlns="http://www.w3.org/ns/widgets">
<name>SlidePuzzle</name>
Ikony
Výchozí ikony musí být pojmenován icon.png a, se musí nacházet v kořenové složce vaší aplikace.Pokud neurčíte jinak v souboru config.xml, každou platformu se pokusí použít výchozí icon.png během kompilaci.
<icon src="icon.png" />
Pokud chcete ikony specifické pro platformu Android, tyto položky zobrazit příklad toho, jak aktualizovat config.xml na základě obsahu složky res\icons\android v PhoneGap sestavení projektu, kterou jste dříve vytvořili.
<icon gap:platform="android" gap:qualifier="ldpi"
src="www/res/icons/android/icon-36-ldpi.png" />
<icon gap:platform="android" gap:qualifier="mdpi"
src="www/res/icons/android/icon-48-mdpi.png" />
<icon gap:platform="android" gap:qualifier="hdpi"
src="www/res/icons/android/icon-72-hdpi.png" />
<icon gap:platform="android" gap:qualifier="xhdpi"
src="www/res/icons/android/icon-96-xhdpi.png" />
Pro další informace o určení ikonu prvků v souboru config.xml, přečtěte si tyto článku.
Úvodní obrazovky
Může mít nula nebo další prvky na úvodní obrazovce přítomné v config.xml.Prvek úvodní obrazovky mohou mít atributy src, mezeru: platformy, šířku a výšku, stejně jako element < icon >.Stejně jako soubory ikon úvodní obrazovce soubory uložte jako obrázky PNG.Pokud neurčíte jinak v souboru config.xml, každou platformu použije výchozí soubor splash.png během kompilaci.Pokud nezadáte atribut mezera: platformy, výchozí obrázek bude zkopírován do všech platformách, zvětšení každého balíčku aplikace.
Výchozí úvodní obrazovka musí být pojmenován splash.png a, se musí nacházet v kořenové složce vaší aplikace.
<gap:splash src="splash.png" />
Pokud chcete konkrétní úvodní obrazovky pro platformu Android, tyto položky zobrazit příklad toho, jak aktualizovat config.xml na základě obsahu složky res\screens\android v PhoneGap sestavení projektu.
<gap:splash gap:platform="android" gap:qualifier="port-ldpi"
src="www/res/screens/android/screen-ldpi-portrait.png" />
<gap:splash gap:platform="android" gap:qualifier="port-mdpi"
src="www/res/screens/android/screen-mdpi-portrait.png" />
<gap:splash gap:platform="android" gap:qualifier="port-hdpi"
src="www/res/screens/android/screen-hdpi-portrait.png" />
<gap:splash gap:platform="android" gap:qualifier="port-xhdpi"
src="www/res/screens/android/screen-xhdpi-portrait.png" />
<gap:splash gap:platform="android" gap:qualifier="land-ldpi"
src="www/res/screens/android/screen-ldpi-landscape.png" />
<gap:splash gap:platform="android" gap:qualifier="land-mdpi"
src="www/res/screens/android/screen-mdpi-landscape.png" />
<gap:splash gap:platform="android" gap:qualifier="land-hdpi"
src="www/res/screens/android/screen-hdpi-landscape.png" />
<gap:splash gap:platform="android" gap:qualifier="land-xhdpi"
src="www/res/screens/android/screen-xhdpi-landscape.png" />
Další informace o prvcích na úvodní obrazovce určíte v souboru config.xml naleznete v tématu to článku.
Moduly plug-in
Rozšíření přístup k funkcím nativní platformy zveřejněn prostřednictvím kontejneru nativní aplikace PhoneGap, PhoneGap sestavení podporuje uvedené white výběr PhoneGap moduly plug-in.Seznam podporovaných moduly plug-in naleznete v tématu moduly plug-in.Pokud zahrnete všechny moduly plug-in, která nejsou v programu bílá seznamu, se nezdaří sestavení.Modul plug-in naimportovat do projektu PhoneGap sestavení, je nutné přidat element správný < mezera: modul plug-in > do config.xml.Pokud nezadáte atribut verze pro modul plug-in, aplikace vždy vytvářejte pomocí nejnovější verze modulu plug-in.
Zde je nejvíce zneužívající vlastností prohlížeče způsob, jak pomocí verzí modul plug-in.
<gap:plugin name="com.phonegap.plugins.example" version="2.2.1" />
Vzhledem k tomu, že sady Visual Studio vydá elementu < vs: modul plug-in > do config.xml pro každý modul plug-in, které jste přidali, je nutné tyto prvky nahradit < mezera: modul plug-in > elementy.V příkladu projekt, který používáme používáme dva moduly plug-in a dva řádky odpovídající v souboru config.xml.
<vs:plugin name="org.apache.cordova.device-motion" version="0.2.10" />
<vs:plugin name="org.apache.cordova.camera" version="0.3.2" />
V projektu PhoneGap sestavení musí být tyto řádky změněn na:
<gap:plugin name="org.apache.cordova.device-motion" version="0.2.10" />
<gap:plugin name="org.apache.cordova.camera" version="0.3.2" />
Další informace o úpravách moduly plug-in, naleznete v tématu to článku.
Nahrajte svůj projekt do PhoneGap
Poté, co jste vyplnili všechny požadované úpravy, je možné nahrávat aplikaci, aby služba sestavení PhoneGap.Nejprve vytvořte účet pro službu PhoneGap sestavení.Potom se přihlásit k účtu na adrese https://build.phonegap.com/apps k odeslání vaší aplikace.Vaše aplikace můžete odeslat buď z GIT repo nebo můžete uložit do místního souboru ZIP.V tomto příkladu jsme hodláte nahrát místního souboru ZIP, který obsahuje složku ZIP www.Po odeslání ZIP, uvidíte, zda je aplikace připravená pro vytváření.
Když kliknete na tlačítko připraveno k sestavení tlačítko, služba sestavení PhoneGap začít vytvářet pro platformy, které jste určili v souboru config.xml.Vzhledem k tomu, že jsme nebyly definovány žádné konkrétní platformu, bude služba sestavení pro všechny tři platformy (iOS, Android a Windows).Po dokončení sestavení, zobrazí se výsledky sestavení.
Kód přihlášení a zřízení svou aplikaci
Vzhledem k tomu, že se pomocí cloudu vytvořit službu, můžeme budou muset nastavit podepisování kódu a zřizování certifikáty pro podporu vytváření podepsané verzi nebo distribuční balíčky.Pro iOS můžete zadat kód podpisový certifikát a mobilní zřizování profil zde:
Chcete-li vytvořit balíček APK verze pro Android, která je připravena k odeslání úložiště, služba sestavení PhoneGap umožňuje poskytovat informace klíč úložiště a odpovídající hesla:
Pro Android, použijeme existující klíč úložiště, které jste dříve vytvořili (nebo můžete vytvořit novou pomocí této průvodce) a pak znovu vytvořte aplikace.Nyní služba sestavení vytvoří plně podepsané verzi balíčku, který může být buď stáhnout pro publikování do úložiště, nebo na upevněnou hlavou sběrače proudu zařízení nainstalován.
Věříme, že tento článek vám pomůže převést svůj projekt Visual Studio Cordova na PhoneGap sestavení projektu a rychle vytvářet vaše aplikace pro iOS, Android nebo Windows pomocí služby sestavení PhoneGap.
Pokud jste již nainstalován Visual Studio Tools pro Apache Cordova a je aktivně používají, Děkujeme vám.Pokud ne, prosím navštivte tuto stránku jak získat všechny nástroje.