スプラッシュ スクリーン
表示し、アプリケーションのスプラッシュ スクリーンを非表示にします。
メソッド
機能へのアクセス
バージョン 3.0 は、コルドバのプラグインとしてデバイス レベルの Api を実装します。 CLI の使用 plugin のコマンドライン ・ インタ フェースを追加または削除、プロジェクトに対してこの機能を記載されているコマンド。
$ cordova plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-splashscreen.git
$ cordova plugin rm org.apache.cordova.core.splashscreen
これらのコマンドすべてのターゲット プラットフォームに適用されますが、以下のプラットフォームに固有の構成設定を変更します。
-
(アンドロイド
app/res/xml/config.xml)<feature name="SplashScreen"> <param name="android-package" value="org.apache.cordova.SplashScreen" /> </feature> -
iOS (
config.xml)<feature name="SplashScreen"> <param name="ios-package" value="CDVSplashScreen" /> </feature>
いくつかのプラットフォームは特別な構成を必要とせずにこの機能をサポート可能性があります。概要については、プラットフォームのサポートを参照してください。
セットアップ
アンドロイド
Android プロジェクトにスプラッシュ スクリーンのイメージをコピー
res/drawableディレクトリ。各画像のサイズをする必要があります。エクストララージ (xhdpi): 少なくとも 960 × 720
- 大 (hdpi): 少なくとも 640 × 480
- 媒体 (開度計): 少なくとも 470 × 320
-
小 (ldpi): 少なくとも 426 × 320
9 Patch 画像にスプラッシュ スクリーンを使用してください。
-
onCreateを拡張するクラスのメソッドDroidGap、次の 2 行を追加。super.setIntegerProperty("splashscreen", R.drawable.splash); super.loadUrl(Config.getStartUrl(), 10000);最初の行は、splashscreen として表示するイメージを設定します。 場合は任意の名前をあなたのイメージよりも、他
splash.png、この行を変更する必要があります。 2 行目は、通常のsuper.loadUrlライン、しかしそれはスプラッシュ画面のタイムアウト値を指定する 2 番目のパラメーター。 この例ではスプラッシュ画面が 10 秒間表示されます。 アプリケーションが受信するスプラッシュ画面を却下する、devicereadyイベント、呼び出し、navigator.splashscreen.hide()メソッド。
iOS
IOS のプロジェクトに、スプラッシュ画面画像をコピー Resources/splash ディレクトリ。 IPad や iPhone などをサポートするデバイスのイメージだけを追加します。 各イメージのサイズをする必要があります。
- Default-568h@2x~iphone.png (640 x 1136 ピクセル)
- Default-Landscape@2x~ipad.png (2048 x 1496 ピクセル)
- デフォルト Landscape~ipad.png (1024 x 748 ピクセル)
- Default-Portrait@2x~ipad.png (2008 × 1536 ピクセル)
- デフォルト Portrait~ipad.png (1004 x 768 ピクセル)
- Default@2x~iphone.png (640 x 960 ピクセル)
- Default~iphone.png (320 x 480 ピクセル)
splashscreen.show
スプラッシュ画面が表示されます。
navigator.splashscreen.show();
説明
このメソッドは、アプリケーションのスプラッシュ スクリーンを表示します。
サポートされているプラットフォーム
- アンドロイド
- ブラックベリー 10
- iOS
- Windows Phone 7 と 8
- Windows 8
簡単な例
navigator.splashscreen.show();
完全な例
<!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
スプラッシュ スクリーンを閉じます。
navigator.splashscreen.hide();
説明
このメソッドは、アプリケーションのスプラッシュ スクリーンを閉じます。
サポートされているプラットフォーム
- アンドロイド
- ブラックベリー 10
- iOS
- Windows Phone 7 と 8
- Windows 8
簡単な例
navigator.splashscreen.hide();
完全な例
<!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 の気まぐれ
config.xmlファイルの AutoHideSplashScreen 設定する必要があります false 。 遅延を 2 秒間スプラッシュ スクリーンを非表示、する、タイマーを追加しますで次のように deviceready イベント ハンドラー。
setTimeout(function() {
navigator.splashscreen.hide();
}, 2000);