Sencha Touch Ext.setup(2)

ども、小堤です。

先の投稿で、Ext.setupメソッドにしていするコンフィグオプションの解説を行いましたが、ここでは、それぞれのコンフィグオプションが指定されることにより、何が起こるのかを検証していきます。

addMetaTags

隠しコンフィグオプションとして紹介しましたが、初期値でtrue判定になるので、通常有効になっていると考えてください。
このaddMetaTagsが有効な場合、次のメタタグは、他のコンフィグオプションの設定にかかわらず設定されます。

<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0;">

参考：Using the Viewport Meta Tag

fullscreen

Appleデバイスをフルスクリーンモードで動作させる際に、適切なMETAタグを設定します。
falseを設定しない場合、METAメタタグが設定されます。

falseを指定しない限り有効になります。
有効な場合、次のタグが出力されます。

<meta name="apple-mobile-web-app-capable" content="yes">

参考：apple-mobile-web-app-capable

statusBarStyle

iPhone OSでのフルスクリーン時のステータスバースタイルを設定します。
有効な設定値は、”default”,”black”,”black-translucent”のいずれかです。

fullscreenコンフィグオプションが有効な場合のみ、このコンフィグオプションが評価されます。
statusBarStyleコンフィグオプションに文字列が指定されている場合に、有効になります。
有効な場合、次のタグが出力されます。

<meta name="apple-mobile-web-app-status-bar-style" content="指定された文字列">

参考：apple-mobile-web-app-status-bar-style

tabletStartupScreen

iPadで動作させる際のスタートアップ画像を指定します。
画像サイズは、768×1004である必要があり、縦方向（portrait）である必要があります。

tabletStartupScreen文字列が指定されていて、かつ、タブレット環境である場合に、次のタグが設定されます。

<meta name="apple-touch-startup-image" content="指定された文字列">

参考：Specifying a Startup Image

phoneStartupScreen

iPhoneまたはiPod touchで動作させる際のスタートアップ画像を指定します。
画像サイズは、320×460である必要があり、縦方向（portrait）である必要があります。

phoneStartupScreen文字列が指定されていて、かつ、携帯電話環境である場合に、次のタグが設定されます。

<meta name="apple-touch-startup-image" content="指定された文字列">

参考：Specifying a Startup Image

icon

使用するデフォルトアイコンを設定します。
ここで設定されるアイコンは、tabletIconとphoneIconに自動的に設定されます。
画像は、72×72の画像を指定してください。

iconコンフィグオプションに文字列で画像のパスを指定します。
この、コンフィグオプションを指定すると、tabletIconコンフィグオプションとphoneIconコンフィグオプションが指定されるため、それぞれのコンフィグオプションが有効になります。

tabletIcon

tablet用のアイコンを設定します。
iconコンフィグオプションが指定されている場合、この設定は無効です。
画像は、72×72の画像を指定してください。

文字列が指定されているか、iconコンフィグオプションが有効な場合に次のタグが生成されます。

<meta name="apple-touch-icon" content="指定された文字列">

また、glossOnIconコンフィグオプションが有効な場合は、代わりに、次のタグが生成されます。

<meta name="apple-touch-icon-precomposed" content="指定された文字列">

phoneIcon

phone用のアイコンを設定します。
iconコンフィグオプションが指定されている場合、この設定は無効です。
画像は、72×72の画像を指定してください。

文字列が指定されているか、iconコンフィグオプションが有効な場合に次のタグが生成されます。

<meta name="apple-touch-icon" content="指定された文字列">

また、glossOnIconコンフィグオプションが有効な場合は、代わりに、次のタグが生成されます。

<meta name="apple-touch-icon-precomposed" content="指定された文字列">

glossOnIcon

iPhone/iPad/iPod touch上のアイコンに対して角丸や光沢処理を加えます。

tabletIconコンフィグオプションとphoneIconコンフィグオプションが指定され、メタタグが指定される際に、apple-touch-icon-precomposedが指定されるようになります。

preloadImages

先読みする画像のURLを配列で指定します。

配列で指定したURLをsrc属性としてImageオブジェクトを生成します。

例：

Ext.setup({
    preloadImages : [
        'a.gif',
        'b.gif',
        'c.gif'
    ]
});

onReady

DOMの読み込みが完了下時点で呼び出される関数オブジェクトを指定します。

いままでの、Ext JSで記載してきたExt.onReadyと同様です。

例：

Ext.setup({
    onReady : function() {
       alert('onReady!')
    }
});

scope

onReadyコンフィグオプションで指定した関数オブジェクトのスコープを指定します。

onReadyで指定した関数オブジェクト内のスコープを変更する場合に指定します。
未指定時は、windowがカレントスコープになります。

例：

Ext.setup({
    onReady : function() {
       alert('onReady!');
       alert(this.foo);
    },
    scope : {
        foo: 'bar'
    }
});

はい、全部説明でした（笑）
先にもいいましたが、ソースコードリーディングしながら書いてるので、めっさ時間かかる。。。。
まぁ、ほぼほぼあってるはずです（爆

初歩で、Ext.onReadyのように指定するものが関数オブジェクト1個から始まったExt JSに対して、Sencha Touchは、コンフィグオプションで幾つか指定するようになっています。

なにこれ？とかコンフィグオプションで思ったときに参考にしてもらえればと思います。

あでゅ（手