Introduction
The web part framework provided as part of ASP.net 2.0 provides a rich framework for creating portal based web sites.
The concept of a portal is to separate the layout of content from what is hard coded onto the page design. This enables the concept of personalization – which is the ability to personalize content for each user, enabling your users to set a layout which suits their needs best.
The web part framework is a very extensible API which enables developers to change just about every single aspect of personalization. In this blog, I am writing about one specific aspect of extending the built in framework – sub classing the EditorZone class to enable you to have a custom editor tool zone.
A two minute guide to the web part framework
When you use the web part framework on an ASPX page, you create a WebPartManager control in your markup. The WebPartManager class is responsible for managing the personalization page lifecycle, at a very high level; it defers the responsibility of detailed personalization calls to the WebPartPersonalization class (available from the WebPartManager through the Personalization property). This class is a static façade which wraps over the PersonalizationProvider. This provider follows the ASP.net 2.0 provider model, enabling you to store personalization state (data) in a store of your choice. Out of the box, this means SQL Server (SqlPersonalizationProvider), but there is no reason why this cannot be swapped out for a custom store, such as Oracle or a flat file.
The WebPartManager manages which WebPartDisplayMode you are currently viewing the site in (as exposed through the DisplayMode property), as well as permissions to do so. Each display mode is used for a different purpose in personalizing the page. The built in available display modes are:
|
Display mode |
Description |
|
BrowseDisplayMode |
Displays Web Parts controls and UI elements in the normal mode in which end users view a page. |
|
DesignDisplayMode |
Displays zone UI and enables users to drag and drop Web Parts controls to change the layout of a page. |
|
EditDisplayMode |
Displays special editing UI elements and enables end users to edit the controls on a page. |
|
CatalogDisplayMode |
Displays special catalog UI elements and enables end users to add and remove page controls. |
|
ConnectDisplayMode |
Displays special connections UI elements and enables end users to connect Web Parts controls. |
Each display mode enlists a particular type of ToolZone. This is a panel that appears in the UI when the WebPartManager enters the chosen display mode. The contents of the tool zone is specified in the markup. The following sample shows typical markup for the WebPartManager, two web part zones (where content is laid out), a catalog zone and a editor zone:
<%@ Page Language="C#" CodeFile="Default.aspx.cs" Inherits="Default_aspx" %>
<%@ Register TagPrefix="custom" TagName="MyControl" Src="~/WebParts/MyControl.ascx" %>
<asp:WebPartManager ID="PartManager" runat="server"></asp:WebPartManager>
<asp:WebPartZone id="Zone1" runat="server" HeaderText="Zone 1"></asp:WebPartZone>
<asp:WebPartZone id="Zone2" runat="server" HeaderText="Zone 2"></asp:WebPartZone>
<asp:CatalogZone ID="catalogZone" runat="server">
<ZoneTemplate>
<asp:DeclarativeCatalogPart runat="server" ID="DeclarativeCatalogPart2" Title="Available Web Parts">
<WebPartsTemplate>
<custom:MyControl runat="server" ID="myControl" title="My Title"></custom:MyControl>
</WebPartsTemplate>
</asp:DeclarativeCatalogPart>
</ZoneTemplate>
</asp:CatalogZone>
<asp:EditorZone ID="editorZone1" runat="Server">
<ZoneTemplate>
<asp:PropertyGridEditorPart runat="server" ChromeType="TitleAndBorder"
ID="PropertyGridEditorPart2" Title="Available Properties" BorderStyle="None">
</asp:PropertyGridEditorPart>
</ZoneTemplate>
</asp: EditorZone>
The CatalogZone is shown only in CatalogDisplayMode, and the EditorZone is shown only in EditDisplayMode. These are two tool zone examples.
Looking deeper into the EditorZone class
The EditorZone exposes EditorPart classes (such as the PropertyGridEditorPart) which are used to edit the properties of a selected web part on the page. This means that the EditorZone is not displayed to a user when no web part is selected for editing.
How can we change the behavior of the EditorZone to display custom editor parts that do not relate to a selected webpart, and should therefore be displayed as soon as the user enters edit mode?
The following tables list the properties, methods, and events of the EditorZone base class that can be easily overridden to provide custom behavior:
Events
|
Name |
EventArgs |
Description |
|
OnDisplayModeChanged |
WebPartDisplayModeEventArgs |
Event gets fired each time the display mode is changed. Can be overridden to inspect which display mode you are coming from and to, and provide custom display behavior. The base class event will clear the editor parts collection and you are best sticking to this model, but handling custom UI changes after calling the base class. |
|
OnSelectedWebPartChanged |
WebPartEventArgs |
Event gets fired each time the selected web part is changed, or the selected web part is deselected. Can be overridden to provide additional UI behavior when a webpart is either selected or deselected. |
Properties
|
Name |
Description |
|
Display |
Returns a Boolean value indicating whether to display the EditorZone or not. Override this property to change the display behavior, such as displaying the EditorZone even if no web part is selected. |
Methods
|
Name |
Description |
|
CreateEditorParts |
Override this method to create extra editor parts not created declaratively in your markup. Use this method to control extra editor parts you might want to display, such as if no web part is selected. |
|
Close |
Override this method to change to behavior of what happens when the zone’s close button is clicked. |
Where to now?
If you are sub classing the editor zone, it is likely you will want to create custom editor parts to display in your zone. For this you should look at sub classing the EditorPart class.
Summary
The web part framework provides a highly extensible model for providing personalization in your ASP.net 2.0 applications. Sub classing the editor zone provides you with extra flexibility in how you use the editor mode built into the WebPartManager.