Ext2.0中 ViewPort 详解！!

softfire 2008-08-06

本文转自：http://www.17ext.com/showtopic-213.aspx

在使用ext的时候，好多组件需要指定renderTo属性才会被渲染到页面上

1.ViewPort代表整个浏览器显示区域，该对象渲染到页面的body区域，并会自动随着李兰其显示区域的大小自动改变，而且一个面板中只能有一个ViewPort实例。

看下面的代码：

Ext.onReady(function(){
  new Ext.Viewport({
  enableTabScroll:true,
  layout:"fit",
  items:[{title:"唯一的面板",
  html:"",
  bbar:[{text:" 添加 "},
  {text:" 删除 "}]
  }]
});

结果：

2.ViewPort主要用于应用程序的主界面，可以通过不同的布局来搭建出不同风格的应用程序主界面

看下面的代码：

Ext.onReady(function(){
  new Ext.Viewport({
      enableTabScroll:true,
      layout:"border",
      items:[{title:" 面板 ",
      region:"north",
      height:50,
      html:"<h1> 网站后台管理系统 !</h1>"
    },
    {
      title:" 菜单 ",
      region:"west",
      width:200,
      collapsible:true,
      html:" 菜单栏 "
    },
    {
      xtype:"tabpanel",
      region:"center",
      items:[{title:" 面板 1"},
      {title:" 面板 2"}]
    }
    ]
  });
});

发表回复

>>返回群组首页

Ext2.0中 ViewPort 详解！!

相关讨论

相关资源推荐