zoukankan      html  css  js  c++  java
  • WebPart的使用

    WebPart是vs2005的新控件,它的作用是可以使用户在页面上进行控件的拖放,调整位置内容,对控件进行增加,删除,修改等操作.和上节一样,WebParts依然需要SQL Server 2005 Express版本支持。
    下面我们来创建一个简单的WebPart实例,Let's Go!


    首先将左侧工具栏"WebParts" 工具列表中的"WebPartManager"空间拖曳至网页中:

    WebPartManager是一个WebPart的管理控制中心,通过它可以对WebPart的模式进行调整和操作,包括WebPart之间的通信.所以必须首先添加WebPartManager到页面中.WebPartManager在页面运行后不会在前台占用任何位置,他是隐藏的,虽然在设计模式下他是看得见的.
    这里需要说说WebPartManager的五种模式(DisplayMode):
    (1)BrowseDisplayMode:浏览器模式,是默认值.用户只能看不能对Web Part进行操作.
    (2)EditDisplayMode:编辑模式.此模式的运行需要一个EditorZone,然后在EditorZone里可以放AppearanceEditorPart,BehaviorEditorPart,LayoutEditorPart,PropertyGridEditorPart这些控件,他们就是对Web Part进行编辑的控件,可以对Web Part的行为,外观等进行编辑.
    (3)DesignDisplayMode:设计模式.在此模式下,用户就可以对控件的位置进行拖放了(在开始定义好的WebPartZone里)
    (4)CatalogDisplayMode:目录模式.此模式的运行需要一个CatalogZone,CatalogZone有一个模版列,这个模版列里可以放开发人员预先定义好的控件,在HTML模式下在次模列里的控件加Title="需要显示的目录",然后用户就可以把在CatalogZone里的控件放到WebPartZone里.
    (5)ConnectDisplayMode:通讯模式.此模式可以让Web Part进行通讯.可以有两种通讯,静态和动态的.需要设定好提供者和监听者.然后再拖曳2个WebPartZone控件到页面中:

    WebPartZone是一个存放WebPart控件容器,有了它之后我们才能在页面中放置WebPart控件.
    接着我们在WebPart控件1中放置一个Calendar日历控件(在工具栏"标准"工具列表中),系统自动将其封装为WebPart控件,这也就是我们网站的内容部分了.当然这里还可以放置服务器控件"用户自定义控件"Web自定义控件等:

    上面说了,WebPartZone是一个存放WebPart控件容器,那么WebPart编辑时的设置框应该放在哪个容器里呢?答案是EditorZone。
    EditorZone是个容器,本身只提供存放区域,所以我们还需要向EditorZone里面添加AppearanceEditorPart、BehaviorEditorPart、LayoutEditorPart、PropertyGridEditorPart这些控件中的一个或多个。他们就是对Web Part进行编辑的控件,可以对Web Part的行为,外观等进行编辑.这里不做细讲。
    先拖曳进来一个EditorZone,然后向EditorZone中添加一个AppearanceEditorPart:

    同理我们还需要一个CatalogZone控件来显示和管理页面中的控件列表。CatalogZone控件也是一个容器,所以我们还需要向它里面添加DeclarativeCatalogPart、PageCatalogPart、ImportCatalogPart控件中的至少一个.
    这里我们添加一个PageCatalogPart控件到CatalogZone控件中:

    PageCatalogPart控件将以列表显示当前页面剩余的可用WebPart控件并允许将其添加至页面中.
    因为本例中只有1个WebPart控件,所以不存在WebPart控件之间的通讯问题,所以WebPartManager的ConnectDisplayMode模式本文就不涉及了.
    最后我们需要做一个下拉菜单,方便我们选择WebPartManager的几种模式,以便查看以上各种控件的应用方式.
    在工具栏"标准"工具列表中将DropDownList控件添加至页面,并为其添加4个Item项,分别对应WebPartManager的4种模式: 免

     

    DropDownList控件后台事件方法如下: 

        protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
        {
            switch (DropDownList1.SelectedValue)
            {
                case "Browse":
                    this.WebPartManager1.DisplayMode = WebPartManager.BrowseDisplayMode;
                    break;
                case "Edit":
                    this.WebPartManager1.DisplayMode = WebPartManager.EditDisplayMode;
                    break;
                case "Design": sflj http://www.it55.com kg^&fgd
                    this.WebPartManager1.DisplayMode = WebPartManager.DesignDisplayMode;

    break;
                case "Catalog":
                    this.WebPartManager1.DisplayMode = WebPartManager.CatalogDisplayMode;
                    break;
                case "Connect":
                    this.WebPartManager1.DisplayMode = WebPartManager.ConnectDisplayMode;
                    break;
            }
        }

    至此,我们的WebPart之旅就结束了,下面.aspx页面的部分代码:

        <form id="form1" runat="server">
        <div>
            <asp:WebPartManager ID="WebPartManager1" runat="server">
            </asp:WebPartManager>
       
        </div>
            <asp:WebPartZone ID="WebPartZone1" runat="server">
                <ZoneTemplate>
                    <asp:Calendar ID="Calendar1" runat="server"></asp:Calendar>
                </ZoneTemplate>
            </asp:WebPartZone>
            WebPartZone1


            <br />
            <br />
            <asp:WebPartZone ID="WebPartZone2" runat="server">
            </asp:WebPartZone>
            WebPartZone2&nbsp;<br />
            <br />
            <asp:EditorZone ID="EditorZone1" runat="server">
                <ZoneTemplate>
                    <asp:AppearanceEditorPart ID="AppearanceEditorPart1" runat="server" />
                </ZoneTemplate>
            </asp:EditorZone> 
            <br />
            <asp:CatalogZone ID="CatalogZone1" runat="server">
                <ZoneTemplate>
                    <asp:PageCatalogPart ID="PageCatalogPart1" runat="server" />
                </ZoneTemplate>
            </asp:CatalogZone>
            <br />
            <asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
                <asp:ListItem>Browse</asp:ListItem> http://www.it55.com/
                <asp:ListItem>Edit</asp:ListItem>
                <asp:ListItem>Design</asp:ListItem>
                <asp:ListItem>Catalog</asp:ListItem>
            </asp:DropDownList>
           
        </form>

    以下是部分运行效果截图:

     
     
  • 相关阅读:
    es6模块与 commonJS规范的区别 Linda
    hive 子查询特别分析
    C语言I博客作业05
    C语言I博客作业08
    2019秋作业第一周作业
    C语言I博客作业04
    C语言I博客作业09
    C语言I博客作业03
    C语言I博客作业07
    C语言I博客作业06
  • 原文地址:https://www.cnblogs.com/myssh/p/1394197.html
Copyright © 2011-2022 走看看