Sencha Touch学习笔记（十一）主题

Sencha Touch提供了很多主题

那我们怎么替换掉默认的主题呢？
在通过cmd生成的工程框架里有一个app.json的文件
里面有一段配置

"css": [
    {
        "path": "resources/css/sencha-touch.css",
        "platform": ["chrome", "safari", "ios", "ios-classic", "android", "firefox"]
    }
]

甚至你还可以对不同的平台使用不同的主题

"css": [
    {
        "path": "resources/css/sencha-touch.css",
        "platform": ["desktop"],
        "update": "delta"
    },
    {
        "path": "resources/css/wp.css",
        "platform": ["ie10"],
        "theme": "Windows",
        "update": "delta"
    },
    {
        "path": "resources/css/cupertino.css",
        "platform": ["ios"],
        "theme": "Cupertino",
        "update": "delta"
    },
    {
        "path": "resources/css/cupertino-classic.css",
        "platform": ["ios-classic"],
        "theme": "CupertinoClassic",
        "update": "delta"
    },
    {
        "path": "resources/css/mountainview.css",
        "platform": ["android"],
        "theme": "MountainView",
        "update": "delta"
    },
    {
        "path": "resources/css/bb10.css",
        "platform": ["blackberry"],
        "theme": "Blackberry",
        "update": "delta"
    }
],

什么？你说你没有用cmd生成工程，只是自己搭建的引用了touch包？
那么更好办了，在index.html中把<link rel="stylesheet" href="touch/resources/css/sencha-touch.css" type="text/css">替换成你想要的样式css，比如说黑莓的<link rel="stylesheet" href="touch/resources/css/bb10.css" type="text/css">

当然你也可以自定义一个css文件。然后引用你自己的css