廢話不多說了，上篇文章建立了比較基礎的檔案。今天開始搭建大體的框架，由於extjs4在元件建立方面有了很大的改變，所以第一次建立的框架頁面還是費了比較長的時間。本章內容增加了一些及css檔案，目的是為了美化整個介面。增加的css檔案：
而頭部、選單、內容區及底部則完全分離成4個js檔案，我們將先實現這幾個檔案的基礎功能，之後我們會慢慢完善這些元件。而整個頁面的填充，也使用乙個js檔案來完成。也許有人會問，這麼多檔案，是不是要都在index.html中引入啊。這樣想的話，就錯了哦。因為我們使用的是extjs4，所以我們一定要使用extjs4動態載入功能。
先來看下自定義css（sytle.css）：
#header
#header h1
.tabs{}
.tabs
.manage
.home
.icon-menu
搭建的框架是經典的extjs布局模式，如圖所示：
"-//w3c//dtd xhtml 1.0 transitional//en"
"">
"">
ext.loader.setconfig();
name: 'sms',
controllers: [
'main'
] });
稍做解釋：
ext.loader.setconfig();//意思是開啟ext.loader。ext.loader是動態載入的核心哦。。
配置中的name，我理解為是extjs3.x、extjs2.x中的命名空間。
main.js：
ext.define('sms.controller.main', })
整理下思路，由於extjs4自動載入了view/viewport.js，而viewport.js檔案包含了頭部、選單、內容區及底部這4個元件，那麼我們必須先完成這4個檔案的編寫，同樣，由於這4個檔案是介面型的，我們將這4個檔案都放到view資料夾下。
view資料夾下共5個js檔案，分別為：
header.js、menu.js、south.js、tabpanel.js及viewport.js
這5個js檔案的作用，我們一一介紹。
header.js：這個是頭部，也就是深藍色底子。白色字型，那塊，上面寫著員工管理系統。
**為：
ext.define('sms.view.header', );
this.callparent(arguments);
} });
menu.js:
ext.define('sms.view.menu',);
this.callparent(arguments);
} })
treepanel並沒有載入選單項，關於extjs4 tree，我們後面會介紹。
tabpanel.js：
ext.define('sms.view.tabpanel',,
activetab: 0,
border: false,
//plain: true,
items:
});
this.callparent(arguments);
} })
south.js：
ext.define('sms.view.south',);
this.callparent(arguments);
} })
檔案都建立好了。我們進行最後一部，布局。
viewport.js：
ext.define('sms.view.viewport',]
});
me.callparent(arguments);
} })
重點：requires屬性，這個我理解為建立引用。稍懂程式語言的人應該都明白。但是光引用還不夠，我們還需要去例項化它，也就是ext.create。至此，我們的框架已經順利搭建完畢。
今天的工作也就是這麼多，搭建完框架之後，會慢慢豐富整個系統。本來想連選單的樹也完成，最後想了想，這工作還是留到明天吧。因為樹涉及到了非同步獲取，需要有服務端程式，今天弄好框架之後，把服務端**寫好了，明天來完成這棵樹的實現吧。
需要注意的一點，在extjs4中，只要定義了布局為border，那麼他的items中必須要有region: 'center'的元件，否則將會提示錯誤。貌似在extjs3.x甚至是以前的版本都沒發現有這樣的要求，因為這個，費了老大的勁才調整過來，再一看，**全部變了，已經跟extjs3.x的風格完全不同了。令人欣喜的是，現在的**完全符合extjs4的風格，也完全符合我的預期。
如果你的extjs4版本為extjs4.02a以下版本，則不需要任何改動。完全可以顯示完整框架。
ext.loader.setconfig();
name: 'sms',
autocreateviewport: true,
controllers: [
'main'
] });
設定。
Extjs4開發筆記（一） 準備工作
重寫原因 由於開始準備的時候，就是按照傳統開發去做的，寫了一部分之後，有和同事提出 為什麼不用mvc模式 呢？這樣的問題讓我對目前傳 統開發的心發生了一些細微變法，對啊，為什麼不用mvc模式呢？我徵求了一下同事及熱心的意見，都同意使用mvc模式開發。從而，我刪掉了原來所有目 錄，重新按照mvc模式去...
ExtJS4學習筆記 一 window的建立
extjs4,建立ext元件有了新的方式，就是ext.create 而且可以使用動態載入js的方式來加快元件的渲染，我們再也不必一次載入已經達到1mb的ext all.js了，本文介紹如何在extjs4中建立乙個window。編者注 修正於2011 7 8 中所有ext.window應該是ext.w...
Extjs4開發中的一些問題
1.子frame重新整理的問題 一般在jsp裡面，要實現介面跳轉，有很多方法，最典型的就是window.location.href href 但是在巢狀有iframe框架的頁面布局，使用上述語句，只會使iframe本身實現跳轉，如果遇到session超時，而進入登入介面的時候，也會使登入介面顯示在i...