PDA

View Full Version : Display problem with panel in panel



aaronluo
6 Mar 2008, 6:09 PM
Hi everybody
I have a problem about displaying panels in one panel, even I set 'height' property of parent panel.
below is my code:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Typing Test System beta 1.0</title>
<link rel="stylesheet" type="text/css" href="lib/ext/resources/css/ext-all.css" />
<script type="text/javascript" src="lib/ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="lib/ext/ext-all.js"></script>
<!-- Common Styles for the examples -->
<script type="text/javascript" src="main.js"></script>

<style type="text/css">
.user-img {
background-image:url( /images/115.bmp )
}
.logo-img { background-image:url( images/qq.ico ) !important;}
</style>
</head>
<body>
<button id='win'>win</button>
</body>
</html>



/*
* Ext JS Library 2.0
* Copyright(c) 2006-2007, Ext JS, LLC.
* [email protected]
*
* http://extjs.com/license
*/
Ext.BLANK_IMAGE_URL = "lib/ext/resources/images/default/s.gif";

Ext.onReady(function(){
var btn = Ext.get('win');

btn.on('click',function(){
var win = new Ext.Window({
id:'main-win',
title:"QQ2008",
iconCls:'logo-img',
layout: 'border',
width:220,
height:440,
animCollapse:true,
constrainHeader:true,
border:false,
maximizable:true,
minimizable:true,
items:[
/* personal information */
{
xtype:'panel',
region:'north',
//These three panels can't display
items:[{title:'west',region:'west'},
{title:'center', region:'center'},
{title:'east', region:'east'}]
},


/* main func panel */
new Ext.TabPanel({
activeTab:0,
region:'center',
tabPosition:'bottom',
items:[{
title: 'tab1',
html:'<p>tab1</p>',
header:false,
border:false
},{
title:'tab1',
html:'<p>tab1</p>',
header:false,
border:false
}]
}),

/* settings panel */
{title:'foot', region:'south'}
]
});

win.show();
});
});

6 Mar 2008, 6:13 PM
The north panel needs to be set to border-layout

aaronluo
6 Mar 2008, 6:27 PM
Thanks djliquidice. I misunderstand that border-layout is the default layout of Panel:">.