Focus on Microsoft Technologies - Tutorials, Articles, Code Samples.

Monday, September 11, 2006

.NET CSS Control Adapter Toolkit

 Today we released a refresh of the CSS Control Adapters for ASP.NET 2.0 (incorporating bug fixes, feature suggestions, and adding support for new controls).  You can download it for free and immediately begin using it to enable pure CSS optimized markup for the following ASP.NET controls:

  • Menu
  • TreeView
  • GridView (new)
  • DetailsView
  • FormsView
  • DataList
  • Login (new)
  • ChangePassword (new)
  • CreateUser (new)
  • PasswordRecovery (new)
  • LoginStatus (new)

As I blogged about with the first release of the CSS Control Adapters, these control adapters use a new built-in extensibility mechanism in ASP.NET 2.0 called "control adapters".  A control adapter allows you to plug-in into any ASP.NET server control and override, modify and/or tweak the rendering output logic of that control.

What is cool about control adapters is that they do not require a page developer to program against a new control, or modify the control programming model semantics (you still use the same control properties, methods, events and templates you did before).  A developer building a page can be entirely oblivious that a control adapter is being used (the control adapter model makes it very clean to register and encapsulate this support).

Quick Getting Started Walkthrough

To use the CSS Control Adapter Toolkit, simply follow the below steps using either Visual Web Developer (which is free) or Visual Studio 2005:

Step 1: Install the CSS Control Adapter Toolkit:  

Download and install the CSS Control Adapters on your machine.  Click here to download a .VSI template project for Visual Studio that will create a ready-to-run project template with the CSS control adapters installed.  This is a safe download that doesn't modify any files or settings within VS or ASP.NET, so you don't need to worry about it causing any problems with existing code.

Step 2: Create a New Web Site with the CS Control Adpaters Registered:

Within Visual Web Developer or VS 2005, choose the "File->New Web Site" menu option.  This will bring up the "New Website" dialog.  Choose your language and then select the new "CSS Friendly Web Site" project template option that has been installed:

This will create a new web-site project for you that already has the CSS Control Adapters included as source code within your app_code directory.  It also then includes some default CSS stylesheet files with pre-defined class names for you to easily customize with whatever CSS markup you want:

.NET CSS Control Adapter Toolkit

Post a Comment