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"
}
        ]
    });
});