Ext.Viewport

Ext.Viewport代表浏览器窗口的整个显示区域，将document body作为渲染对象，它会根据浏览器窗口的大小自动调整自身的尺寸。
 在一个页面中只允许出现一个Viewport实例，没有提供对滚动条的支持。

 

Ext.onReady(function(){
    var accordion = new Ext.Panel({
        title: "功能分组",
        layout: "accordion",
        layoutConfig: {
            animate: true
        },
        width: 250,
        minWidth: 100,
        region: "west",
        split: false,
        collapsible: true,
        items: [
            {title:"嵌套面板一", html:"嵌套面板一", iconCls:"save"},
            {title:"嵌套面板二", html:"嵌套面板二", iconCls:"search"},
            {title:"嵌套面板三", html:"嵌套面板三", iconCls:"back"}
        ]
    });

    new Ext.Viewport({
        title: "Viewport",
        layout: "border",
        defaults: {
            bodyStyle: "background-color: #FFFFFF;",
            frame: true
        },
        items: [
            accordion,
            {region:"north", height:100},
            {region:"center"}
        ]
    });
});