關於extjs6主題的信息

本文目錄一覽：

• 1、extjs6 pivot grid 在哪個目錄
• 2、extjs 中修改整個框架的顏色怎麼弄？？比如現在的藍色我改成黃色的
• 3、extjs 6 grid 更改選中行背景顏色，直影響當前grid
• 4、在eclipse里使用extjs6.0版本應該引用哪些文件
• 5、ExtJS 6有什麼新東西
• 6、如何去除extjs6的extjs bata圖標

extjs6 pivot grid 在哪個目錄

Extjs中界面風格與我們產品本身的風格有很大不同，從邊框、選中行的顏色到滑鼠移動到的行的顏色、菜單等，幾乎都不同。

選中行的顏色就可用如下設置完成：

.x-grid3-row-selected{background:#c6e2ff!important;}

其他的都類似，只要找到對應的class, 然後設置要修改的部分即可。

extjs 中修改整個框架的顏色怎麼弄？？比如現在的藍色我改成黃色的

這個屬於extjs框架主題的修改，

首先你可以去找一些主題css文件 下載下來，這裡我給你介紹一個：到

下載

然後做一個下拉列表這個簡單我就不贅述了，關鍵是下拉列表選擇後的操作是：

如果css路徑是cssFilePath ，那麼

//使用默認主題

Ext.util.CSS.removeStyleSheet(‘theme’);

//切換到其他主題

Ext.util.CSS.swapStyleSheet(‘theme’, cssFilePath);

extjs 6 grid 更改選中行背景顏色，直影響當前grid

Ext 4.2.1

/** * @var {color}

* The background-color of the selected row

*/$grid-row-cell-selected-background-color: #ccc !default;

Ext 5

$grid-cell-selected-background-color : color

The background-color of a selected cell when using a Ext.selection.CellModel.

Defaults to:

$grid-row-cell-selected-background-color

Ext 6

$list-item-selected-background-color : color

List item background-color when selected

Defaults to:

mix(#fff, $base-light-color, 25%)

Ext 6 好像依賴 $base-light-color 盡量不要修改其他配置

在eclipse里使用extjs6.0版本應該引用哪些文件

想要使用ExtJS，需要在頁面引入如下文件：

link rel=”stylesheet” type=”text/css” href=”ext/resources/css/ext-all.css”

script type=”text/javascript” src=”ext/ext-base.js”/script

script type=”text/javascript” src=”ext/ext-all.js”/script

script type=”text/javascript” src=”ext/ext-lang-zh_CN.js”/script

其中上面的為ExtJS的樣式文件，ExtJS漂亮的外觀均來自於該樣式，下面三個為Ext的JS文件，最後一個為ExtJS的簡體中文資源文件，

上面兩個包含了ExtJS的所有功能，如果不是對ExtJS有深入研究，不是超級用戶的話，個人推薦直接引入這兩個文件即可，需要注意前後引入的順序！

ExtJS 6有什麼新東西

以下是官方的介紹：

Ext JS 6統一了Ext JS 5和Sencha Touch框架，且允許創建基於所有平台和所有設備的通用應用程序。在Ext JS 5，將許多Sencha Touch的移動功能帶入了Ext JS，而且建立核心通用代碼。在Ext JS 6，Ext JS和Sencha Touch的UI組件將建立在通用核心之上，這樣，才讓使用單一的代碼來創建基於桌面到智能手機的應用程序成為可能。另外，在Ext JS 6還有大量的增強功能，尤其是在可訪問性、圖表和網格這一塊上。

我們用了一年多了，說實話，和5有區別都不大，就是有些自定義的控制項，寫法改變，比以前簡單了，但是總體上沒啥，不細研究，看不出來，當然我們主要是企業級開發

如何去除extjs6的extjs bata圖標

Extjs6 打開項目根目錄下的ext/classic/theme-base/sass/src/window/Window.scss

打開文件，搜索ext-watermark（Extjs6.0.2是在320行）。然後注釋掉如下兩段代碼。

:after {

//font-family: ext-watermark;——-注釋這一行

font-size: ($ui-header-line-height + vertical($ui-header-padding)) * 0.75;

//content: ‘d’;——–注釋這一行

position: absolute;

}

然後重新載入代碼，刷新幾次，奇蹟發生。恭喜你！

如果是panel的水印，是在panel/Panel.scss的399行。

Extjs6用了樣式ext-watermark;導致的水印。用eclipse全局檢索，定能夠找到目標。如果不行，請回復在給予解決！ 還有一個更絕的，就是把ext/classic/theme-base/sass/src/Component.scss開頭3-8行包含ext-watermark的樣式全部注釋掉，這個應該是全局的樣式。去試試吧！