Implement Control Adapters

As you could have seen in the previous posts, ASP.NET provides an extensible device-specific rendering framework for different browsers and mobile devices. Now we should examine how exactly a control (mobile or standard) renders itself, and how does it know the capabilities of the requesting browser. The magic that make them work is in the browser files. These files live in the C:WindowsMicrosoft.NETFrameworkv2.0.50727CONFIGBrowsers directory. If you open it, you’ll see a bunch of predefined browser files to use. These files are simple XML files, with the following markup:

     <browser id="browser name" parentID="parent browser name" refID="reference ID">
         <capability name="capability name" value="capability value" />
    <controlAdapters markupTextWriterType="type name">
        <adapter adapterType="name of adapter class" controlType="name of control class" />

For simplicity, I’ve omitted a few settings, and focused on the content which is specific to creating and managing control adapters. As you can see, the root is called browsers, it can contain unlimited browser nodes. A browser can inherit its settings from another by using the parentID attribute. You can define a set of capabilities (which you can later use to filter the devices) in the capabilities section. You must add a name, and the value for the current browser.

To use control adapters, you use the controlAdapters section. Here you can define multiple adapter objects, the adapterType attribute must be set to the fully qualified type of the adapter, the controlType to the control. It’s that easy to set up a mapping. You will use this section mostly when working with mobile devices, or when building custom controls. For a more detailed explanation of the browser file, refer to MSDN. You can place your browser files into your application’s App_Browsers folder, specified for this purpose.

Now lets see how to make it work! You should add the following to your web.config:

     <device name="myDeviceAdapter" predicateClass="fullyQualifiedAdapterClass" predicateMethod="specificMethodToInvoke"   pageAdapter="fullyQualifiedPageAdapter">
        <control name="fullyQualifiedControl" adapter="fullyQualifiedPageAdapter"/>

Here you can set up the mappings of the adapters and controls. It is important to note that the predicateMethod is a static Boolean method which takes one HttpContext object as a parameter, and indicates whether or not the adapter set applies.

When you are working with custom mobile controls, you will find two classes, the ChtmlTextWriter and the XhtmlTextWriter quite useful. cHTML stands for compact HTML, and was designed for devices with limited resources (memory and CPU). It doesn’t support for example JPEG, tables, style sheets, etc. XHTML stands for extensible HTML, but I don’t think I should introduce it at this very topic.


Further Readings

Browser Definition File Schema
Adapter Mappings
XhtmlTextWriter class
ChtmlTextWriter class

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s