Sep 26, 2011, 10:55 PM
[CLOSED] Visual error when hiding and showing panels in BorderLayout
I have a borderlayout with a button to show and hide the West and East region. If you try to hide/show the panels more than once, you get a visual error where the left panel still shows up even though it should be hidden.
Steps:
1. Press HideSideBar
2. Press ShowSideBar
3. Press HideSideBar again and notice the left panel is still visible in a collapsed state.
Edit: this seems to happen with Slate theme. If I use the default theme, I get a different visual error on the right side. Added attachment
Steps:
1. Press HideSideBar
2. Press ShowSideBar
3. Press HideSideBar again and notice the left panel is still visible in a collapsed state.
Edit: this seems to happen with Slate theme. If I use the default theme, I get a different visual error on the right side. Added attachment
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<script type="text/javascript">
var $c = function(id) {
return Ext.getCmp(id);
};
function toggleView(btn) {
if (btn.isHidingSidebars == null) {
btn.isHidingSidebars = true;
}
if (btn.isHidingSidebars) {
$c('tvBrowser').hide();
$c('pnlSections').hide();
$c('tvBrowser').collapse();
$c('pnlSections').collapse();
btn.setText('Show Sidebars');
btn.isHidingSidebars = false;
} else {
$c('tvBrowser').show();
$c('pnlSections').show();
$c('tvBrowser').expand();
$c('pnlSections').expand();
btn.setText('Hide Sidebars');
btn.isHidingSidebars = true;
}
}
</script>
<ext:ResourceManager runat="server" Theme="Slate">
</ext:ResourceManager>
<ext:Viewport runat="server" ID="v" Layout="FitLayout">
<Items>
<ext:Panel ID="Panel1" runat="server" Layout="BorderLayout">
<TopBar>
<ext:Toolbar ID="Toolbar1" runat="server">
<Items>
<ext:Button ID="btnSidebars" runat="server" Text="Hide Sidebars">
<Listeners>
<Click Fn="toggleView" />
</Listeners>
</ext:Button>
</Items>
</ext:Toolbar>
</TopBar>
<Items>
<ext:Panel runat="server" ID="pnlSections" Layout="VBoxLayout" Region="West" Split="true"
Width="200" Margins="5 0 5 5" BodyBorder="false" AnimCollapse="false" Collapsible="false">
<LayoutConfig>
<ext:VBoxLayoutConfig Align="Stretch" />
</LayoutConfig>
<Items>
<ext:Panel runat="server" Title="Row Layout" ID="pnlRow" Flex="1">
</ext:Panel>
<ext:Panel runat="server" Title="Column Layout" ID="pnlCol" Flex="1">
</ext:Panel>
</Items>
</ext:Panel>
<ext:Panel runat="server" ID="tvBrowser" Region="East" Width="200" Margins="5 5 5 0"
Split="true" Title="Available Content" AnimCollapse="false" Collapsible="false">
</ext:Panel>
<ext:Container ID="Container1" runat="server" Region="Center" BodyBorder="false"
Layout="Fit" Margins="5 0 5 0">
<Items>
<ext:Panel runat="server" ID="pnlOutput">
<TopBar>
<ext:Toolbar runat="server" ID="tbParameters">
<Items>
<ext:ToolbarTextItem Text="Parameters: ">
</ext:ToolbarTextItem>
</Items>
</ext:Toolbar>
</TopBar>
</ext:Panel>
</Items>
</ext:Container>
</Items>
</ext:Panel>
</Items>
</ext:Viewport>
</form>
</body>
</html>
Last edited by Daniil; Sep 27, 2011 at 1:41 PM.
Reason: [CLOSED]