原文地址：http://dotnetslackers.com/articles/aspnet/UsingWebPartsInASPNet20.aspx
[譯者改后代碼下載]


[翻譯]在asp.net 2.0中使用WebParts

原文發(fā)布日期：2007.03.01
作者：Abdul Sami
翻譯：webabcd


介紹
如果說WebParts是web中一個非酷的效果的話，我想沒有人會懷疑。WebParts為我們提供了對頁中的對象進(jìn)行拖拽的功能，它也可以在runtime的時候改變對象的標(biāo)題、邊框樣式等。在WebParts出現(xiàn)之前，要實(shí)現(xiàn)這個功能是一項(xiàng)令人非常頭痛的工作，因?yàn)槲覀儽仨殞懘罅康腏avaScrip，還要把頁中每個對象的狀態(tài)保存到數(shù)據(jù)庫中。


WebParts有兩個基本的東東
??? ·WebPartManager
??? ·WebPart Zones WebPartManager
WebPartManager用來管理所有的webparts。如果你想在你的web站點(diǎn)中使用webparts就必須要使用WebPartManager。它的作用是提供你在頁中進(jìn)行拖拽的JavaScript代碼

WebPart Zones
WebPart Zones中有4個zone
??? ·WebPartZone
??? ·EditorZone?
??? ·CatalogZone?
??? ·ConnectionZone


WebPartZone
WebPartZone是webparts里最基本的單位。通過在WebPartZone里放置不同的內(nèi)容，我們就能夠允許用戶在頁上對其進(jìn)行拖拽。你可以在你的頁上增加一個DropDownList以實(shí)現(xiàn)使用不同zone的功能，該DropDownList的選項(xiàng)如下
??? ·Browse
??? ·Design
??? ·Edit
??? ·Catalog
??? ·Connect

在DropDownList的SelectedIndexChanged事件里粘貼如下代碼（這里假設(shè)DropDownList的id是“cmbOptions”，WebPartManager的id是“WebPartManager1”） if (cmbOptions.SelectedValue == "Design")
{
????WebPartManager1.DisplayMode = WebPartManager.DesignDisplayMode;
}
else if (cmbOptions.SelectedValue == "Browse")
{
????WebPartManager1.DisplayMode = WebPartManager.BrowseDisplayMode;
}
else if (cmbOptions.SelectedValue == "Catalog")
{
????WebPartManager1.DisplayMode = WebPartManager.CatalogDisplayMode;
}
else if (cmbOptions.SelectedValue == "Edit")
{
????WebPartManager1.DisplayMode = WebPartManager.EditDisplayMode;
}
else if (cmbOptions.SelectedValue == "Connect")
{
????WebPartManager1.DisplayMode = WebPartManager.ConnectDisplayMode;
} Browse mode
Browse mode是webparts的默認(rèn)模式。在Browse mode中雖然我們不能拖拽webpart，但是可以在webpart上看到兩個選項(xiàng)，最小化和關(guān)閉。最小化一個webpart會顯示它的最小化狀態(tài)，如果選擇關(guān)閉的話我們就只能在Catalog mode下重新恢復(fù)它，稍后我們會討論它。這里有一個Browse mode下簡單的webpart的圖例 ? Design mode
在Design mode中我們就可以在兩個webpart對象間進(jìn)行拖拽了。我這里有兩個webpart，分別被命名為“Links”和“Search”。下圖示例了把“Links”拖拽到“Search”的情況 ? Edit Mode
Edit Mode允許你在runtime中編輯webpart。編輯webpart是一個比較深層次的應(yīng)用，它分為4個類型:Appearance、Behavio、Property和Layout。我們首先來看看如何使用Appearance和LayoutEditorPart


Appearance和LayoutEditorPart
首先在web form上放置一個EditorZone。然后在EditorZone里放置一個AppearanceEditorPart和LayoutEditorPart。運(yùn)行這個程序，從DropDownList中選擇編輯模式。在可用的webpart上單擊菜單的編輯按鈕。 你會看到如下圖所示的顯示 ? 你可以在這里改變webpart的標(biāo)題。我們也可以看到編輯模式下的一些基本選項(xiàng)。鑲邊類型是邊框和標(biāo)題的樣式。鑲邊狀態(tài)可以讓你設(shè)置是否最小化它


PropertyGridEditorPart
通過使用屬性編輯器我們可以改變webpart中對象的屬性。在我們的例子中將示例如何改變對象的CssClass屬性。我們將用與解釋AppearanceEditorPart和LayoutEditorPart相同的方法來說明它

在webform上放置一個EditorZone。然后在EditorZone里放置一個PropertyGridEditorPart。為了使用EditorZone我們需要在你的項(xiàng)目里新增一個用戶控件。在這個用戶控件里放置一個TextBox，然后再把這個用戶控件放到web form的webpart里。該用戶控件的后置代碼如下 string _cssClass = "FrmTxtBox";
[WebBrowsable(), Personalizable(true)]
public string CssClass
{
????get { return _cssClass; }
????set { TextBox1.CssClass= value; }
}

protected void Page_Load(Object sender, EventArgs e)
{
????TextBox1.CssClass = CssClass;
} 上面的代碼用于改變TextBox的CssClass屬性。這個屬性可以在webpart的編輯模式中修改，同時我們也可以在runtime的時候改變它。此外我們也給CssClass附加了兩個修飾屬性
??? ·WebBrowsable - 允許webpart在編輯模式中顯示用戶定義的屬性?
??? ·Personalizable - 允許屬性是可編輯的

現(xiàn)在運(yùn)行這個頁。如果我們設(shè)置了WebPartManager為編輯模式的話，就將會看到webpart的菜單選項(xiàng)中出現(xiàn)了編輯按鈕。截屏如下 ? 在webpart的菜單中單擊編輯按鈕，就會看到編輯模式里有一個CssClass屬性。截屏如下： ? 我們可以看到TextBox使用FrmTxtBox作為默認(rèn)值（樣式表的class）。這個樣式把邊框的顏色定義為黑色。我們現(xiàn)在可以使用不同的樣式class，比如我們有一個名為“CustomClass1”的樣式class，它定義為沒有邊框。輸入這個值后按OK按鈕，你將會看到新的邊框樣式 ? 使用這種方法我們就可以改變webpart里對象的屬性


Catalog mode
Catalog mode給我們提供了在運(yùn)行時添加和移除webpart的選項(xiàng)。例如，如果我們有一些模塊，如天氣模塊、新聞模塊、購物模塊和占卜模塊等等。如果想在運(yùn)行時給用戶提供顯示和隱藏這些模塊的選項(xiàng)，我們就可以使用Catalog mode來完成這項(xiàng)任務(wù)。


CatalogZone
CatalogZone分為3個類型，分別是PageCatalogPart、DeclarativeCatalogPart和ImportCatalogPart。在webform上增加一個CatalogZone，然后在CatalogZone內(nèi)添加之前提到的3個類型。當(dāng)webpart被關(guān)閉后我們可以用PageCatalog來幫我們來顯示webpart，截屏如下： ? PageCatalogPart用于顯示被關(guān)閉的webpart列表。DeclarativeCatalogPart用于顯示該聲明下的webpart列表。圖例如下： ? 未完待續(xù)>> ?

轉(zhuǎn)載于:https://blog.51cto.com/webabcd/345062

總結(jié)

以上是生活随笔為你收集整理的[翻译]在asp.net 2.0中使用WebParts的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。