Help us understand the problem. What is going on with this article?

Titanium Alloy の オレオレ app.tss テンプレート

More than 5 years have passed since last update.

プロトタイピング的にAlloyでViewをだーっと先に作る事あるじゃないですか。

別にFLINTOでもPOPでもいいんですけど、TitaniumerならAlloyで書いちゃった方が合理的なので。

そんな時は app/styles/app.tss に大体のテーマ的な何かを書いておいたりすると捗りますよね。

Alloy Styles and Themes - Titanium 3.X - Appcelerator Docs

別にプロトタイピングに限った話では無いですけれど、
個人的に app.tssに必ず書くやつのパターンみたいなのがあるので、纏めてみました。

まずは Window。特にiOSはNavigation BarやらStatus Barやら色々と組み合わせがあって面倒ですけど仕方ない。

'Window': {
    backgroundColor: '#ffffff', // 画面背景色
    barColor: "aqua", // ナビゲーションバーの背景色
    tintColor : "red", // 配下のViewの色合いに影響 (TextAreaのキャレット色とか)
    navTintColor : "blue", // 子Windowで戻るのクチバシの色とか
    translucent: false, // NavBarがうっすら透けて下のWindowのNavbarが見えちゃう時にはこれ
}

"Window[platform=ios]": {
    statusBarStyle: Ti.UI.iPhone.StatusBar.DEFAULT,
    titleAttributes:  { // NavBarのタイトルのスタイル
        color:'#fff',
        font: {
            fontFamily: "HiraKakuProN-W6", // ヒラギノ角ゴ bold
        },
    }
},

Androidはこちら。Window内にTextFieldとかがあるとOpen時にハイライトがあたってソフトキーボードが出ちゃうのを抑制したいので。

"Window[platform=android]": {
    windowSoftInputMode: Ti.UI.Android.SOFT_INPUT_STATE_ALWAYS_HIDDEN
}

"TabGroup[platform=android]": {
    windowSoftInputMode: Ti.UI.Android.SOFT_INPUT_STATE_ALWAYS_HIDDEN
}

Buttonはこちら。 iOS6だとコレを指定しないとデフォルトで角丸の枠有りなボタンになるので。
というかiOS8に対応したらもうiOS6はオワコンみたいなのでもう不要になりますけど。

"Button": {
    backgroundImage: ''
}

ImageViewはコレが無いと、リモートの画像とかがロードされるまで山の絵のやつが出てカッコ悪いので。

'ImageView': {
    defaultImage: ''
}

Androidのズームコントロールは隠したいです。

'ImageView[platform=android]': {
enableZoomControls: false
}

TableViewとListViewの罫線は左までピッタリになって欲しいって言われる事が多いです。

"TableView[platform=ios]": {
    separatorInsets: {
        left: 0, right: 0
    }
}

"ListView[platform=ios]": {
    separatorInsets: {
        left: 0, right: 0
    }
}

あとLabelは色々書くこと多いんですけど、alignとかfontFamilyとかすぐスペル忘れちゃうのでリファレンスも兼ねて書いてます。

"Label": {
    width: Ti.UI.SIZE,
    height: Ti.UI.SIZE,
    textAlign: Ti.UI.TEXT_ALIGNMENT_CENTER,
    verticalAlign: Ti.UI.TEXT_VERTICAL_ALIGNMENT_CENTER, 
    color: "#000",
    font: {
        fontSize: "14dp",
        fontFamily: "HiraKakuProN-W3", // ヒラギノ角ゴ normal
    }
}

gistに纏めてみました。気が向いたらブラッシュアップします。

app.tss template - Titanium Alloy

hntn
何事も中途半端です。スレート状のスマホ的なものが大好きです。 サーバサイドのJava書いてた流れでAndroidを少しと、最近Titanium成分が多めです。
http://www.close-to.biz/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away