[Titanium Alloy] backgroundImageのiPhone3.5インチ、4インチ対応

More than 5 years have passed since last update.

Titanium、iOSアプリ初心者です。躓いたところの覚え書きです。

Windowの背景に画像を設定するにはbackgroundImageを指定するけど、

画面フルサイズの画像を背景にしたい場合、

3.5インチと4インチで画像サイズが違うのでどうするかってお話です。


スプラッシュ画像では判別してくれるのに...

スプラッシュ画像は、Default-568h@2x.pngというように「-568h@2x」が付いていると4インチRetina用の画像として判別されるから、WindowのbackgroundImageに使う画像もhoge-568h@2x.pngを用意しとけばよさそう!...と思ったけどそれは判別されなかった...悲しい...

そこで、以下の方法を試してみました。


用意するもの

img_hoge.png(3.5インチ用 320×480)

img_hoge@2x.png(3.5インチRetina用 640×960)

img_hoge_568h.png(4インチRetina用 640×1136)

4インチ用の画像に「@2x」を付けないのがみそです。

@2xがついてなければファイル名はなんでもいいです)


記述例


xml

<Alloy>

<Window id="window">
</Window>
</Alloy>


tss

"#window": {

backgroundImage: 'img_hoge.png'
}


js

if( Ti.Platform.displayCaps.platformHeight == 568 ){

$.window.backgroundImage = 'img_hoge_568h.png';
}


結論

Ti.Platform.displayCaps.platformHeightが568のときimg_hoge_568h.pngをbackgroundImageにするって書けばうまくいきました。

何か間違ってたら遠慮なく教えて下さい。

おわり。