CustomControls
ASP.NET custom Controls


This solution demonstrates the following:

1. Embedding and using a .css file used to render the control
2. Resolving the image file references used in the CSS file.

The Basic steps that need to be followed are:

• Adding the files as WebResources in AssemblyInfo.cs

assembly: WebResource("ServerControl1.Thermometer.css", "text/css", PerformSubstitution=true)
assembly: WebResource("ServerControl1.thermometer_base.png", "image/png")
Note that PerformSubstitution = true is required to resolve the url used in the css file.

• Adding the resources to the parent page

protected override void OnPreRender(EventArgs e)
{
// Add style sheet to parent page
string cssUrl = Page.ClientScript.GetWebResourceUrl(this.GetType(), "ServerControl1.Thermometer.css");
String ResourceURL = Page.ClientScript.GetWebResourceUrl(this.GetType(), "ServerControl1.thermometer_base.png");

• Setting the Build Action to Embedded Resource

• Resolve the WebResouces in the CSS File

.ThermoBase {
background-image: url('<%=WebResource("ServerControl1.thermometer_base.png")%>');
background-repeat: no-repeat;
}

The Solution creates a pure HTML , CSS Thermometer Custom control.