在 Sencha Touch 中为所有组件设置默认 UI答案

【问题标题】：Set a default UI across all components in Sencha Touch在 Sencha Touch 中为所有组件设置默认 UI
【发布时间】：2012-01-02 15:21:56
【问题描述】：

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

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

干杯！

【问题讨论】：

标签： sencha-touch sass compass-sass

【解决方案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（因为通过getUi()的变量'ui'总是会返回'light'）：

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

【讨论】：

【解决方案2】：

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

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

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

【讨论】：

【解决方案3】：

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

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

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

$base-color: #4bb8f0 ; $base-gradient: '光泽';

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

【讨论】：

谢谢，但我已经完成了。我的意思是，整个代码中都是具有class 属性的元素，例如x-carousel-dark。似乎每个元素都是dark。我希望用我自己的来代替它。