PDA

View Full Version : BorderLayout with split & collapsed = true



matjaz
25 Jun 2007, 5:32 AM
If you setup a region with split: true and collapsed: true
SplitBar element will be positioned at top left corner of layout.

I came to this line in SplitLayoutRegion.applyConfig():

if(config.hideWhenEmpty || config.hidden){
this.hideSplitter();
}
For now I fixed it by adding hideWhenEmpty: true, but that is not it.
Splitter must be hidden also when region is collapsed. So it is a bug.

matjaz
28 Jun 2007, 5:52 AM
here is the code which produces this bug:

Ext.onReady(function(){
var layout = new Ext.BorderLayout(document.body, {
center: {},
east: {
split: true,
collapsible: true,
collapsed: true,
//hideWhenEmpty: true, // this fixes split bar issue, but... it's just *not* it
initialSize: 200,
}
});

layout.beginUpdate();
layout.endUpdate();
});
If you look at top left corner, you'll see SplitBar splitter image.

tryanDLS
28 Jun 2007, 7:42 AM
You didn't add any panels to the layout, so it may be having issues trying to calculate the sizes of things. You could try putting a minSize on the regions.

matjaz
28 Jun 2007, 8:09 AM
Well, I didn't found this bug with layout without panels... :)

Problem is, when you have split: true, collapsible: true, collapsed: true in config. of region.
In first post I pointed it out where the problem is. I hope now you understand full problem and you'll fix it in next beta. ;)

Here is full code so you can reproduce this bug:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Layout</title>
<link rel="stylesheet" type="text/css" href="/res/ext/resources/css/ext-all.css">
<script type="text/javascript" src="/res/ext/base.js"></script>
<script type="text/javascript" src="/res/ext/ext-all-debug.js"></script>

<script type="text/javascript">
Ext.onReady(function(){
var layout = new Ext.BorderLayout(document.body, {
center: {},
east: {
split: true,
collapsible: true,
collapsed: true,
title: "East panel",
//hideWhenEmpty: true, // this fixes split bar issue
minSize: 100,
maxSize: 300,
initialSize: 200,
}
});

layout.beginUpdate();
layout.add("center", new Ext.ContentPanel("center"));
layout.add("east", new Ext.ContentPanel("east"));
layout.endUpdate();
});
</script>
</head>
<body>
<div id="center"><-- look at this splitter image</div>
<div id="east">East content</div>
</body>
</html>I also attached screen how it looks.

matjaz
1 Aug 2007, 8:03 AM
I can still confirm this in 1.1 release. :(
Can someone take a look at it, please.

jack.slocum
1 Aug 2007, 8:25 AM
Should be fixed in SVN.