初始Ext.net(二)

1.图标按钮

对菜单栏分别绑定事件

    <%--  图标按钮--%>
                                            <ext:SplitButton ID="SplitButton1" runat="server" Icon="Application">
                                        <Menu>
                                            <ext:Menu ID="Menu1" runat="server">
                                                <Items>
                                                    <ext:MenuItem ID="MenuItem1" runat="server" Text="Add" Icon="Add">
                                                        <Listeners>
                                                            <Click Handler="#{TreePanel1}.expandAll();" />
                                                        </Listeners>
                                                    </ext:MenuItem>
                                                    <ext:MenuItem ID="MenuItem2" runat="server" Text="Accept" Icon="Accept">
                                                         <Listeners>
                                                            <Click Handler="#{TreePanel1}.collapseAll();" />
                                                        </Listeners>
                                                        </ext:MenuItem>
                                                </Items>
                                            </ext:Menu>
                                        </Menu>
                                    </ext:SplitButton>
                            

2.在Panel定义内容,Home page的实现

    <%-- 中间内容区域--%>
            <ext:TabPanel ID="TabPanel1" runat="server" Region="Center">
                <Items>
                    <ext:Panel ID="Panel5" runat="server" Title="Home" Icon="application" Border="false"  BaseCls="x-bubble"

                        Padding="6">
                        <Content>
                          <ext:Panel ID="Panel3" runat="server"  Collapsible="true" Split="true"
                                Title="Filter">
                                <Items>
                                    <ext:TextField ID="TextField1" runat="server" FieldLabel="TextField" EmptyText="Enter a value"
                                        AllowBlank="false" />
                                </Items>
                            </ext:Panel>
                            
                              <%--  图标按钮--%>
                                            <ext:SplitButton ID="SplitButton1" runat="server" Icon="Application">
                                        <Menu>
                                            <ext:Menu ID="Menu1" runat="server">
                                                <Items>
                                                    <ext:MenuItem ID="MenuItem1" runat="server" Text="Add" Icon="Add">
                                                        <Listeners>
                                                            <Click Handler="#{TreePanel1}.expandAll();" />
                                                        </Listeners>
                                                    </ext:MenuItem>
                                                    <ext:MenuItem ID="MenuItem2" runat="server" Text="Accept" Icon="Accept">
                                                         <Listeners>
                                                            <Click Handler="#{TreePanel1}.collapseAll();" />
                                                        </Listeners>
                                                        </ext:MenuItem>
                                                </Items>
                                            </ext:Menu>
                                        </Menu>
                                    </ext:SplitButton>
                            
                            <ext:Image ID ="image" runat =server  Resizable = true  ImageUrl = "http://cd-twch/_layouts/img/logo.gif" >
                            </ext:Image>
                            <p>
                                This is a custom panel to achieve a different look and feel while not changing the
                                default appearance of an Panel.</p>
                            <p>
                                The majority of the work is actually done in <a href="Default.aspx">bubble</a>.
                                Panel uses a custom baseCls ('x-bubble') which will generate unique CSS classes
                                for the markup in a Panel such as <em>'x-bubble-tl'</em>, <em>'x-bubble-tr'</em>
                                and <em>'x-bubble-tc'</em>.</p>
                        </Content>
                    </ext:Panel>
                    <%-- <ext:Panel ID="Panel6" runat="server" Title="Close Me" Closable="true" Border="false"
                        Padding="6" Html="Closeable Tab" />--%>
                </Items>
            </ext:TabPanel>

 

3.