SplashScreen
Zeigt und verbirgt Begrüßungsbildschirm der Anwendung.
Methoden
Zugriff auf die Funktion
Ab Version 3.0 implementiert Cordova Geräteebene APIs als Plugins. Verwenden Sie der CLI plugin Befehl, beschrieben in der Command-Line Interface, hinzufügen oder Entfernen dieses Feature für ein Projekt:
$ cordova plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-splashscreen.git
$ cordova plugin rm org.apache.cordova.core.splashscreen
Diese Befehle gelten für alle Zielplattformen, aber die unten beschriebenen Plattform-spezifische Konfigurationseinstellungen ändern:
-
Android (in
app/res/xml/config.xml)<feature name="SplashScreen"> <param name="android-package" value="org.apache.cordova.SplashScreen" /> </feature> -
iOS (in
config.xml)<feature name="SplashScreen"> <param name="ios-package" value="CDVSplashScreen" /> </feature>
Einige Plattformen können dieses Feature unterstützen, ohne dass eine besondere Konfiguration. Eine Übersicht finden Sie unter Plattform-Support.
Setup
Android
Kopieren Sie das Bild des Begrüßungsbildschirms in des Androiden-Projekts
res/drawableVerzeichnis. Für jedes Bild sollte sein:XLarge (Xhdpi): mindestens 960 × 720
- große (Hdpi): mindestens 640 × 480
- Medium (Mdpi): mindestens 470 × 320
-
klein (Ldpi): mindestens 426 × 320
Sie sollten ein Bild 9-Patch für den Begrüßungsbildschirm verwenden.
-
In der
onCreate-Methode der Klasse, die erweitertDroidGap, fügen Sie die folgenden zwei Zeilen:super.setIntegerProperty("splashscreen", R.drawable.splash); super.loadUrl(Config.getStartUrl(), 10000);Die erste Zeile legt das Bild fest als Splashscreen anzeigen. Wenn Sie Ihr Bild alles andere als nennen
splash.png, müssen Sie diese Zeile ändern. Die zweite Zeile ist die normalesuper.loadUrlLinie, aber es hat einen zweiten Parameter, der angibt, einen Timeoutwert für den Splash-Screen. In diesem Beispiel zeigt den Begrüßungsbildschirm für 10 Sekunden. Um den Begrüßungsbildschirm zu entlassen, sobald die app erhält derdevicereadyVeranstaltung, Aufruf dernavigator.splashscreen.hide()Methode.
iOS
Kopieren Sie Ihre Bildschirm-Splash-Images in des iOS-Projekts Resources/splash Verzeichnis. Fügen Sie nur die Bilder für die Geräte, wie iPad oder iPhone unterstützen möchten. Die Größe der einzelnen Bilder sollten sein:
- Default-568h@2x~iphone.png (640x1136 pixels)
- Default-Landscape@2x~ipad.png (2048x1496 pixels)
- Default-Landscape~ipad.png (1024x748 pixels)
- Default-Portrait@2x~ipad.png (1536x2008 pixels)
- Default-Portrait~ipad.png (768x1004 pixels)
- Default@2x~iphone.png (640x960 pixels)
- Default~iphone.png (320x480 pixels)
SplashScreen.Show
Zeigt den Begrüßungsbildschirm.
navigator.splashscreen.show();
Beschreibung
Diese Methode zeigt Begrüßungsbildschirm der Anwendung.
Unterstützte Plattformen
- Android
- BlackBerry 10
- iOS
- Windows Phone 7 und 8
- Windows 8
Kleines Beispiel
navigator.splashscreen.show();
Vollständiges Beispiel
<!DOCTYPE html>
<html>
<head>
<title>Splashscreen Example</title>
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8">
// Wait for device API libraries to load
//
document.addEventListener("deviceready", onDeviceReady, false);
// device APIs are available
//
function onDeviceReady() {
navigator.splashscreen.show();
}
</script>
</head>
<body>
<h1>Example</h1>
</body>
</html>
SplashScreen.Hide
Schließen Sie den Splash-Screen.
navigator.splashscreen.hide();
Beschreibung
Diese Methode weist Begrüßungsbildschirm der Anwendung.
Unterstützte Plattformen
- Android
- BlackBerry 10
- iOS
- Windows Phone 7 und 8
- Windows 8
Kleines Beispiel
navigator.splashscreen.hide();
Vollständiges Beispiel
<!DOCTYPE html>
<html>
<head>
<title>Splashscreen Example</title>
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8">
// Wait for device API libraries to load
//
document.addEventListener("deviceready", onDeviceReady, false);
// device APIs are available
//
function onDeviceReady() {
navigator.splashscreen.hide();
}
</script>
</head>
<body>
<h1>Example</h1>
</body>
</html>
iOS Quirk
Die config.xml Datei AutoHideSplashScreen muss false . Verstecken den Splash-Screen für zwei Sekunden Verzögerung, fügen Sie einen Timer wie die folgende in der deviceready -Ereignishandler:
setTimeout(function() {
navigator.splashscreen.hide();
}, 2000);