2011年7月11日月曜日

Titanium Mobileで背景画像を繰り返し表示する


Titanium Mobileの背景画像を繰り返し表示する方法(タイル表示)がどうも標準で用意されていないようだったので、モジュールを作りました。

github: https://github.com/atsusy/tirepeatedbackgroundimage

<<はじめに>>
* iOS専用です
* githubからのクローン方法およびモジュールのビルド方法については割愛します

<<利用方法>>
1. 取り込みたいプロジェクトのtiapp.xmlの<modules>タグ内に以下を追記して下さい
<module version="1.0">jp.msmc.repeatedbackgroundimage</module>

2. タイル表示したいビューに以下のような感じでrepeatedBackgroundImageプロパティを設定して下さい
// ビューの場合
    var view = Titanium.UI.createView({
        repeatedBackgroundImage:'hoge.png' // 繰り返し表示したい画像を指定します
    });

3. ウィンドウも同様にrepeatedBackgroundImageプロパティに画像を設定する事でタイル表示できます


タイル表示したい画像(hoge.png[75x75])

var window = Ti.UI.createWindow({
 repeatedBackgroundImage:'hoge.png'
});
window.open();
app.js


こんな感じになります