cordovaでスプラッシュ画面を表示(android)
起動時に意味不明なスプラッシュ画面を表示するサンプル
※一瞬なのでわかりにくいが起動時に1〜2秒指定した画像を表示する
画像を準備する
適当な画像を作成するか用意する
画像サイズ
- 426☓320
drawable-ldpi
- 470☓320
drawable-mdpi
- 640☓480
drawable-hdpi
- 960☓720
drawable-xhdpi
まあこんな感じ、最初はわかりにくいので一番大きいもので試したほうが良いと思います。
androidのsdkツールでdraw9patchを起動し「Draw 9-patch」に変換する
「Draw 9-patch」?
なんか
[Android アプリの UI デザイン] 9-patch の作りかたのまとめと Tips | Developers.IO
によるとスケールする画像らしい、まあ詳しくは知らないけどまあ大丈夫でしょう
プラグインを取り込む
コマンド
$ cordova plugin add org.apache.cordova.splashscreen
config.xmlを編集
<?xml version='1.0' encoding='utf-8'?> <widget id="com.example.sample1" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0"> <name>Sampleapp1</name> <description> A sample Apache Cordova application that responds to the deviceready event. </description> <author email="dev@cordova.apache.org" href="http://cordova.io"> Apache Cordova Team </author> <content src="index.html" /> <access origin="*" /> <preference name="splashscreen" value="splash" /> <preference name="SplashScreenDelay" value="10000" /> </widget>
※直下にあるconfig.xmlを編集する。platform配下のものは上記のものを取り込むので編集する必要はない。
設定
<preference name="splashscreen" value="splash" /> <preference name="SplashScreenDelay" value="10000" />
※splashscreenは画像の名前
※SplashScreenDelayは時間(ミリ秒)
ファイル設定
変換した「Draw 9-patch」のファイルを設定する
あとビルドすればでるはず
所感
スプラッシュ画面を出すアプリはよく見ていたけど、実際に出す方法がちょっとわからなかったのでやってみました。最初になんか裏で処理を実行できることがある場合は便利な感じがします。
参考
[iOS/Android対応] HTML5 ハイブリッドアプリ開発[実践]入門 (Software Design plus)
- 作者: 久保田光則,アシアル株式会社
- 出版社/メーカー: 技術評論社
- 発売日: 2013/12/20
- メディア: 単行本(ソフトカバー)
- この商品を含むブログ (3件) を見る