Konfigurieren der mit Visual Studio-Tools für Apache Cordova erstellten App

Artikel
09/11/2015

Die Cordova-Tools sind in Visual Studio 2013 als Preview (CTP) Version veröffentlicht. Die Cordova-Tools werden Als Teil von Visual Studio 2015 veröffentlicht und wir empfehlen, zum Entwickeln von Apps Visual Studio 2015 RTM und die Visual Studio-Tools für Apache Cordova zu verwenden. Sie können Visual Studio aus dem Microsoft Download Center herunterladen.

In jedem Projekt ist eine Datei config.xml enthalten, welche die meisten App-Konfigurationen wie Anzeigename und Startseite der App enthält. Im Projektmappen-Explorer können Sie auf diese Datei doppelklicken, um sie im Configuration Designer einer Visual Studio-Schnittstelle für die Datei zu öffnen. Alternativ können Sie im Kontextmenü Code anzeigen auswählen, um die Datei direkt zu bearbeiten. Weitere Informationen zu dieser Datei finden Sie in der Datei config.xml in der Cordova Apache-Dokumentation. Informationen zum Konfigurieren dieser Datei in Visual Studio finden Sie in diesen Themen:

Konfigurieren der Cordova-CLI-Version
Konfigurieren der Windows-Zielversion (in diesem Thema)
Verwalten von Plug-Ins für mit Visual Studio-Tools für Apache Cordova erstellte Apps
Verpacken der mit Visual Studio-Tools für Apache Cordova erstellten App

Warnung

Wenn Sie die Datei config.xml direkt bearbeiten, stellen Sie sicher, dass Ihre XML-Elemente und Attribute gültig sind.Ungültige Inhalte in der XML-Datei führen zu Fehlern bei der Erstellung der Anwendung.

In Visual Studio gibt es auch andere Möglichkeiten zum Konfigurieren Ihrer Anwendung zur Unterstützung plattformspezifischer Inhalte:

Plattformspezifische visuelle Ressourcen (in diesem Thema)
Plattformspezifische Inhalte (in diesem Thema)
Plattformspezifische Konfigurationsdateien (in diesem Thema)

Konfigurieren der Cordova-CLI-Version

Sie können den Konfigurations-Designer verwenden, um die in Ihrem Projekt verwendete CLI-Version zu ändern. Wählen Sie zum Ändern der Version die Registerkarte "Plattformen", und geben Sie eines der folgenden Elemente an:

Cordova-CLI-Version (z. B. 4.3.0)
Git-Repository (z. B. https://github.com/apache/cordova-cli.git)

Alternativ können Sie die Cordova-CLI-Version ändern, indem Sie die Datei "taco.json" in Ihrem Projektstamm bearbeiten.

Warnung

Das Ändern der Cordova-CLI-Version kann sich auf Ihren Anwendungscode auswirken.Plattformen werden entfernt und dann zur Verwendung der an die CLI gebundenen Versionen erneut hinzugefügt.

Konfigurieren der CLI-Version

Konfigurieren der Windows-Zielversion

Sie können die Windows-Zielversion im Konfigurations-Designer auf der Registerkarte "Windows" ändern (Windows-Zielversion).

Cordova_Config_Windows

Die in "Windows-Zielversion" angezeigten Optionen richten sich danach, welches SDK installiert ist. Wenn Sie die SDKs für Windows 8.0 oder Windows 10 installieren, wird die entsprechende Version als eine Option angezeigt, die Sie auswählen können.

Wenn Sie die Windows-Zielversion ändern, wird die folgende Zeile in der Datei "config.xml" geändert:

<preference name="windows-target-version" value="8.1" />

Plattformspezifische visuelle Ressourcen

Sie können mithilfe des Projektordners Res visuelle Ressourcen wie z. B. Symbole und Begrüßungsbildschirme nach Geräteauflösung und Plattform angeben. Wenn dieser Ordner im Projekt nicht angezeigt wird, können Sie ihn im Projektmappen-Explorer manuell neu erstellen.

res\icons\platform enthält die App-Symbole für jede Plattform.
Res\screens\platform enthält die Begrüßungsbildschirme für jede Plattform.

Warnung

Visual Studio 2015 verwendet ab sofort die config.xml-Elemente <icon> und <splashscreen>, um die Speicherorte dieser Dateien festzulegen.Wenn Sie eine config.xml-Datei einer früheren Version verwenden, müssen Sie diese Elemente in Ihre config.xml-Datei einfügen.Erstellen Sie hierzu einfach ein neues Projekt aus der leeren Vorlage, wählen Sie im Kontextmenü für die config.xml-Datei in jedem Projekt die Option Code anzeigen, und kopieren Sie die erforderlichen Elemente aus dem leeren Projekt in Ihr eigenes Projekt.

Der Dateinamen der jeweiligen Ressource enthält bereits einige Informationen zur Ressource. Die Datei screen-ldpi-portrait.png im Ordner Res\icons\screens\android stellt einen Begrüßungsbildschirm für einen Bildschirm mit niedriger Auflösung (ldpi oder 426 x 320) für ein Android-Gerät im Hochformat dar.

Die folgende Tabelle enthält eine vollständige Liste der Begrüßungsbildschirme und Symbole, die zur Unterstützung bestimmter Geräte und Bildschirmauflösungen erforderlich sind. Weitere Informationen zu diesen Ressourcen finden Sie unter Symbole und Begrüßungsbildschirme in der Apache Cordova-Dokumentation.

Symbole und Begrüßungsbildschirme für Android	Auflösung
res/icons/android/icon-36-ldpi.png	36x36
res/icons/android/icon-48-mdpi.png	48x48
res/icons/android/icon-72-hdpi.png	72x72
res/icons/android/icon-96-xhdpi.png	96x96
res/screens/android/screen-xhdpi-landscape.png	720x960
res/screens/android/screen-xhdpi-portrait.png	960x720
res/screens/android/screen-hdpi-landscape.png	480x640
res/screens/android/screen-hdpi-portrait.png	640x480
res/screens/android/screen-mdpi-landscape.png	320x470
res/screens/android/screen-mdpi-portrait.png	470 x 320
res/screens/android/screen-ldpi-landscape.png	320x426
res/screens/android/screen-ldpi-portrait.png	426x320
Symbole und Begrüßungsbildschirme für iOS	Auflösung
res/icons/ios/icon-57-2x.png	114x114 (Retina Display)
res/icons/ios/icon-57.png	57x57
res/icons/ios/icon-72-2x.png	144x144 (Retina Display)
res/icons/ios/icon-72.png	72x72
res/icons/ios/icon-40.png	40x40
res/icons/ios/icon-40-2x.png	80x80 (Retina Display)
res/icons/ios/icon-50.png	50x50
res/icons/ios/icon-50-2x.png	100x100 (Retina Display)
res/icons/ios/icon-60@3x.png	180x180 (Retina-Display)
res/icons/ios/icon-76.png	76x76
res/icons/ios/icon-76-2x.png	152x152 (Retina Display)
res/icons/ios/icon-small.png	29x29
res/icons/ios/icon-small-2x.png	58x58 (Retina Display)
res/screens/ios/screen-ipad-landscape.png	1024x768
res/screens/ios/screen-ipad-landscape-2x.png	2048x1536
res/screens/ios/screen-ipad-portrait.png	768x1024
res/screens/ios/screen-ipad-portrait-2x.png	1536x2048
res/screens/ios/screen-iphone-landscape-736h.png	2208x1242
res/screens/ios/screen-iphone-portrait-2x.png	640x960
res/screens/ios/screen-iphone-portrait.png	320x480
res/screens/ios/screen-iphone-portrait-667h.png	750x1334
res/screens/ios/screen-iphone-portrait-736h.png	1242x2208
res/screens/ios/screen-iphone-568h-2x.png	640x1136
Symbole und Begrüßungsbildschirme für Windows Phone 8	Auflösung
res/icons/wp8/ApplicationIcon.png	62x62
res/icons/wp8/Background.png	173x173
res/screens/wp8/SplashScreenImage.png	480x800
Symbole und Begrüßungsbildschirme für Windows Phone 8.1	Auflösung
res/icons/windows/Square150x150Logo.scale-240.png	360x360
res/icons/windows/Square44x44Logo.scale-240.png	106x106
res/icons/windows/Square71x71Logo.scale-240.png	170x170
res/icons/windows/StoreLogo.scale-240.png	120x120
res/icons/windows/Wide310x150Logo.scale-240.png	744x360
res/screens/windows/SplashScreen.scale-240.png	1152x1920
Symbole und Begrüßungsbildschirme für Windows	Auflösung
res/icons/windows/logo.png	150x150
res/icons/windows/smalllogo.png	30x30
res/icons/windows/storelogo.png	50x50
res/screens/windows/splashscreen.png	620x300

Android unterstützt einen skalierbaren Bildtyp namens NinePatch, den Sie als Begrüßungsbildschirm verwenden können.

So verwenden Sie ein NinePatch-Bild unter Android für den Begrüßungsbildschirm

Ändern Sie die folgende Zeile in der Datei "config.xml":

<preference name="SplashScreen" value="screen" />

auf

<preference name="SplashScreen" value="splash" />

Platzieren Sie das NinePatch-Bild an folgendem Speicherort: "res\native\android\res\drawable-nodpi\splash.9.png"

Bei der Erstellung wird das Bild in den erforderlichen Ausgabeordner kopiert.

Plattformspezifische Inhalte

Sie können plattformspezifische HTML-, CSS- und JavaScript-Dateien in den Ordner Zusammenführungen in Ihrem Projekt einfügen. Durch die Dateien, die Sie zu diesem Ordner hinzufügen, wird entweder ein plattformspezifischer Build der Anwendung hinzugefügt oder werden plattformspezifische Inhalte, welche den gleichen Dateinamen verwenden, überschrieben. Weitere Informationen zur Verwendung des Ordners Zusammenführungen finden Sie im Abschnitt "Alle Plattformen mit Zusammenführungen anpassen" in der Apache Cordova-Dokumentation.

Wenn für Ihr Projekt im Projektmappen-Explorer keine Zusammenführungen angezeigt werden, öffnen Sie im das Kontextmenü zum Projekt im Projektmappen-Explorer, wählen Sie Hinzufügen und dann Plattformspezifischen Code hinzufügen, um den Ordner hinzuzufügen.

Plattformspezifische Konfigurationsdateien

Sie können den Ordner "res/native" in Ihrem Projekt zum Einfügen von Inhalten in das von Cordova beim Erstellen Ihrer App generierte systemeigene Projekt verwenden. Dies kann hilfreich sein, wenn Sie Ihre App dahingehend konfigurieren müssen, dass sie etwas unterstützt, was Cordova selbst nicht verfügbar macht. (Ihrem Projekt hinzugefügte Plug-Ins ändern zudem automatisch die benutzerdefinierte Version dieser Konfigurationsdateien.)

Warnung

Wir empfehlen, nach Möglichkeit das Hinzufügen von plattformspezifischen Konfigurationsdateien zu vermeiden.

Die folgende Tabelle enthält spezifische Informationen für jede Plattform.

Plattform	Notizen
Android	Legen Sie die benutzerdefinierte Datei AndroidManifest.xml im Ordner "res/native/android" ab, um Einstellungen wie benutzerdefinierte Prioritäten zu konfigurieren. Verwenden Sie die generierte Version der Datei im Ordner "platforms/android" nach der Erstellung einer Debugkonfiguration des Projekts für Android.
iOS	Legen Sie die benutzerdefinierte Datei build-debug.xcconfig oder build-release.xcconfig im Ordner "res/native/ios/cordova" ab, um Signaturidentitäten und andere Buildeinstellungen für diese Konfigurationen zu überschreiben. Legen Sie die benutzerdefinierte Datei Info.plist im Ordner "res/native/ios/config.xml-Anzeigename" ab, um Einstellungen wie Begrüßungsbildschirme oder Symbole zu überschreiben. Der Dateiname "Info.plist" muss in "config.xml-Anzeigename-Info.plist" umbenannt werden, um iOS-Framework-Schlüssel zu aktualisieren. Eine Beispielversion dieser und anderer Dateien finden Sie im cordova-ios-GitHub-Repository oder bei Verwendung des Remote-Agenten unter dem Ordner "~/remote-builds/build number/cordovaApp" auf Ihrem Mac.
Windows	Legen Sie das benutzerdefinierte "package.windows80.appxmanifest" (Windows 8.0), "package.windows.appxmanifest" (Windows 8.1) oder "package.phone.appxmanifestfile" (Windows Phone 8.1) im Ordner "res/native/windows" ab, um verschiedene Konfigurationseinstellungen zu überschreiben. Verwenden Sie die generierte Version der Datei im Ordner "platforms/windows" nach der Erstellung einer Debugkonfiguration des Projekts für Windows oder Windows Phone (Universal).
Windows Phone 8	Legen Sie die benutzerdefinierte Datei "WMAppManifest.xml" im Ordner "res/native/wp8/Properties" ab. Verwenden Sie nach der Erstellung einer Debugkonfiguration des Projekts für Windows Phone 8 die generierte Version der Datei im Ordner "platforms/wp8/Properties".