Ext.Net 官网Demo 有几种布局http://examples.ext.net/
因需求不同,布局也同样多种多样,现整理部分常用的布局+源码
源码:
<form id="form1" runat="server">
<ext:ResourceManager ID="RMEmployeeInfos" runat="server" />
<div>
<ext:Viewport ID="Viewport1" runat="server" Layout="FitLayout">
<Items>
<ext:RowLayout ID="RowLayout1" runat="server">
<Rows>
<ext:LayoutRow RowHeight="0.03">
<ext:Toolbar ID="toolBarMenu" runat="server">
<Items>
<ext:Button ID="btnCreate" runat="server" Text="新建" Icon="FilmAdd">
</ext:Button>
<ext:Button ID="Button1" runat="server" Text="打开" Icon="FilmGo">
</ext:Button>
<ext:Button ID="Button2" runat="server" Text="编辑">
</ext:Button>
<ext:Button ID="Button3" runat="server" Text="删除">
</ext:Button>
<ext:Button ID="Button4" runat="server" Text="转抄">
</ext:Button>
<ext:Button ID="Button5" runat="server" Text="红字">
</ext:Button>
<ext:Button ID="Button6" runat="server" Text="蓝字">
</ext:Button>
<ext:ToolbarSeparator />
<ext:Button ID="Button7" runat="server" Text="打印">
</ext:Button>
<ext:ToolbarSeparator />
<ext:Button ID="Button8" runat="server" Text="提交">
</ext:Button>
<ext:Button ID="Button9" runat="server" Text="通过">
</ext:Button>
<ext:Button ID="Button10" runat="server" Text="退回">
</ext:Button>
<ext:Button ID="Button11" runat="server" Text="加签">
</ext:Button>
<ext:Button ID="Button12" runat="server" Text="委托">
</ext:Button>
<ext:Button ID="Button13" runat="server" Text="收回">
</ext:Button>
<ext:Button ID="Button14" runat="server" Text="催办">
</ext:Button>
<ext:Button ID="Button15" runat="server" Text="意见">
</ext:Button>
<ext:ToolbarSeparator />
<ext:Button ID="Button16" runat="server" Text="关联">
</ext:Button>
<ext:ToolbarSeparator />
<ext:Button ID="Button17" runat="server" Text="附件">
</ext:Button>
<ext:Button ID="Button18" runat="server" Text="历史">
</ext:Button>
<ext:Button ID="Button19" runat="server" Text="自定义">
</ext:Button>
<ext:ToolbarSeparator />
<ext:Button ID="Button20" runat="server" Text="帮助">
</ext:Button>
<ext:Button ID="Button21" runat="server" Text="关闭">
</ext:Button>
</Items>
</ext:Toolbar>
</ext:LayoutRow>
<ext:LayoutRow RowHeight="0.957">
<ext:Panel runat="server">
<Items>
<ext:BorderLayout runat="server">
<West Collapsible="true" MaxWidth="500" >
<ext:Panel ID="Panel5" runat="server" Title="West" Width="200">
<Items>
</Items>
</ext:Panel>
</West>
<Center>
<ext:Panel runat="server">
<Items>
<ext:BorderLayout ID="BorderLayout1" runat="server">
<Center MaxHeight="700" MinHeight="100">
<ext:Panel ID="Panel3" runat="server" Height="500" Layout="Accordion" Title="North">
</ext:Panel>
</Center>
<South Collapsible="true">
<ext:Panel ID="Panel4" Height="150" runat="server" Title="South">
</ext:Panel>
</South>
</ext:BorderLayout>
</Items>
</ext:Panel>
</Center>
</ext:BorderLayout>
</Items>
</ext:Panel>
</ext:LayoutRow>
</Rows>
</ext:RowLayout>
</Items>
</ext:Viewport>
</div>
</form>
二
源码:
<form id="form1" runat="server">
<div>
<ext:ResourceManager ID="ResourceManager1" runat="server">
</ext:ResourceManager>
<ext:Viewport ID="vpMainCenter" runat="server" Layout="Fit">
<Items>
<ext:RowLayout runat="server">
<Rows>
<ext:LayoutRow RowHeight="0.033">
<ext:Toolbar ID="toolBarMenu" runat="server">
<Items>
<ext:Button ID="btnCreate" runat="server" Text="新建" Icon="FilmAdd">
</ext:Button>
<ext:Button ID="Button1" runat="server" Text="打开" Icon="FilmGo">
</ext:Button>
<ext:Button ID="Button2" runat="server" Text="编辑">
</ext:Button>
<ext:Button ID="Button3" runat="server" Text="删除">
</ext:Button>
<ext:Button ID="Button4" runat="server" Text="转抄">
</ext:Button>
<ext:Button ID="Button5" runat="server" Text="红字">
</ext:Button>
<ext:Button ID="Button6" runat="server" Text="蓝字">
</ext:Button>
<ext:ToolbarSeparator />
<ext:Button ID="Button7" runat="server" Text="打印">
</ext:Button>
<ext:ToolbarSeparator />
<ext:Button ID="Button8" runat="server" Text="提交">
</ext:Button>
<ext:Button ID="Button9" runat="server" Text="通过">
</ext:Button>
<ext:Button ID="Button10" runat="server" Text="退回">
</ext:Button>
<ext:Button ID="Button11" runat="server" Text="加签">
</ext:Button>
<ext:Button ID="Button12" runat="server" Text="委托">
</ext:Button>
<ext:Button ID="Button13" runat="server" Text="收回">
</ext:Button>
<ext:Button ID="Button14" runat="server" Text="催办">
</ext:Button>
<ext:Button ID="Button15" runat="server" Text="意见">
</ext:Button>
<ext:ToolbarSeparator />
<ext:Button ID="Button16" runat="server" Text="关联">
</ext:Button>
<ext:ToolbarSeparator />
<ext:Button ID="Button17" runat="server" Text="附件">
</ext:Button>
<ext:Button ID="Button18" runat="server" Text="历史">
</ext:Button>
<ext:Button ID="Button19" runat="server" Text="自定义">
</ext:Button>
<ext:ToolbarSeparator />
<ext:Button ID="Button20" runat="server" Text="帮助">
</ext:Button>
<ext:Button ID="Button21" runat="server" Text="关闭">
</ext:Button>
</Items>
</ext:Toolbar>
</ext:LayoutRow>
<ext:LayoutRow RowHeight="0.957">
<ext:TabPanel runat="server" Region="Center" ID="tblMain" Border="false">
<Items>
<ext:Panel runat="server" ID="panel1" Title="Right" Border="false" AutoScroll="true">
<Items>
<ext:RowLayout runat="server" ID="layout1">
<Rows>
<ext:LayoutRow RowHeight="0.8">
<ext:Panel ID="layout1Panel" runat="server" Title="North" Collapsible="true">
<Items>
<ext:TableLayout runat="server" ID="tblPanel1" Columns="2">
<Cells>
<ext:Cell CellId="tblPanel1Left">
<ext:Panel runat="server" Border="false" Width="800">
<Items>
<ext:FieldSet ID="FieldSet2" runat="server" Title="Details" Collapsible="true" Layout="form">
<Items>
<ext:TableLayout ID="TableLayout1" runat="server" Columns="3">
<Cells>
<ext:Cell>
<ext:TextField ID="TextField1" Text="1111" runat="server" FieldLabel="1" />
</ext:Cell>
<ext:Cell>
<ext:TextField ID="TextField2" Text="2222" runat="server" FieldLabel="2" />
</ext:Cell>
<ext:Cell>
<ext:TextField ID="TextField3" Text="3333" runat="server" FieldLabel="3" />
</ext:Cell>
<ext:Cell>
<ext:TextField ID="TextField4" Text="4444" runat="server" FieldLabel="4" />
</ext:Cell>
<ext:Cell>
<ext:TextField ID="TextField5" runat="server" FieldLabel="5" />
</ext:Cell>
<ext:Cell>
<ext:TextField ID="TextField6" runat="server" FieldLabel="6" />
</ext:Cell>
<ext:Cell>
<ext:TextField ID="TextField7" runat="server" FieldLabel="7" />
</ext:Cell>
</Cells>
</ext:TableLayout>
</Items>
</ext:FieldSet>
<ext:FieldSet ID="FieldSet1" runat="server" Title="Details" Collapsible="true" Layout="form">
<Items>
<ext:TableLayout ID="TableLayout2" runat="server" Columns="3">
<Cells>
<ext:Cell>
<ext:TextField ID="TextField8" Text="1111" runat="server" FieldLabel="1" />
</ext:Cell>
<ext:Cell>
<ext:TextField ID="TextField9" Text="2222" runat="server" FieldLabel="2" />
</ext:Cell>
<ext:Cell>
<ext:TextField ID="TextField10" Text="3333" runat="server" FieldLabel="3" />
</ext:Cell>
<ext:Cell>
<ext:TextField ID="TextField11" Text="4444" runat="server" FieldLabel="4" />
</ext:Cell>
<ext:Cell>
<ext:TextField ID="TextField12" runat="server" FieldLabel="5" />
</ext:Cell>
<ext:Cell>
<ext:TextField ID="TextField13" runat="server" FieldLabel="6" />
</ext:Cell>
<ext:Cell>
<ext:TextField ID="TextField14" runat="server" FieldLabel="7" />
</ext:Cell>
</Cells>
</ext:TableLayout>
</Items>
</ext:FieldSet>
</Items>
</ext:Panel>
</ext:Cell>
<ext:Cell CellId="tblPanel1Right">
<ext:Panel ID="Panel3" runat="server" AutoHeight="true" AutoWidth="true">
<Items>
<ext:Image ID="Image1" runat="server" Height="300" Width="400" FieldLabel="照片" ImageUrl="\Resource\Images\ss.jpg">
</ext:Image>
<ext:Image ID="Image2" runat="server" Height="200" FieldLabel="照片" ImageUrl="\Resource\Images\ss.jpg" />
</Items>
</ext:Panel>
</ext:Cell>
</Cells>
</ext:TableLayout>
</Items>
</ext:Panel>
</ext:LayoutRow>
<ext:LayoutRow RowHeight="0.2">
<ext:TabPanel runat="server" ID="panel2TabPanel" Border="false">
<Items>
<ext:Panel ID="Panel4" Border="false" runat="server" Title="高级" Layout="FitLayout">
</ext:Panel>
</Items>
</ext:TabPanel>
</ext:LayoutRow>
</Rows>
</ext:RowLayout>
</Items>
</ext:Panel>
<ext:Panel runat="server" Title="right">
</ext:Panel>
</Items>
</ext:TabPanel>
</ext:LayoutRow>
</Rows>
</ext:RowLayout>
</Items>
</ext:Viewport>
</div>
</form>
作者:PEPE
出处:http://pepe.cnblogs.com/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。