Example"-->
Read-Write Control Designers ”The ScrollablePanelDesigner ExampleA read-write control designer allows a page developer to add child controls to a container control (such as Panel ) in a WYSIWIG fashion. A page developer can drag controls from the toolbox onto the region that represents the container control on the design surface and can select the contained controls and edit their properties in the property browser. The System.Web.UI.Design.ReadWriteControlDesigner implements the base functionality of a read-write control designer. Before we describe how to extend ReadWriteControlDesigner , let's examine what a read-write control designer cannot do:
The ReadWriteControlDesigner is limited in extensibility because its GetDesignTimeHtml method is not invoked by the design environment. ReadWriteControlDesigner renders the styles for the container Web control by adding style attributes to a behavior object associated with the designer. The only features you can add to ReadWriteControlDesigner are additional styles that your control might add to WebControl 's object model. For example, the System.Web.UI.Design.WebControls.PanelDesigner designer derives from ReadWriteControlDesigner and adds style attributes corresponding to the Panel control's style properties (such as HorizontalAlign ), which the Panel control adds to WebControl 's object model. To show how you can extend the PanelDesigner class, we'll implement a designer for the ScrollablePanel custom control, which derives from Panel and displays scroll bars, as shown in Figure 15-4. Figure 15-4. The ScrollablePanel control viewed in a browser at run time
Figure 15-5 shows the design-time representation of the ScrollablePanel control, which has an associated ScrollablePanelDesigner . Figure 15-5. The ScrollablePanel control in the Web Forms designer
Listing 15-4 contains the code for the ScrollablePanel control. Listing 15-4 ScrollablePanel.csusingSystem; usingSystem.ComponentModel; usingSystem.ComponentModel.Design; usingSystem.Web.UI; usingSystem.Web.UI.WebControls; namespaceMSPress.ServerControls{ [ Designer(typeof(MSPress.ServerControls.Design.ScrollablePanelDesigner)) ] publicclassScrollablePanel:Panel{ [ Bindable(true), Category("Appearance"), DefaultValue(false), Description("Specifieswhethertorenderscrollbars."), ] publicvirtualboolScrollBars{ get{ objectb=ViewState["ScrollBars"]; return(b==null)?false:(bool)b; } set{ ViewState["ScrollBars"]=value; } } protectedoverride voidAddAttributesToRender(HtmlTextWriterwriter){ base.AddAttributesToRender(writer); if(ScrollBars==true){ if((Height.IsEmpty==false) (Width.IsEmpty==false)){ writer.AddStyleAttribute("overflow", "auto"); writer.AddStyleAttribute("overflow-x", "auto"); writer.AddStyleAttribute("overflow-y", "auto"); } } } } } Listing 15-5 contains the code for the ScrollablePanelDesigner . Listing 15-5 ScrollablePanelDesigner.csusingSystem; usingSystem.ComponentModel; usingSystem.ComponentModel.Design; usingSystem.Diagnostics; usingSystem.Web.UI.Design; usingSystem.Web.UI.Design.WebControls; usingSystem.Web.UI.WebControls; usingMSPress.ServerControls; namespaceMSPress.ServerControls.Design{ publicclassScrollablePanelDesigner:PanelDesigner{ protectedoverridevoidMapPropertyToStyle(stringpropertyName, objectpropertyValue){ if((propertyName==null)(propertyValue==null)){ return; } try{ if(propertyName.Equals("ScrollBars")){ ScrollablePanelpanel=(ScrollablePanel)Component; boolscrollBars=(bool)propertyValue; if(panel.Height.IsEmptypanel.Width.IsEmpty){ scrollBars=false; } if(scrollBars==true){ Behavior.SetStyleAttribute("overflow",true, "auto",true); Behavior.SetStyleAttribute("overflowX",true, "auto",true); Behavior.SetStyleAttribute("overflowY",true, "auto",true); } else{ Behavior.RemoveStyleAttribute("overflow", true,true); Behavior.RemoveStyleAttribute("overflowX", true,true); Behavior.RemoveStyleAttribute("overflowY", true,true); } } else{ base.MapPropertyToStyle(propertyName, propertyValue); } } catch{ } } protectedoverridevoidOnBehaviorAttached(){ base.OnBehaviorAttached(); ScrollablePanelpanel=(ScrollablePanel)Component; boolscrollBars=panel.ScrollBars; MapPropertyToStyle("ScrollBars",scrollBars); } } } ScrollablePanelDesigner shows the tasks to perform when you extend the ReadWriteControlDesigner class:
In the sample files for this book, we provide the MyPanelDesigner class, which shows how to implement a designer that is similar to PanelDesigner . MyPanelDesigner derives from ReadWriteControlDesigner and adds style attributes that correspond to three additional style properties: HorizontalAlign , Wrap , and BackImageUrl . MyPanelDesigner is associated with the MyPanel control that we implemented in Chapter 11. |