Extjs 将工具栏中的默认ui值从暗改为亮

我有一些文本放在sencha touch移动应用程序中dataview的标题配置中。此数据视图依次出现在导航视图中，导航视图本身位于容器中

我在这里面临的问题是，我希望由于使用导航视图而出现在顶部的工具栏具有ui:'light'。默认情况下，如果我使用chrome的web inspector工具查看DOM中应用的类，它会显示.x-toolbar-dark类已应用于它。如何更改默认情况下应用于工具栏的ui:dark属性，因为我使用了navigationview

我正在自定义默认主题，并且我已经更改了主题的基色。但是由于工具栏上应用了深色ui，所以工具栏上应用了深色

我知道自定义mixin的用法，然后将这些mixin应用到工具栏，我们可以对其进行自定义…但我没有在此处创建工具栏，因此无法为其应用mixin。

上图显示了由于工具栏中的ui:dark导致的颜色差异。左边的颜色是原色

这里的基本问题是，当您提供标题时，如何决定将哪种ui样式应用于由于使用任何组件（如导航视图或for ex）而出现的工具栏

下面是我的导航视图代码

Ext.define('MobileApp.view.Offers.OffersNewNavigationView', {
   extend: 'Ext.navigation.View',
   xtype: 'offersnewnavigationview',
   config: {
      fullscreen: true,
      height: '100%',

      autoDestroy: false,
      defaultBackButtonText: '',
      navigationBar: {             
         items: [{
            align: 'left',
            id: 'newSlideBut',
            iconCls: 'list',
            ui: 'plain'
         }
         ]
      },
      items: [
      {
         xtype: 'offersnewdataview'
      }]

   }
});

我的坏……那太傻了。。！ 只需将uiconfig添加到代码中的navigationBarconfig属性……现在就可以完成这项工作

Ext.define('MobileApp.view.Offers.OffersNewNavigationView', {
   extend: 'Ext.navigation.View',
   xtype: 'offersnewnavigationview',
   config: {
      fullscreen: true,
      height: '100%',

      autoDestroy: false,
      defaultBackButtonText: '',
      navigationBar: {
         ui:'light',
         items: [{
            align: 'left',
            id: 'newSlideBut',
            iconCls: 'list',
            ui: 'plain'
         }
         ]
      },
      items: [
      {
         xtype: 'offersnewdataview'
      }]

   }
});

---

代码，总是代码！没有这个，我们应该做一切！顺便说一下，您应该使用事件，如

afterrender

。因为，页面已经呈现。我有一种方法..我可以覆盖.x-toolbar-dark类并将自定义颜色放在那里，但这不是正确的方法。。我想要一个sass或css解决方案，可以应用于整个应用程序的全局…我不明白你说的关于afterrender事件