Coolite：浅谈Container布局

时间：2010-09-14 来源：三江小C

1.把Panel劈两半布局

   <ext:Panel ID="Panel1" runat="server" Padding="8">
            <Items>
                <ext:Container ID="Container4" runat="server" Layout="Column" Height="270">
                    <Items>
                        <ext:Container ID="Container5" runat="server" LabelAlign="Right" Layout="form" ColumnWidth=".5">
                            <Items>
                            
                            </Items>
                        </ext:Container>
                        <ext:Container ID="Container6" runat="server" LabelAlign="Right" Layout="form" ColumnWidth=".5">
                            <Items>
                            
                            </Items>
                        </ext:Container>
                    </Items>
                </ext:Container>
 </Items>
</ext:Panel>

ColumnWidth=".5"即占panel的一半

如果想劈3份

再加个Container，3个ColumnWidth之和≤1

但如果某页面上部是5，5开，下面是3,3,3开，如何处理？

Container可以嵌套Container

</Items>
</ext:Panel>之上，再加个

<ext:Container ID="Container5" runat="server" Layout="Column" Height="200">
                    <Items>
                        <ext:Container ID="Container5" runat="server" LabelAlign="Right" Layout="form" ColumnWidth=".3">
                            <Items>
                            
                            </Items>
                        </ext:Container>
                        <ext:Container ID="Container6" runat="server" LabelAlign="Right" Layout="form" ColumnWidth=".3">
                            <Items>
                            
                            </Items>
                        </ext:Container>
                        <ext:Container ID="Container7" runat="server" LabelAlign="Right" Layout="form" ColumnWidth=".3">
                            <Items>
                            
                            </Items>
                        </ext:Container>
                    </Items>
                </ext:Container>

当界面复杂时，就比较头痛了，嵌着嵌着，自己头就大了

在画界面前，先在纸上把布局画出来，然后标上ID，这样就方便了些