Динамического изменения цвета панели навигации

Question

в сенче Touch 2 приложения, я использую панель навигации

var homeNavigation = { 
    extend: 'Ext.navigation.View', 
    xtype : 'homeView', 
    config : { 
     autoDestroy: false, 
     iconCls : 'homeicon', 
     title : 'Home', 
     navigationBar: { 
      items: [ 
       myInfoButton, 
       addButton 
      ] 
     }, 

     items: [ 
      { 
       xtype : 'homeIndexView' 
      } 
     ] 

    } 
}; 

Ext.define('MyAPP.view.Home', homeNavigation); 

Мне нужно, чтобы изменить его цвет на красный градиент.

Для этого я сделал следующее CSS-лист:

.x-toolbar-dar { 
    background-image: none; 
    background-color: #5a000b; 
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #b98182), color-stop(50%, #781a2c), color-stop(51%, #5a000b), color-stop(100%, #4a020e)); 
    background-image: -webkit-linear-gradient(top, #b98182, #781a2c 50%, #5a000b 51%, #4a020e); 
    background-image: linear-gradient(top, #b98182, #781a2c 50%, #5a000b 51%, #4a020e); 
    border-color: #4a020e; 
} 

он работает правильно и навигационная панель имеет разыскиваемого цвет.

Проблема

мне нужно изменить его цвет dynamicallym это где у меня возникли проблемы. Мне нужно checge это цвет, когда вид выталкивается в навигации

В контроллере я создал эту функцию:

applyThemeToNavigationBar : function() { 
         $(".x-toolbar-dark").css({ 
          "backgroundImage": "none", 
          "backgroundColor": "#5a000b", 
          "backgroundImage": "-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #b98182), color-stop(50%, #781a2c), color-stop(51%, #5a000b), color-stop(100%, #4a020e))", 
          "backgroundImage": "-webkit-linear-gradient(top, #b98182, #781a2c 50%, #5a000b 51%, #4a020e)", 
          "backgroundImage": "linear-gradient(top, #b98182, #781a2c 50%, #5a000b 51%, #4a020e)", 
          "backgroundColor": "#4a020e" 
         }); 

       } 

И в нажимной случае зрения: push : 'onViewPush' я называю выше функцию изменить CSS:

onViewPush: function(view, item) { 
        applyThemeToNavigationBar(); 
        alert('theme changed'); 
       } 

предупреждение, («они изменились») вызывается, когда вид нажата, но вид навигации не меняет цвет.

Спасибо за любую помощь

Answer 1

Поскольку панель инструментов также компоненты, вы должны быть в состоянии использовать addCls & removeCls изменить свои CLS приписывать какой класс CSS вы хотите.