ASP.net 2.0 server control development control style

Asp.net| Server | control | control DEVELOPMENT

With. NET technology continues to develop and mature, server control is more and more favored by the vast number of developers. At the same time, the development of server control also presents some trends, for example, more and more powerful functions, many functions gradually from the server side to the client. In addition, server controls are becoming more attractive. This may be related to the increasingly functional and outward-looking development ideas of the Windows operating system. This article and its subsequent articles will focus on how to achieve a beautiful appearance for server controls. In fact, the appearance of a server control is primarily determined by style properties. This article focuses on the implementation of the control style of the basic knowledge of the general explanation.

　　 Introduction to server control Styles

For ordinary application developers, you only need to know what style properties The server control has, and how each style property might affect the appearance of the control. For example, if you need to modify the page background color, you need to modify the Style property BackgroundColor value, and if you need to set the appearance of the Table object, you may need to set style properties such as BorderColor, BorderWidth, and so on. However, for a control developer, not only do they need to master the knowledge that the application developer has, but they must also understand how to build control style properties.

Typically, server controls that have style properties inherit from the System.Web.UI.WebControl base class. In this way, the control class can automatically inherit multiple style properties from the base class. These style properties include getting or setting the BackColor of the control's background color, getting or setting the forecolor of the control's foreground color, getting or setting the bordercolor of the control's border color, getting or setting the control's border style BorderStyle, and so on. If the control class inherits from the WebControl base class, these style properties are automatically inherited and allow developers to override these style properties as appropriate. In addition, if the control class inherits from other existing control classes, such as the GridView, the custom control automatically inherits the style properties of the GridView base class, such as setting the AlternatingRowStyle for alternating data row styles, Sets the style of the data row being edited EditRowStyle and so on. Obviously, the style attributes inherited from the existing server control are not the focus of the discussion here. However, readers should understand that style attributes are allowed to inherit from the base class and can be used directly without modification. The style properties in the WebControl class continue to be discussed below.

The styles of the WebControl class are encapsulated in the ControlStyle property. The property value is the style data type. To better understand ControlStyle, the following is an enumeration of the ControlStyle attribute's definition code.

Private Style _controlstyle;
Defining ControlStyle Properties
Public Style controlstyle{
get {
if (_controlstyle = = null) {
_controlstyle = Createcontrolstyle ();
if (istrackingviewstate) {
((IStateManager) _controlstyle). TrackViewState ();
}
}
}
}
Defining Createcontrolstyle Methods
Protected virtual Style Createcontrolstyle () {return new style (ViewState);}
As shown in the code above, ControlStyle is a read-only property whose data type is style. When the property is first accessed, the procedure is: first, determine if the _controlstyle is empty, and if it is empty, call the Createcontrolstyle method to create the _controlstyle object, which is an instance of a style. Then, perform the view-state tracking task, which is done by the TrackViewState method provided by the style class.

After a preliminary understanding of the ControlStyle property, we should then understand the style class that is closely related to the property.

The style class is used to represent the styles of a server control, which includes the following properties:

(1) BackColor, Gets or sets the background color of the Web server control;

(2) BorderColor, Gets or sets the border color of the control;

(3) BorderStyle, Gets or sets the border style of the control;

(4) BorderWidth, Gets or sets the border width of the control;

(5) CssClass, Gets or sets the cascading style sheet class that the control renders on the client;

(6) Font, gets the property of the fonts associated with the control;

(7) ForeColor, Gets or sets the foreground color of the control;

(8) Height, Gets or sets the control's altitude;

(9) IsEmpty, gets a value indicating whether any style elements have been defined in the ViewState;

(ten) isTrackingViewState, returns a value indicating whether changes to its view state are being tracked.

(one) Registeredcssclass, gets the cascading style sheet class that has been registered with the control;

(one) ViewState, gets the view state that holds the style element.

In addition, some member methods are included in the style class. They make it easy to manipulate styles. The following is a list of methods for implementing style operations from the WebControl and style classes.

(1) Protected virtural Style Createcontrolstyle ()

Creates a style object that is used internally by the WebControl class to implement all style-related properties.

(2) public void ApplyStyle (Style s)

Copies all the Non-white-space elements of the specified style to the server control, overwriting all existing style elements of the control. where s represents the style to copy.

(3) public void Mergestyle (Style s)

Copies all the Non-white-space elements of the specified style to the server control, but does not overwrite any existing style elements of the control. where s represents the style to copy.

The above three methods are from the WebControl class. The following two methods come from the style class.

(4) Public virtual void CopyFrom (Style s)

Copies the style properties of the specified style to an instance of the style class from which this method is called. s that represents the style to copy. All properties in the current instance of the style class with this method are replaced with the associated properties in the style specified by the s parameter.

(5) Public virtual void Mergewith (Style s)

Combines the style property of the specified style with the instance of the style class from which this method is called. where s represents the style to be merged. This method joins the properties of the two style objects by setting the values in the corresponding properties of each of the properties in the style that are not set in the current instance of the style class to the value of the type specified in the s parameter. Only properties that have not been set will be replaced. If a property in the s parameter is not set, it will not replace the corresponding property in the current instance of the style class.

To help readers deepen their understanding of the above methods, a sample code is listed below.

Define two style object instances
Style S1 = new Style ();
Style S2 = new Style ();
Define ForeColor property values for S1 and S2, respectively
S1. ForeColor = color.red;
S2. ForeColor = Color.White;
Calling related methods
S1. CopyFrom (S2);
S1. Mergefrom (S2);
The code above is relatively simple. Style object instance S1 after the CopyFrom method is invoked, its ForeColor property value is modified to COLOR.WHITE;S1 after the mergefrom is invoked, its ForeColor property value is unchanged and is still color.red.

　　 overriding style properties

The overload of a style property is no different from the overloads of other properties. However, it is important to note in the implementation that the modification to the property value must be passed to the control's ControlStyle property. The following is a sample application that overrides the table control's style properties CellSpacing and caption. The server Control source code is shown below.

Using System;
Using System.Collections.Generic;
Using System.ComponentModel;
Using System.Text;
Using System.Web;
Using System.Web.UI;
Using System.Web.UI.WebControls;
Namespace webcontrollibrary{
[Defaultproperty ("Text")]
[ToolBoxData ("<{0}:webcustomcontrol runat=server> </{0}:WebCustomControl>")]
public class Webcustomcontrol:table {
Creating constructors
Public Webcustomcontrol () {
Base. Caption = "work schedule list";
Base. cellspacing = 0;
}
Overriding the CellSpacing property
[Bindable (False), browsable (false), DefaultValue (0)]
public override int CellSpacing {
get {
Return base. cellspacing;
}
set {
throw new NotSupportedException ("Cannot set cellspacing property.");
}
}
Overriding the Caption property
[DefaultValue ("Work schedule List")]
public override string Caption {
get {return base. Caption; }
set {base. Caption = value; }
}
}
}
The above code is primarily used to illustrate the implementation of overriding style properties. The specific analysis is shown below.

(1) The control class Webcustomcontrol inherits from the table. In this way, the custom control automatically inherits all the style properties that the table control has. This lays the groundwork for overriding style attributes.

(2) The property values for caption and cellspacing are set in the constructor of the control class.

(3) rewrite the CellSpacing property. This property is set by a metadata attribute tag that cannot be data bound (bindable), tells the designer that the property is not browsable (browsable), and finally sets the default value of 0 (defaultvalue). In addition, an exception is defined in the set operation of the CellSpacing property. The exception is displayed when the developer sets the property.

(4) Override the Caption property and set the default value for the property.

Some readers may think that the content of the constructor's settings is meaningless. In fact, this is the core of the implementation of this example. The new value can be passed to the Controstyle property only if a new property value is set in the constructor. Because the main work done by the ControlStyle property is responsible for style state management and the generation of style attributes. If the change is not passed to ControlStyle, the overridden style properties will not appear as expected.

The Default.aspx page source code created to test the custom control Webcustomcontrol is listed below.

<%@ Page language= "C #" autoeventwireup= "true" codefile= "Default.aspx.cs" inherits= "_default"%>
<%@ Register tagprefix= "WCC" namespace= "Webcontrollibrary" assembly= "Webcontrollibrary"%>
! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<title> Override style Properties </title>
<body>
<form id= "Form1" runat= "Server"
<div>
<wcc:webcustomcontrol id= "Demo1" runat= "Server" font-size= "small" borderwidth= "1px" cellpadding= "4" bordercolor= " Black "gridlines=" both ""
<asp:TableRow>
<asp:tablecell font-bold= "True" runat= "server" > work item </asp:TableCell>
<asp:tablecell font-bold= "True" runat= "server" up to date </asp:TableCell>
<asp:tablecell font-bold= "True" runat= "server" > Note </asp:TableCell>
</asp:TableRow>
<asp:tablerow runat= "Server" >
<asp:tablecell runat= "Server" work 1 </asp:TableCell>
<asp:tablecell runat= "Server" > July 17 </asp:TableCell>
<asp:tablecell runat= "Server" > Memo content </asp:TableCell>
</asp:TableRow>
<asp:tablerow runat= "Server" >
<asp:tablecell runat= "Server" Work 2 </asp:TableCell>
<asp:tablecell runat= "Server" > July 27 </asp:TableCell>
<asp:tablecell runat= "Server" > Memo content </asp:TableCell>
</asp:TableRow>
<asp:tablerow runat= "Server" >
<asp:tablecell runat= "Server" Work 3 </asp:TableCell>
<asp:tablecell runat= "Server" > July 29 </asp:TableCell>
<asp:tablecell runat= "Server" > Memo content </asp:TableCell>
</asp:TableRow>
</wcc:WebCustomControl>
</div>
</form>
</body>
The example application effect diagram is shown below.

According to the Default.aspx source code and the application effect diagram, the table headings (Caption) in the previous illustration and the adjacent table spacing (cellspacing) are set by the custom control, not by the control's explicit markup. This is the result of overriding the control style properties.

　　 Summary

This article begins with a brief introduction to the basics of server control styles, and then demonstrates how to override the control style properties with a typical example. Hopefully, the reader will be able to build a deeper understanding of the server control style properties through this content. In the following article, we will explain the specific ways to implement style attributes.