1. 程式人生 > >CatalogZone Web 伺服器控制元件概述

CatalogZone Web 伺服器控制元件概述

Web 部件控制元件(例如 CatalogZone 控制元件)的一項主要功能是可以讓終端使用者個性化網頁並儲存其個性化設定。CatalogZone 控制元件允許終端使用者在執行時向 Web 部件頁新增 WebPart 控制元件或其他伺服器控制元件。CatalogZone 控制元件用作 Web 部件控制元件集內的主控制元件,用於在網頁中承載 CatalogPart 控制元件。

啟用 CatalogZone Web 伺服器控制元件

僅當用戶將網頁切換至目錄顯示模式 (CatalogDisplayMode) 時,CatalogZone 控制元件才變為可見。有關演示如何使用 CatalogZone

控制元件的程式碼示例,請參見 CatalogZone Web 伺服器控制元件宣告性語法和 System.Web.UI.WebControls.WebParts.CatalogZone 中的示例。

CatalogZone Web 伺服器控制元件附帶的 CatalogPart 控制元件

CatalogZone 控制元件建立的區域可以包含多種 CatalogPart 控制元件。每個 CatalogPart 控制元件都是一種容器,其中包含使用者可新增至頁面的伺服器控制元件。CatalogPart 控制元件因其包含的伺服器控制元件的來源而不同。

一、CatalogZone

Web 部件控制元件集中,區域是指網頁上包含

Web 部件控制元件的某個區域。Web 部件區域由區域控制元件建立,區域控制元件是一種設計用來包含其他控制元件的 CompositeControl。區域的主要功能是對其所含的控制元件進行佈局,併為這些控制元件提供公共的使用者介面 (UI)

Web 部件控制元件的一項主要功能是使終端使用者根據個人的喜好來修改(或個性化)網頁,並儲存個性化設定以供將來的瀏覽器會話使用。修改 Web 部件頁的一個方面是將 WebPart 控制元件或其他伺服器控制元件新增至 Web 部件頁。CatalogZone 控制元件提供使用者可以新增到頁的控制元件的列表或目錄。

CatalogZone 控制元件是 Web

部件控制元件集中的一個基本控制元件。該控制元件從 CatalogZoneBase 類派生,且它的大多數行為也都是從該類繼承的。CatalogZone 類實質上將一個區域模板新增至基類,該模板是 ITemplate 介面的實現。區域模板使開發人員能以宣告方式將 CatalogPart 控制元件新增至頁永續性格式的區域。

重要說明: CatalogZone 區域只能包含 CatalogPart 控制元件,反之,CatalogPart 控制元件只能駐留在從 CatalogZoneBase 類派生的區域(如 CatalogZone)中。

CatalogZone 控制元件僅當用戶將網頁切換至目錄顯示模式 (CatalogDisplayMode) 時才變為可見。目錄可以包含若干型別的 CatalogPart 控制元件。每個 CatalogPart 控制元件是一類容器,包含使用者可新增至頁面的伺服器控制元件。CatalogPart 控制元件因其包含的伺服器控制元件的來源而不同。下面的表彙總了與 Web 部件控制元件集一起提供的 CatalogPart 控制元件,以及這些控制元件中的每個控制元件包含的伺服器控制元件種類。

控制元件

說明

維護對頁上已關閉的控制元件的引用。這些控制元件可由使用者重新開啟(添加回頁面)。

包含對在網頁標記中的 Web 部件目錄中宣告的控制元件的引用。這些控制元件可由使用者新增至網頁。

提供使用者介面,以供使用者向目錄上載某個控制元件的定義檔案(具有 .WebPart 副檔名及指定格式的 XML 檔案,其中包含狀態資訊),從而可將該控制元件新增到網頁中。

因為 CatalogZone 類僅向其基類的行為中新增一個區域模板,該類的成員不多。CatalogZone 建構函式為預設建構函式;可以使用該建構函式初始化 CatalogZone 類的新例項。ZoneTemplate 屬性獲取或設定對包含區域控制元件的 ITemplate 的引用。CreateCatalogParts 方法非常重要。它重寫基方法以建立區域模板中包含的所有 CatalogPart 控制元件的集合。

說明: CatalogZone 使用者介面中的按鈕要求撰寫客戶端指令碼才能正確工作。如果在瀏覽器中禁用指令碼撰寫,則使用者不能通過 CatalogZone 使用者介面執行操作。

對繼承者的說明:

如果需要對目錄使用者介面的呈現和行為擁有更多控制,可以建立自定義 CatalogZone 類。如果不需要向控制元件的使用者提供以宣告方式新增 CatalogPart 控制元件的能力,則可直接從 CatalogZoneBase 類繼承。如果想要能夠以宣告方式新增控制元件,則比較簡單的方法是從 CatalogZone 類繼承,因為該類提供了基本區域模板。

如果從 CatalogZone 類繼承,則可以重寫 CreateCatalogParts 方法並使用該方法將自定義 CatalogPart 控制元件新增到 CatalogPartCollection(如果想要以程式設計方式更好地控制如何將自定義 CatalogPart 控制元件新增到區域)。

1.1、示例

下面的程式碼示例演示如何以宣告方式和程式設計方式使用 CatalogZone 控制元件。該程式碼示例包含以下四部分:

·一個使用者控制元件,用於更改網頁上的顯示模式。

·包含自定義 CatalogZone 控制元件的原始碼的檔案,以及由目錄匯入並新增到網頁上的自定義 WebPart 控制元件。

·用於宣告使用者控制元件和自定義 CatalogZone 控制元件的網頁。

·關於如何執行該示例的說明。

此程式碼示例的第一部分是使用者控制元件,使用者可以使用該控制元件更改網頁的顯示模式。

<%@ control language="C#" classname="DisplayModeMenuCS"%>

<script runat="server">

// Use a field to reference the current WebPartManager.

WebPartManager _manager;

void Page_Init(object sender, EventArgs e)

{

Page.InitComplete += new EventHandler(InitComplete);

}

void InitComplete(object sender, System.EventArgs e)

{

_manager = WebPartManager.GetCurrentWebPartManager(Page);

String browseModeName = WebPartManager.BrowseDisplayMode.Name;

// Fill the dropdown with the names of supported display modes.

foreach (WebPartDisplayMode mode in _manager.SupportedDisplayModes)

{

String modeName = mode.Name;

// Make sure a mode is enabled before adding it.

if (mode.IsEnabled(_manager))

{

ListItem item = new ListItem(modeName, modeName);

DisplayModeDropdown.Items.Add(item);

}

}

// If shared scope is allowed for this user, display the scope-switching

// UI and select the appropriate radio button for the current user scope.

if (_manager.Personalization.CanEnterSharedScope)

{

Panel2.Visible = true;

if (_manager.Personalization.Scope == PersonalizationScope.User)

RadioButton1.Checked = true;

else

RadioButton2.Checked = true;

}

}

// Change the page to the selected display mode.

void DisplayModeDropdown_SelectedIndexChanged(object sender, EventArgs e)

{

String selectedMode = DisplayModeDropdown.SelectedValue;

WebPartDisplayMode mode = _manager.SupportedDisplayModes[selectedMode];

if (mode != null)

_manager.DisplayMode = mode;

}

// Set the selected item equal to the current display mode.

void Page_PreRender(object sender, EventArgs e)

{

ListItemCollection items = DisplayModeDropdown.Items;

int selectedIndex =

items.IndexOf(items.FindByText(_manager.DisplayMode.Name));

DisplayModeDropdown.SelectedIndex = selectedIndex;

}

// Reset all of a user's personalization data for the page.

protected void LinkButton1_Click(object sender, EventArgs e)

{

_manager.Personalization.ResetPersonalizationState();

}

// If not in User personalization scope, toggle into it.

protected void RadioButton1_CheckedChanged(object sender, EventArgs e)

{

if (_manager.Personalization.Scope == PersonalizationScope.Shared)

_manager.Personalization.ToggleScope();

}

// If not in Shared scope, and if user is allowed, toggle the scope.

protected void RadioButton2_CheckedChanged(object sender, EventArgs e)

{

if (_manager.Personalization.CanEnterSharedScope &&

_manager.Personalization.Scope == PersonalizationScope.User)

_manager.Personalization.ToggleScope();

}

</script>

<div>

<asp:Panel ID="Panel1" runat="server"

Borderwidth="1"

Width="230"

BackColor="lightgray"

Font-Names="Verdana, Arial, Sans Serif" >

<asp:Label ID="Label1" runat="server"

Text="&nbsp;Display Mode"

Font-Bold="true"

Font-Size="8"

Width="120"

AssociatedControlID="DisplayModeDropdown"/>

<asp:DropDownList ID="DisplayModeDropdown" runat="server"

AutoPostBack="true"

Width="120"

OnSelectedIndexChanged="DisplayModeDropdown_SelectedIndexChanged" />

<asp:LinkButton ID="LinkButton1" runat="server"

Text="Reset User State"

ToolTip="Reset the current user's personalization data for the page."

Font-Size="8"

OnClick="LinkButton1_Click" />

<asp:Panel ID="Panel2" runat="server"

GroupingText="Personalization Scope"

Font-Bold="true"

Font-Size="8"

Visible="false" >

<asp:RadioButton ID="RadioButton1" runat="server"

Text="User"

AutoPostBack="true"

GroupName="Scope" OnCheckedChanged="RadioButton1_CheckedChanged" />

<asp:RadioButton ID="RadioButton2" runat="server"

Text="Shared"

AutoPostBack="true"

GroupName="Scope"

OnCheckedChanged="RadioButton2_CheckedChanged" />

</asp:Panel>

</asp:Panel>

</div>

此程式碼示例的第二部分包含自定義的 CatalogZone WebPart 控制元件的原始碼。CatalogZone 控制元件的程式碼演示如何從 CatalogZone 類繼承,以及如何通過在建構函式中設定一些預設屬性值來自定義其屬性。此原始碼也演示如何建立名為 TextDisplayWebPart 的自定義 WebPart 控制元件。此控制元件與將作為此程式碼示例的一部分匯入的 .WebPart 說明檔案關聯。通過使用網頁上的 ImportCatalogPart 控制元件匯入該說明檔案後,您就能夠將按照說明檔案中的指定完全預配置好的 TextDisplayWebPart 控制元件新增到頁中。

必須編譯此原始碼,程式碼示例才能執行。可以顯式編譯原始碼,並將結果程式集放在網站的 Bin 資料夾或全域性程式集快取中。另外,也可將原始碼放入站點的 App_Code 資料夾中,原始碼將在執行時在此資料夾中進行動態編譯。此程式碼示例使用動態編譯,因此,如果想要以這種方式執行示例,請為原始碼檔案命名並將它新增到 Web 應用程式根目錄的 App_Code 子資料夾。

using System;

using System.Collections;

using System.ComponentModel;

using System.Drawing;

using System.Security.Permissions;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

namespace Samples.AspNet.CS.Controls

{

// Create a customized CatalogZone control by setting

// some properties in the constructor.

[AspNetHostingPermission(SecurityAction.Demand,

Level = AspNetHostingPermissionLevel.Minimal)]

[AspNetHostingPermission(SecurityAction.InheritanceDemand,

Level = AspNetHostingPermissionLevel.Minimal)]

public class MyCatalogZone : CatalogZone

{

public MyCatalogZone()

{

this.HeaderText = "My Company Catalog";

this.HeaderCloseVerb.Text = "Close Catalog";

this.CloseVerb.Text = "Close Catalog";

}

}

// Create a custom WebPart control to add to a WebPartZone.

[AspNetHostingPermission(SecurityAction.Demand,

Level = AspNetHostingPermissionLevel.Minimal)]

[AspNetHostingPermission(SecurityAction.InheritanceDemand,

Level = AspNetHostingPermissionLevel.Minimal)]

public class TextDisplayWebPart : WebPart

{

private String _contentText = null;

TextBox input;

Label DisplayContent;

Literal lineBreak;

[Personalizable(), WebBrowsable]

public String ContentText

{

get { return _contentText; }

set { _contentText = value; }

}

protected override void CreateChildControls()

{

Controls.Clear();

DisplayContent = new Label();

DisplayContent.BackColor = Color.LightBlue;

DisplayContent.Text = this.ContentText;

this.Controls.Add(DisplayContent);

lineBreak = new Literal();

lineBreak.Text = @"<br />";

Controls.Add(lineBreak);

input = new TextBox();

this.Controls.Add(input);

Button update = new Button();

update.Text = "Set Label Content";

update.Click += new EventHandler(this.submit_Click);

this.Controls.Add(update);

}

private void submit_Click(object sender, EventArgs e)

{

// Update the label string.

if (input.Text != String.Empty)

{

_contentText = input.Text + @"<br />";

input.Text = String.Empty;

DisplayContent.Text = this.ContentText;

}

}

}

}

程式碼示例的第三部分是包含這些控制元件的網頁。網頁包含一條用於使用者控制元件的 Register 指令和另一條用於具有自定義控制元件的原始檔的指令。請注意,在第二條指令中沒有涉及程式集,因為示例使用的不是程式集,而是使用原始碼位於 App_Code 子資料夾中的動態編譯。網頁宣告一個 WebPartZone 控制元件,並在該控制元件的子 <zonetemplate> 元素中,宣告一個 BulletedList 控制元件。雖然這是標準的 ASP.NET 控制元件,但它在執行時將具備完整的 Web 部件功能,因為 WebPartManager 控制元件使用 GenericWebPart 物件包裝位於 WebPartZone 中的任何伺服器控制元件,以便其他伺服器控制元件可以參與 Web 部件應用程式。在此區域中還聲明瞭一個名為 TextDisplayWebPart 的自定義 WebPart 控制元件。請注意,此控制元件在其上聲明瞭 ExportMode="All" 屬性。這使您能夠匯出包含控制元件的屬性值的 .WebPart 說明檔案,其他使用者可以匯入該檔案以將預編譯的控制元件新增到其他網頁。

說明:若要使 Web 部件應用程式的使用者能夠匯出 WebPart 控制元件的說明檔案,還必須啟用 Web 應用程式中的匯出功能,方法是將 enableExport="true" 屬性新增到 Web.config 檔案中的 <webParts>