Question

在Sencha Touch中，是否可以定义适用于所有组件的默认UI，如“light”或“dark”（除非明确覆盖）？

目的是避免为每个元素声明ui: "dark"或任何自定义UI。

干杯！

Answer 1

你可以试试这个：

Ext.apply(Ext.Component.prototype, {
    getUi: function() {
        var defaultUi = 'light';
        // value of [this.config.ui] is ignored here
        // we can use something like forcedUi
        return (this.forcedUi) ? this.forcedUi : defaultUi;
    }
})

这段代码的缺点是我们需要指定另一个变量来应用与'light'不同的ui（因为变量'ui'通过getUi（）将始终返回'light'）：

...
items: [{
    xtype: 'button',
    forcedUi: 'dark'
}]
...

Answer 2

我被困在Touch 1.1上，所以sunsay的解决方案对我不起作用，但这样做了：

Ext.CustomToolbar = Ext.extend(Ext.Toolbar, 
{
    ui:'app'
});
Ext.reg('toolbar', Ext.CustomToolbar);

因此，它仍然是逐个组件类型，而不是逐个组件实例。由于您可以覆盖“reg”，因此无需在整个地方使用自定义x类型。

Answer 3

我假设您了解sencha触摸样式和主题。否则，您可以从此链接下载pdf文件，该文件清楚地描述了如何操作...

http://f.cl.ly/items/d9df79f57b67e6e876c6/SenchaTouchThemes.pdf

在其中他们提到了scss文件，你可以在其中指定基色，即

$ base-color：＃4bb8f0; $ base-gradient：'有光泽';

然后运行它...你可以看到用你提到的颜色和渐变创建的工具栏和按钮。

在Sencha Touch中的所有组件上设置默认UI

3 个答案: