[CLOSED] Height of a panel inside RowLayout does not apply when the RowLayout is inside a TabPanel

  1. #1

    [CLOSED] Height of a panel inside RowLayout does not apply when the RowLayout is inside a TabPanel

    Hello,

    Here's a row layout that works nicely:
    1) The top panel is 70px
    2) The bottom row panel is the remainder of the space (using RowHeight=1 - I assume that is the right thing to do?)

    <%@ Page Language="C#" %>
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <title>Row Layout - Ext.NET Examples</title>
    </head>
    <body>
        <ext:ResourceManager ID="ResourceManager1" runat="server" />
        
        <ext:Viewport ID="Viewport1" runat="server">
            <Items>
                <ext:Panel ID="RowLayout1" Layout="ux.row" runat="server">
                    <Items>
                        <ext:Panel ID="Panel1" runat="server" Title="Initial Height = 70px" Height="70" />
                        <ext:Panel ID="Panel2" runat="server" Title="Initial Height = 100%" RowHeight="1" />
                    </Items>
                    <LayoutConfig>
                        <ext:RowLayoutConfig Split="true" Background="false" />
                    </LayoutConfig>
                </ext:Panel>
            </Items>
        </ext:Viewport>
    </body>
    </html>
    Now, if I wrap all that inside a TabPanel (which is inside a fit layout) then the top panel is very large (depending on the height of your browser window) and I can't get Height to apply. I can use something like RowHeight=0.25 for the top panel, but I need to define a fixed height for it:

    <%@ Page Language="C#" %>
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <title>Row Layout - Ext.NET Examples</title>
    </head>
    <body>
        <ext:ResourceManager ID="ResourceManager1" runat="server" />
        
        <ext:Viewport ID="Viewport1" runat="server">
            <Items>
                <ext:FitLayout ID="FitLayout1" runat="server">
                    <Items>
                        <ext:TabPanel ID="TabPanel2" Plain="true" TabPosition="Bottom" runat="server">
                            <Items>
                                <ext:Panel ID="Panel6" Title="tab 1" Layout="ux.row" runat="server">
                                    <Items>
                                        <ext:Panel ID="Panel7" runat="server" Title="Initial Height = 70px" Height="70" />
                                        <ext:Panel ID="Panel8" runat="server" Title="Initial Height = 100%" RowHeight="1" />
                                    </Items>
                                    <LayoutConfig>
                                        <ext:RowLayoutConfig Split="true" Background="false" />
                                    </LayoutConfig>
                                </ext:Panel>
                            </Items>
                        </ext:TabPanel>
                    </Items>
                </ext:FitLayout>
            </Items>
        </ext:Viewport>
    </body>
    </html>
    Any suggestions welcome.

    Thanks!
    Last edited by Daniil; Feb 02, 2011 at 10:45 AM. Reason: [CLOSED]
  2. #2
    Hi,

    Fixed in SVN. Please update from SVN
    If you don't want to update whole toolkit then update row layout file (http://svn.ext.net/premium/trunk/Ext...t/RowLayout.js) and rebuild scripts (http://svn.ext.net/premium/trunk/Ext...tnet/build.bat)
    Vladimir Shcheglov
    Sr. Developer
  3. #3
    Many thanks for the quick turnaround. When it renders, the panel's height in my example now honors the height property (70px in this case).

    However, I noticed something odd with the splitter. If you just click it (keep it pressed for about a second) or click it and then just drag it very slightly up or very slightly down, it seems to jump to 100px minimum height for the splitter. Once the new height is set, the splitter cannot be be readjusted to get the top panel back to 70px. Have I configured it wrong or is that another issue?
  4. #4
    Hi,

    Confirmed.

    The same issue occurs with ColumnLayout.

    Example
    <%@ Page Language="C#" %>
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <title>ColumnLayout issue - Ext.NET Example</title>
    </head>
    <body>
        <ext:ResourceManager runat="server" />
        <ext:Panel runat="server" Height="400" Layout="column">
            <LayoutConfig>
                <ext:ColumnLayoutConfig Split="true" />
            </LayoutConfig>
            <Items>
                <ext:Panel runat="server" Title="Initial Width = 70px" Width="70" />
                <ext:Panel runat="server" Title="Initial Width = 100%" ColumnWidth="1" />
            </Items>
        </ext:Panel>
    </body>
    </html>
    Last edited by Daniil; Jan 31, 2011 at 8:51 PM. Reason: Minor correction
  5. #5
    Hi,

    Just 100px is hardcoded min height for a splitter in the row layout. I am not sure what it was harcoded. We will fix it
    Vladimir Shcheglov
    Sr. Developer
  6. #6
    ColumnLayout has been fixed - revision #3425.

    The next is RowLayout. I will let you know.
  7. #7
    The fix for RowLayout has been added to SVN, revision #3426.

    Please update and re-test. Any feedback would be appreciated.
  8. #8
    Hi,

    Thanks for the updates. Just got latest and it looks fixed to me. Thanks for the quick turnaround!

Similar Threads

  1. [CLOSED] RowLayout with Splitter inside BorderLayout
    By softmachine2011 in forum 2.x Legacy Premium Help
    Replies: 6
    Last Post: May 22, 2012, 8:11 AM
  2. Replies: 3
    Last Post: May 18, 2011, 7:06 PM
  3. Replies: 9
    Last Post: Oct 07, 2010, 6:27 PM
  4. Full Height for parent Panel when using RowLayout
    By henricook in forum 1.x Help
    Replies: 3
    Last Post: Jun 07, 2010, 12:41 PM
  5. Setting row height of RowLayout
    By moth1 in forum 1.x Help
    Replies: 1
    Last Post: Jul 22, 2009, 4:10 AM

Posting Permissions