Coolite：浅谈Container布局

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，这样就方便了些