WebPart类
webpart可以根据个人喜好随意调整页面的布局和每个区域的显示的内容,实现页面个性化的定制。
webpart 的层次结构
个性化设置,webpart 区域, webpatr
使用WebPart
webpartManager控件用于管理网页上所用的web区域和web part 状态,功能和事件,以及两个web part 之间的连接通信。每个webpart的网页上都需要一个webpartManager控件,并且只能有一个webPatrManager控件。
web part 总是被包含在web part 区域中,每个web part 区域可以包含一个或多个webpart。
web part 区域控件: webpartZone ,CatalogZone,EditorZone,ConnectionsZone。每个区域拥有不同的作用,包含不同的WebPart控件。
WebpartZone包含:webPart控件,普通服务器端控件,用户控件,自定义控件。
CatalogZone(目录区域)控件,只有在目录模式下才显示。
EditorZone(编辑区域)只有在编辑区域中才能显示。
ConnectionsZone 连接。
webPatr页面现实模式
BrowesDisplayMoedel 浏览模式,最终用户查看网页的普通模式显示webpart控件和用户界面元素。
DesignDisplayMoedel设计模式,现实区域用户界面,并运行用户拖动,更改webpart控件和页面布局。
EditDisplayModel 编辑模式,显示特殊的编辑用户界面元素,运行用户编辑页面上的控件。允许拖动(同设计模式)。
CatalogDisplayMoel目录模式,允许用户添加和移除控件。允许拖动(同设计模式)。
ConnectDisplayMoedl连接模式,显示特殊的连接页面用户元素,允许用户连接webpart控件。
.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register src="UserInfo.ascx" tagname="UserInfo" tagprefix="uc1" %>
<%@ Register src="Photo.ascx" tagname="Photo" tagprefix="uc2" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<asp:WebPartManager ID="WebPartManager1" runat="server">
</asp:WebPartManager>
<div>
<table style="border: thin solid #FF99FF">
<th>
页面模式:<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True"
onselectedindexchanged="DropDownList1_SelectedIndexChanged">
<asp:ListItem Value="a">浏览模式</asp:ListItem>
<asp:ListItem Value="b">编辑模式</asp:ListItem>
<asp:ListItem Value="c">设计模式</asp:ListItem>
<asp:ListItem Value="d">目录模式</asp:ListItem>
<asp:ListItem Value="e">连接模式</asp:ListItem>
</asp:DropDownList>
<asp:Button ID="Button1" runat="server" Text="初始化" οnclick="Button1_Click" />
<asp:Button ID="Button2" runat="server" Text=" 模式 " οnclick="Button2_Click" />
</th>
<tr>
<td valign="top">
<asp:WebPartZone ID="WebPartZone1" runat="server" BorderColor="#CCCCCC"
Font-Names="Verdana" Padding="6">
<EmptyZoneTextStyle Font-Size="0.8em"></EmptyZoneTextStyle>
<PartStyle Font-Size="0.8em" ForeColor="#333333"></PartStyle>
<TitleBarVerbStyle Font-Size="0.6em" Font-Underline="False" ForeColor="White">
</TitleBarVerbStyle>
<MenuLabelHoverStyle ForeColor="#D1DDF1"></MenuLabelHoverStyle>
<MenuPopupStyle BackColor="#507CD1" BorderColor="#CCCCCC" BorderWidth="1px" Font-Names="Verdana" Font-Size="0.6em">
</MenuPopupStyle>
<MenuVerbStyle BorderColor="#507CD1" BorderWidth="1px" BorderStyle="Solid" ForeColor="White">
</MenuVerbStyle>
<PartTitleStyle BackColor="#507CD1" Font-Bold="True" Font-Size="0.8em" ForeColor="White">
</PartTitleStyle>
<MenuVerbHoverStyle BackColor="#EFF3FB" BorderColor="#CCCCCC" BorderWidth="1px" BorderStyle="Solid" ForeColor="#333333">
</MenuVerbHoverStyle>
<PartChromeStyle BackColor="#EFF3FB" BorderColor="#D1DDF1" Font-Names="Verdana" ForeColor="#333333">
</PartChromeStyle>
<HeaderStyle HorizontalAlign="Center" Font-Size="0.7em" ForeColor="#CCCCCC">
</HeaderStyle>
<MenuLabelStyle ForeColor="White"></MenuLabelStyle>
<ZoneTemplate>
<asp:Login ID="Login1" runat="server" title="用户登陆" >
</asp:Login>
</ZoneTemplate>
</asp:WebPartZone>
<asp:WebPartZone ID="WebPartZone3" runat="server" BorderColor="#CCCCCC"
Font-Names="Verdana" Padding="6">
<EmptyZoneTextStyle Font-Size="0.8em"></EmptyZoneTextStyle>
<PartStyle Font-Size="0.8em" ForeColor="#333333"></PartStyle>
<TitleBarVerbStyle Font-Size="0.6em" Font-Underline="False" ForeColor="White">
</TitleBarVerbStyle>
<MenuLabelHoverStyle ForeColor="#D1DDF1"></MenuLabelHoverStyle>
<MenuPopupStyle BackColor="#507CD1" BorderColor="#CCCCCC" BorderWidth="1px" Font-Names="Verdana" Font-Size="0.6em">
</MenuPopupStyle>
<MenuVerbStyle BorderColor="#507CD1" BorderWidth="1px" BorderStyle="Solid" ForeColor="White">
</MenuVerbStyle>
<PartTitleStyle BackColor="#507CD1" Font-Bold="True" Font-Size="0.8em" ForeColor="White">
</PartTitleStyle>
<MenuVerbHoverStyle BackColor="#EFF3FB" BorderColor="#CCCCCC" BorderWidth="1px" BorderStyle="Solid" ForeColor="#333333">
</MenuVerbHoverStyle>
<PartChromeStyle BackColor="#EFF3FB" BorderColor="#D1DDF1" Font-Names="Verdana" ForeColor="#333333">
</PartChromeStyle>
<HeaderStyle HorizontalAlign="Center" Font-Size="0.7em" ForeColor="#CCCCCC">
</HeaderStyle>
<MenuLabelStyle ForeColor="White"></MenuLabelStyle>
<ZoneTemplate>
<asp:BulletedList ID="BulletedList1" runat="server" BulletStyle="CustomImage"
Height="49px" Width="147px" title="来看看吧">
<asp:ListItem>艺上网,艺上网</asp:ListItem>
<asp:ListItem>艺上网,艺上网</asp:ListItem>
<asp:ListItem>艺上网,艺上网</asp:ListItem>
<asp:ListItem>艺上网,艺上网</asp:ListItem>
</asp:BulletedList>
</ZoneTemplate>
</asp:WebPartZone>
<asp:WebPartZone ID="WebPartZone4" runat="server" BorderColor="#CCCCCC"
Font-Names="Verdana" Padding="6">
<EmptyZoneTextStyle Font-Size="0.8em"></EmptyZoneTextStyle>
<PartStyle Font-Size="0.8em" ForeColor="#333333"></PartStyle>
<TitleBarVerbStyle Font-Size="0.6em" Font-Underline="False" ForeColor="White">
</TitleBarVerbStyle>
<MenuLabelHoverStyle ForeColor="#FFCC66"></MenuLabelHoverStyle>
<MenuPopupStyle BackColor="#990000" BorderColor="#CCCCCC" BorderWidth="1px" Font-Names="Verdana" Font-Size="0.6em">
</MenuPopupStyle>
<MenuVerbStyle BorderColor="#990000" BorderWidth="1px" BorderStyle="Solid" ForeColor="White">
</MenuVerbStyle>
<PartTitleStyle BackColor="#990000" Font-Bold="True" Font-Size="0.8em" ForeColor="White">
</PartTitleStyle>
<MenuVerbHoverStyle BackColor="#FFFBD6" BorderColor="#CCCCCC" BorderWidth="1px" BorderStyle="Solid" ForeColor="#333333">
</MenuVerbHoverStyle>
<PartChromeStyle BackColor="#FFFBD6" BorderColor="#FFCC66" Font-Names="Verdana" ForeColor="#333333">
</PartChromeStyle>
<HeaderStyle HorizontalAlign="Center" Font-Size="0.7em" ForeColor="#CCCCCC">
</HeaderStyle>
<MenuLabelStyle ForeColor="White"></MenuLabelStyle>
<ZoneTemplate>
</ZoneTemplate>
</asp:WebPartZone>
<asp:WebPartZone ID="WebPartZone5" runat="server" BorderColor="#CCCCCC"
Font-Names="Verdana" Padding="6">
<EmptyZoneTextStyle Font-Size="0.8em"></EmptyZoneTextStyle>
<PartStyle Font-Size="0.8em" ForeColor="#333333"></PartStyle>
<TitleBarVerbStyle Font-Size="0.6em" Font-Underline="False" ForeColor="White">
</TitleBarVerbStyle>
<MenuLabelHoverStyle ForeColor="#E2DED6"></MenuLabelHoverStyle>
<MenuPopupStyle BackColor="#5D7B9D" BorderColor="#CCCCCC" BorderWidth="1px" Font-Names="Verdana" Font-Size="0.6em">
</MenuPopupStyle>
<MenuVerbStyle BorderColor="#5D7B9D" BorderWidth="1px" BorderStyle="Solid" ForeColor="White">
</MenuVerbStyle>
<PartTitleStyle BackColor="#5D7B9D" Font-Bold="True" Font-Size="0.8em" ForeColor="White">
</PartTitleStyle>
<MenuVerbHoverStyle BackColor="#F7F6F3" BorderColor="#CCCCCC" BorderWidth="1px" BorderStyle="Solid" ForeColor="#333333">
</MenuVerbHoverStyle>
<PartChromeStyle BackColor="#F7F6F3" BorderColor="#E2DED6" Font-Names="Verdana" ForeColor="White">
</PartChromeStyle>
<HeaderStyle HorizontalAlign="Center" Font-Size="0.7em" ForeColor="#CCCCCC">
</HeaderStyle>
<MenuLabelStyle ForeColor="White"></MenuLabelStyle>
<ZoneTemplate>
<asp:ListBox ID="ListBox1" runat="server" Height="168px" title="音乐盒">
<asp:ListItem>稻香——周杰伦</asp:ListItem>
<asp:ListItem>白白的——张韶涵</asp:ListItem>
<asp:ListItem>青花瓷——周杰伦</asp:ListItem>
<asp:ListItem>亲爱的那不是爱情——张韶涵</asp:ListItem>
<asp:ListItem>左边——杨丞琳</asp:ListItem>
<asp:ListItem>爱情任务——蔡依林</asp:ListItem>
<asp:ListItem>明天过后——张杰</asp:ListItem>
<asp:ListItem>爱——小虎队</asp:ListItem>
<asp:ListItem>一帘幽梦——邓丽君</asp:ListItem>
<asp:ListItem>蓝色雨——温岚</asp:ListItem>
<asp:ListItem>你快乐吗——蔡依林</asp:ListItem>
</asp:ListBox>
</ZoneTemplate>
</asp:WebPartZone>
</td>
<td valign="top">
<asp:WebPartZone ID="WebPartZone2" runat="server" BorderColor="#CCCCCC"
Font-Names="Verdana" Padding="6">
<EmptyZoneTextStyle Font-Size="0.8em"></EmptyZoneTextStyle>
<PartStyle Font-Size="0.8em" ForeColor="#333333"></PartStyle>
<TitleBarVerbStyle Font-Size="0.6em" Font-Underline="False" ForeColor="White">
</TitleBarVerbStyle>
<MenuLabelHoverStyle ForeColor="#E2DED6"></MenuLabelHoverStyle>
<MenuPopupStyle BackColor="#5D7B9D" BorderColor="#CCCCCC" BorderWidth="1px" Font-Names="Verdana" Font-Size="0.6em">
</MenuPopupStyle>
<MenuVerbStyle BorderColor="#5D7B9D" BorderWidth="1px" BorderStyle="Solid" ForeColor="White">
</MenuVerbStyle>
<PartTitleStyle BackColor="#5D7B9D" Font-Bold="True" Font-Size="0.8em" ForeColor="White">
</PartTitleStyle>
<MenuVerbHoverStyle BackColor="#F7F6F3" BorderColor="#CCCCCC" BorderWidth="1px" BorderStyle="Solid" ForeColor="#333333">
</MenuVerbHoverStyle>
<PartChromeStyle BackColor="#F7F6F3" BorderColor="#E2DED6" Font-Names="Verdana" ForeColor="White">
</PartChromeStyle>
<HeaderStyle HorizontalAlign="Center" Font-Size="0.7em" ForeColor="#CCCCCC">
</HeaderStyle>
<MenuLabelStyle ForeColor="White"></MenuLabelStyle>
<ZoneTemplate>
<uc1:UserInfo ID="UserInfo1" runat="server" title="用户信息" />
</ZoneTemplate>
</asp:WebPartZone>
</td>
<td valign="top">
<asp:EditorZone ID="EditorZone1" runat="server" BackColor="#EFF3FB"
BorderColor="#CCCCCC" BorderWidth="1px" Font-Names="Verdana" Padding="6">
<FooterStyle HorizontalAlign="Right" BackColor="#D1DDF1"></FooterStyle>
<PartTitleStyle Font-Bold="True" Font-Size="0.8em" ForeColor="#333333">
</PartTitleStyle>
<PartChromeStyle BorderColor="#D1DDF1" BorderWidth="1px" BorderStyle="Solid">
</PartChromeStyle>
<PartStyle BorderColor="#EFF3FB" BorderWidth="5px"></PartStyle>
<LabelStyle Font-Size="0.8em" ForeColor="#333333"></LabelStyle>
<VerbStyle Font-Names="Verdana" Font-Size="0.8em" ForeColor="#333333">
</VerbStyle>
<ErrorStyle Font-Size="0.8em"></ErrorStyle>
<EmptyZoneTextStyle Font-Size="0.8em" ForeColor="#333333"></EmptyZoneTextStyle>
<EditUIStyle Font-Names="Verdana" Font-Size="0.8em" ForeColor="#333333">
</EditUIStyle>
<HeaderStyle BackColor="#D1DDF1" Font-Bold="True" Font-Size="0.8em" ForeColor="#333333">
</HeaderStyle>
<HeaderVerbStyle Font-Bold="False" Font-Size="0.8em" Font-Underline="False" ForeColor="#333333">
</HeaderVerbStyle>
<InstructionTextStyle Font-Size="0.8em" ForeColor="#333333">
</InstructionTextStyle>
<ZoneTemplate>
<asp:AppearanceEditorPart ID="AppearanceEditorPart1" runat="server" />
<asp:BehaviorEditorPart ID="BehaviorEditorPart1" runat="server" />
<asp:LayoutEditorPart ID="LayoutEditorPart1" runat="server" />
<asp:PropertyGridEditorPart ID="PropertyGridEditorPart1" runat="server" />
</ZoneTemplate>
</asp:EditorZone>
<asp:CatalogZone ID="CatalogZone1" runat="server" BackColor="#EFF3FB"
BorderColor="#CCCCCC" BorderWidth="1px" Font-Names="Verdana" Padding="6">
<HeaderVerbStyle Font-Bold="False" Font-Size="0.8em" Font-Underline="False" ForeColor="#333333">
</HeaderVerbStyle>
<PartTitleStyle BackColor="#507CD1" Font-Bold="True" Font-Size="0.8em" ForeColor="White">
</PartTitleStyle>
<FooterStyle HorizontalAlign="Right" BackColor="#D1DDF1"></FooterStyle>
<PartChromeStyle BorderColor="#D1DDF1" BorderWidth="1px" BorderStyle="Solid">
</PartChromeStyle>
<PartLinkStyle Font-Size="0.8em"></PartLinkStyle>
<InstructionTextStyle Font-Size="0.8em" ForeColor="#333333">
</InstructionTextStyle>
<LabelStyle Font-Size="0.8em" ForeColor="#333333"></LabelStyle>
<SelectedPartLinkStyle Font-Size="0.8em"></SelectedPartLinkStyle>
<VerbStyle Font-Names="Verdana" Font-Size="0.8em" ForeColor="#333333">
</VerbStyle>
<HeaderStyle BackColor="#D1DDF1" Font-Bold="True" Font-Size="0.8em" ForeColor="#333333">
</HeaderStyle>
<EditUIStyle Font-Names="Verdana" Font-Size="0.8em" ForeColor="#333333">
</EditUIStyle>
<PartStyle BorderColor="#EFF3FB" BorderWidth="5px"></PartStyle>
<EmptyZoneTextStyle Font-Size="0.8em" ForeColor="#333333"></EmptyZoneTextStyle>
<ZoneTemplate>
<asp:DeclarativeCatalogPart ID="DeclarativeCatalogPart1" runat="server">
<WebPartsTemplate>
<asp:Image ID="Image1" runat="server" ImageUrl="~/小图片/00121.jpg" title="图片浏览" />
<asp:Calendar ID="Calendar1" runat="server" title="日历浏览"></asp:Calendar>
<br />
<uc2:Photo ID="Photo1" runat="server" title="相册浏览"/>
</WebPartsTemplate>
</asp:DeclarativeCatalogPart>
</ZoneTemplate>
</asp:CatalogZone>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (WebPartManager1.Personalization.Scope == PersonalizationScope.Shared)
{
Button2.Text = "共享模式";
}
else
{
Button2.Text = "用户模式";
}
}
protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
{
switch (DropDownList1.SelectedValue)
{
case "a":
WebPartManager1.DisplayMode = WebPartManager.BrowseDisplayMode;
break;
case "b":
WebPartManager1.DisplayMode = WebPartManager.EditDisplayMode;
break;
case "c":
WebPartManager1.DisplayMode = WebPartManager.DesignDisplayMode;
break;
case "d":
WebPartManager1.DisplayMode = WebPartManager.CatalogDisplayMode;
break;
case "e":
WebPartManager1.DisplayMode = WebPartManager.ConnectDisplayMode;
break;
}
}
protected void Button1_Click(object sender, EventArgs e)
{
//初始化
WebPartManager1.Personalization.ResetPersonalizationState();
}
protected void Button2_Click(object sender, EventArgs e)
{
WebPartManager1.Personalization.ToggleScope();
}
}