2014-09-04 34 views
0

我对包含少量控件的视图有看法。所有的控件都是可见的,而滑块根本不可见。我已经看到here的例子,但它不起作用。有人能指出我缺少的配置吗?ExtJS滑块在视图上不可见

Ext.define('KPS.view.LaunchPageMain', { 
    extend: 'Ext.window.Window', 
    requires: ['Ext.slider.Single'], 
    alias: 'widget.launchpagemain', 
    layout: 'fit', 
    maximized: true, 
    height: 500, 
    width: 500, 
    title: 'KPS', 
    modal: true, 
    draggable: false, 
    tools: [{ 
     xtype: 'sliderfield',//slider is also not working. 
     width: 200, 
     value: 3, 
     increment: 1, 
     minValue: 1, 
     maxValue: 5 
    }, { 
     xtype: 'button', 
     itemId: 'btnUserType', 
     text: 'User Roles', 
     menu: { 
      xtype: 'menu', 
      showSeparator: false, 
      items: [{ 
       xtype: 'checkboxgroup', 
       columns: 1, 
       itemId: 'selectionUserTypes', 
       vertical: true, 
       items: [{ 
        boxLabel: 'User', 
        name: 'userSelection', 
        inputValue: 'U' 
       }, { 
        boxLabel: 'Admin', 
        name: 'userSelection', 
        inputValue: 'A' 
       }, { 
        boxLabel: 'Super Admin', 
        name: 'userSelection', 
        inputValue: 'S' 
       }] 
      }] 
     } 
    }, { 
     xtype: 'button', 
     itemId: 'btnLogout', 
     text: 'Logout' 
    }], 
    items: [{ 
    xtype: 'contentView' 
}] 
}); 
+0

给它工作的人。问题是我正在使用自定义主题。有了这个主题,它是不可见的。使用默认的主题,它只是工作正常。我应该早点检查一下。 – user1640256 2014-09-04 14:40:17

回答

1

由于这个问题也发生在我身上,我会添加一些细节。

在带有滑块的全新ExtJS 4应用程序中,滑块不显示(不可见)。它只会在构建应用程序后出现(sencha app build)。它与CSS有关。

构建应用程序后,bootstrap.css更改CSS的源,之后,滑块呈现正确。

第一版本(bootstrap.css)之前: @import 'ext/packages/ext-theme-classic/build/resources/ext-theme-classic-all.css';

第一版本(bootstrap.css)后: @import 'build/production/Slider/resources/Slider-all.css';

的解决方案是构建应用程序。

+0

您的sencha应用程序构建提示修复了我的问题!谢谢。 – 2015-07-20 02:12:38