Back

titanium 的样式tss文件：(titanium tss quick start)

发布时间: 2015-01-21 22:25:00

refer to:  http://docs.appcelerator.com/titanium/3.0/#!/guide/Alloy_Styles_and_Themes

tss文件的例子：

// This is applied to any element with the class attribute assigned to "container" 
".container": {
        backgroundColor:"white"
},
// This is applied to all Labels in the view
"Label": {
    width: Ti.UI.SIZE,
    height: Ti.UI.SIZE,
    color: "#000", // black
    transform: Alloy.Globals.rotateLeft // value is defined in the alloy.js file      
}, 
// This is only applied to an element with the id attribute assigned to "label"
"#label": {
    color: "#999" /* gray */
}

1. 任何的 titanium object属性，都可以做成tss的key. 例如： width, height, 都可以用在 createLabel({ width: ..., height: ... }) 中。

2. 跟CSS 一样，分成： id(#开头）， class(.开头）， 普通标签(例如 my_label), 优先级 id> class > 普通标签。

并且优先级最高的是 XML 中的样式。 例如: <Button width="100px" /> 。这里的width会覆盖tss中的样式。

3. 注释跟js 一样，使用 // 或者 /* ...*/

4. tss中样式的值，可以是：常量( '100px', Ti.UI.SIZE) 或者 变量( Alloy.Globals.x, Ti.Locale.getString(), ">>>") 。

5. 跟CSS 不一样的是， 不支持使用 ".parent_class #parent_id Button" 这样的 “hierarchy selector".

6. 全局样式，放在： style/app.tss   

Back