kid12342001 2009-06-21 10:44
浏览 226
已采纳

EXT布局问题

目前代码
Ext.onReady(function(){
new Ext.Viewport({ //实例化布局对象
layout:"border", //声明为border布局
items:[{ //布局项目
region:"north",//表示为north区域,顶部区
height:50, //区域高度
title:"顶部面板" //区域标题
},{
region:"center",
//autoLoad:{url:"hello.jsp",scripts:true},//中间加载的网页,并允许支持JS脚本
//enableTabScroll : true,
//titlebar: true,
//autoScroll: true,//多出内容出现滚动条
title:"中央面板"
},{
region:"west",
width:150,
collapsible : true,//是否可以收缩,默认不可以收缩,即不显示收缩箭头
split : true,//是否可以改变面板大小
html:"选项1
选项2
选项3",
title:"左边面板"
}]
});

});
[img]http://kid12342002.iteye.com/upload/picture/pic/39020/120d9f69-147b-3773-85cc-72141f5e6117.jpg[/img]
我现在要把中央面板换成,Advanced Tabs的先项卡(也就是ext2.2API这种),

  • 写回答

1条回答 默认 最新

  • zhoujuan520 2009-06-21 10:45
    关注

    so easy 你仔细研究官方示例你就会明白
    [code="js"]Ext.onReady(function() {
    var tabs = new Ext.TabPanel({
    region: 'center',
    width: 600,
    height: 250
    });
    new Ext.Viewport({ //实例化布局对象
    layout: "border",
    //声明为border布局
    items: [{
    region: "north",
    //表示为north区域,顶部区
    height: 50,
    //区域高度
    title: "顶部面板" //区域标题
    },
    tabs, //上面定义的tab
    {
    region: "west",
    width: 150,
    tbar: [{
    text: '增加右侧Tab',
    handler: function() { //点击时所要触发的函数
    tabs.add({
    title: '新tab',
    //标题
    html: '我是新增的tab的内容',
    //内容
    closable: true //设置新增的面板可以被关闭
    }).show(); //渲染出来
    }
    }],
    collapsible: true,
    //是否可以收缩,默认不可以收缩,即不显示收缩箭头
    split: true,
    //是否可以改变面板大小
    html: "选项1
    选项2
    选项3",
    title: "左边面板"
    }]
    });
    });[/code]

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?