【文章內(nèi)容簡介】 )清除約束使用initPageX和initPageY計算邊界值。resetConstraints()重置約束當(dāng)手工改動過DD元素的位置時，使用initPage和lastPage計算歷史的偏移值，是當(dāng)前l(fā)inked元素的位置為lastPage，再使用lastPage減去偏移值得到新的initPage，從而保持元素的位移狀態(tài)；重新計算constraint。getTick(val, tickArray)在tickArray中選擇離val最近的點toString()打印id繼承DragDrop，只覆蓋了toString方法。scroll如果為真，當(dāng)元素拖動的窗口邊界時會自動滾屏。atuoOffset(iPageX, iPageY)setDelta(iDeltaX, iDeltaY)設(shè)置delta值setDragElPos(iPageX, iPageY)alignElWithMouse(e,iPageX, iPageY)根據(jù)光標位置定位drag元素調(diào)用一次setXY，然后緩存了此元素在left和top為零時的基準坐標。下次調(diào)整坐標時，可以用iPage減去此基準坐標就能得出用于調(diào)整left和top的新值；調(diào)用cachePosition和autoScroll。cachePosition(iPageX, iPageY)更新lastPageautoScroll(x, y, h, w)當(dāng)drag元素被拖動到超出窗口邊界的位置時自動滾屏利用拖動元素的邊超越窗口的可視邊界時，判斷光標離邊界的距離是否小于閥值，如果是則滾動窗口一個預(yù)定的距離（IE為80，其他為30）；此函數(shù)在向上滾和向左滾的實現(xiàn)上故意不考慮光標問題，使得在邊界情況下也能表現(xiàn)正常。applyConfig()調(diào)用父類構(gòu)造函數(shù)和設(shè)置scrollb4MouseDown()記錄start和delta值b4Drag()調(diào)用setDragElPos移動元素toString()打印idresizeFrame新創(chuàng)建的代理是否與linked元素的形狀一樣。centerFrame新創(chuàng)建代理的中心是否與光標對齊。DDProxy(id, sGroup, config)構(gòu)造函數(shù)調(diào)用init和initFrame。createFrame()創(chuàng)建代理，如果沒有準備好，則延遲50毫秒在執(zhí)行自己一次；在IE中新創(chuàng)建的代理有可能被select戳穿，所以在里面加個透明的iframe；它還在里面加了個有背景顏色的fake層，不過具體用意沒看明白它的注釋。initFrame()調(diào)用createFrameapplyConfig()調(diào)用父類構(gòu)造函數(shù)和設(shè)置resizeFrame、centerFrame和dragElIdshowFrame(iPageX, iPageY)調(diào)整代理的大小和位置并顯示它_resizeProxy()調(diào)用代理大小長寬加邊框等于linked元素的大小。b4MouseDown()記錄start和delta值不知道為啥要覆蓋DD的，兩個方法好像一樣。b4StartDrag()調(diào)用showFrameb4EndDrag()隱藏代理endDrag()把linked元素移動到drag元素的位置上toString()打印idxt的組件結(jié)構(gòu)分析,附Ext組件結(jié)構(gòu)圖 , 印象最深的應(yīng)該是Ext的組件模式,很好的規(guī)范了組件設(shè)計,用Manager的統(tǒng)一管理,., 而后子類擴展和集成形成了一個單根的組件樹.Ext中使用組件的方式很不一樣,可以看一個例子.varformPanel=new({items:[{xtype:39。hidden39。,name:39。domainId39。},{fieldLabel:39。姓名39。,name:39。name39。,allowBlank:false},{fieldLabel:39。權(quán)限39。,xtype:39。bo39。,name:39。auth39。},{fieldLabel:39。帳號39。,name:39。account39。},{fieldLabel:39。Email39。,name:39。39。,vtype:39。39。},{fieldLabel:39。啟用39。,xtype:39。checkbox39。,name:39。enabled39。}]})。如此這樣就能實現(xiàn)一個包含了很多元素的表單, items里面定義了表單要顯示的輸入框等組件,但是items里面僅僅是簡單的json對象,怎么能顯示出來各種不同的表單元素呢?我們注意到items的每一個元素幾乎都有一個xtype屬性,這個xtype屬性就是描述組件類的關(guān)鍵.其實Ext里面的組件(Panel, Form Datepicker等等), 在定義完Class之后, . 簡單看一個box的組件, :(39。box39。,)。而在, //privateregisterType:function(xtype,cls){types[xtype]=cls。=xtype。},//privatecreate:function(config,defaultType){returnnewtypes[||defaultType](config)。}}。}()。//thiswillbecalledalotinternally,//shorthandtokeepthebytesdown=其實是執(zhí)行了registerType 這個方法,方法很簡單, 把xtype這個名字和對應(yīng)的cls放到types里面, 而后看到create 我們應(yīng)該會明白了, 以后想創(chuàng)建組件的時候,就調(diào)用 create({xtype: 39。box39。}) 就OK了那么我們看看items里面的元素是怎么創(chuàng)建的吧, , 恩,就在這個類里呢:1.//private2.lookupComponent:function(p){3.if(typeofp==39。string39。){4.return(p)。5.}elseif(!){6.return(p)。7.}8.returnp。9.},10.11.//private12.createComponent:function(config){13.return(config,)。14.},恩,基本就是這樣了, 希望對大家理解Ext有所幫助/************************* ***********************/附件是我弄的一個Ext的組件結(jié)構(gòu)圖, 還附有各個組件的說明, 希望大家喜歡, 大家快下呀.... ,文字性的東西就不多說,歡迎討論源碼下載地址: 或:52317037共享里也提供下載。效果如下圖所示:: html xmlns = head meta equiv =ContentType content =text/html。charset=utf8 / title 登錄系統(tǒng) / title link rel =stylesheet type =text/css href =plugins/extjs/ / link rel =stylesheet type =text/css href = / script type =text/javascript src =plugins/extjs/ / script script type =text/javascript src =plugins/extjs/ / script script type =text/javascript src =plugins/extjs/ / script script type =text/javascript = 39。plugins / extjs / ext / resources / images / default / 39。()。 // 初始化鼠標停留時的顯示框 = 39。side39。/ script style type =text/css .user { background : url(images/)norepeat1px2px 。 } .key { background : url(images/)norepeat1px2px 。 } .key,.user { backgroundcolor : FFFFFF 。 paddingleft : 20px 。 fontweight : bold 。 color : 000033 。 } / style / head body script src =javascript/ type =text/javascript / script div id =win class =xhidden / div / body / html /**//***@author冷雨***/LoginPanel=function(){varwin,f。varbuildForm=function(){//構(gòu)建一個表單面板容器f=new({//給面板的body元素指定自定義的CSS樣式信息bodyStyle:39。paddingtop:6px39。,//容器中元素的默認類型defaultType:39。textfield39。,//標簽的默認對齊方式labelAlign:39。right39。,//指定標簽的默認長度labelWidth:55,//標簽與字段錄入框之間的空白labelPad:0,//窗口是否顯示背景色frame:true,//容器中組件默認統(tǒng)一配置選項defaults:{//驗證字段是否能為空allowBlank:false,//字段寬度width:158},//指定容器中的元素items:[{//給元素添加CSS樣式cls:39。user39。,//元素的名稱name:39。userName39。,//指定字段的標簽fieldLabel:39。帳號39。,//為空時提示信息blankText:39。帳號不能為空39。},{cls:39。key39。,name:39。password39。,fieldLabel:39。密碼39。,blankText:39。密碼不能為空39。,inputType:39。password39。}]})。}。varbuildWin=function(){//構(gòu)建一個窗口面板容器win=new({//把該面板綁定于win這個DIV對象上el:39。win39。,//窗口面板標題title:39。登陸系統(tǒng)39。,//窗口面板寬度width:265,16