用Ext.Net 写一个前端界面 不用JS 创建 用ASPX 编写顶部一个大TextField 组件,中间水平两个TextField 组件 2行,底部一个GridPanel
时间: 2024-03-01 16:50:23 浏览: 147
以下是一个简单的Ext.Net前端界面示例,其中包括一个顶部大TextField组件,中间水平两个TextField组件(2行),以及一个底部GridPanel组件。这个示例使用ASPX编写。
```
<ext:ResourceManager runat="server" />
<ext:Viewport runat="server">
<Items>
<ext:Panel runat="server" Title="My Panel" Height="100%" Width="100%">
<Items>
<ext:TextField runat="server" FieldLabel="Top Field" Width="100%" />
<ext:Container runat="server" Layout="HBox">
<Items>
<ext:Container runat="server" Layout="VBox">
<Items>
<ext:TextField runat="server" FieldLabel="Left Field 1" />
<ext:TextField runat="server" FieldLabel="Left Field 2" />
</Items>
</ext:Container>
<ext:Container runat="server" Layout="VBox">
<Items>
<ext:TextField runat="server" FieldLabel="Right Field 1" />
<ext:TextField runat="server" FieldLabel="Right Field 2" />
</Items>
</ext:Container>
</Items>
</ext:Container>
<ext:GridPanel runat="server" Title="My Grid" Height="100%" Width="100%">
<Store>
<ext:Store runat="server">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="Id" Type="Int" />
<ext:ModelField Name="Name" Type="String" />
</Fields>
</ext:Model>
</Model>
<Data>
<ext:StoreData>
<ext:Record Id="1">
<Values>
<ext:object>
<Name>Id</Name>
<Value>1</Value>
</ext:object>
<ext:object>
<Name>Name</Name>
<Value>Record 1</Value>
</ext:object>
</Values>
</ext:Record>
<ext:Record Id="2">
<Values>
<ext:object>
<Name>Id</Name>
<Value>2</Value>
</ext:object>
<ext:object>
<Name>Name</Name>
<Value>Record 2</Value>
</ext:object>
</Values>
</ext:Record>
</ext:StoreData>
</Data>
</ext:Store>
</Store>
<ColumnModel>
<Columns>
<ext:Column runat="server" DataIndex="Id" Header="Id" Width="50" />
<ext:Column runat="server" DataIndex="Name" Header="Name" Width="150" />
</Columns>
</ColumnModel>
</ext:GridPanel>
</Items>
</ext:Panel>
</Items>
</ext:Viewport>
```
这个示例创建了一个Viewport组件,其中包含一个Panel组件,Panel组件包含一个顶部TextField组件、一个水平两个TextField组件的容器和一个底部GridPanel组件。您可以根据需要调整每个组件的属性来满足您的要求。
阅读全文