jsGears.com 技術論壇 - AJAX, JavaScript, jQuery, 網站開發, 前端效能優化's Archiver

wmh 發表於 2007-9-10 08:56

Ext 2.0 預覽

Ext 2.0 即將有新版本囉,即將的意思就是現在還是看得到、但是吃不到。無妨,先看看有什麼新東西吧。


[b][size=4][color=navy]Grouping & Group Summary[/color][/size][/b]
太正點了這個功能! Ext 原本的 Grid 就做得相當不錯,現在加上了一個階層的群組功能,還可以做群組加總,非常適合拿來做簡單的報表。

[url=http://extjs.com/playpen/ext-2.0-dev5/examples/grid/totals.html][img]http://extjs.com/playpen/screenshots/ext2.0/groups.gif[/img][/url]


[b][size=4][color=navy]Scrolling Tabs[/color][/size][/b]
Tab 也是 Ext 原本就有,現在再加上可左右捲動的功能,不用擔心 Tab 過多了。

[url=http://extjs.com/playpen/ext-2.0-dev5/examples/tabs/tabs-adv.html][img=550,248]http://extjs.com/playpen/screenshots/ext2.0/advtabs.gif[/img][/url]


[b][size=4][color=navy]Anchor Layout[/color][/size][/b]
是否覺得寫 Windows 程式時,物件大小可以隨著容器大小變動是個很方便的功能? 現在你在 Web 網頁上也可以做到了,Ext 在 Form 的功能上做了加強,用簡單的設定就可以達到這個目的。[code]var form = new Ext.form.FormPanel({
        baseCls: 'x-plain',
        labelWidth: 55,
        url:'save-form.php',
        defaultType: 'textfield',
        items: [{
                fieldLabel: 'Send To',
                name: 'to',
                anchor:'100%'  // anchor width by percentage
        },{
                fieldLabel: 'Subject',
                name: 'subject',
                anchor: '100%'  // anchor width by percentage
        },{
                xtype: 'textarea',
                hideLabel: true,
                name: 'msg',
                anchor: '100% -53'  // anchor width by percentage and height by raw adjustment
        }]
});[/code]


[b][size=4][color=navy]Column Tree[/color][/size][/b]
Ext 2.0 將會提供更多 Ext UI 客製化的範例,例如以下這個範例,Ext tree panel 在節點上加入了欄位,讓你的 tree 展現更多樣的風貌。

[url=http://extjs.com/playpen/ext-2.0-dev5/examples/tree/column-tree.html][img=550,386]http://extjs.com/playpen/screenshots/ext2.0/treecolumns.gif[/img][/url]


[b][size=4][color=navy]Web Desktop[/color][/size][/b]
這是另一個 Ext 2.0 的範例,你可以看到有開多個視窗的效果、有工作列等等,整個網頁看起來就像桌面應用程式一樣。

[url=http://extjs.com/playpen/ext-2.0-dev5/examples/window/desktop.html][img=550,460]http://extjs.com/playpen/screenshots/ext2.0/webdesktop.gif[/img][/url]


更多 Ext 2.0 的範例
[url]http://extjs.com/playpen/ext-2.0-dev5/examples/[/url]

凱森 發表於 2009-2-24 01:15

這真是太神奇了!jQuery!

版主提供的都是精典~
還在javascript卡等中~呼~

wmh 發表於 2009-2-24 08:54

哇,這則已經是舊聞了,現在 ExtJS 已經出了 2.2.1

頁: [1]

Powered by Discuz! Archiver  © 2001-2009 Comsenz Inc.