لطفا منتظر باشید ...
Programming <DeviceSpecific> and <Choice> Elements
The server control syntax declaration of any control that inherits from System.Web.UI.MobileControl can contain a single <DeviceSpecific> element. As we've mentioned, a <DeviceSpecific> element can contain any number of <Choice> elements. You format a <Choice> element this way:<Choice
Filter="filterName"
xmlns="urlToSchema"
<!--Optional Property Overrides--!>
>
<!--Optional Templates--!>
</Choice>
Table 9-2 describes the usage of the attributes and child elements of <Choice>.
Attribute/Child | Description |
|---|---|
Filter | The filterName value must be the name of a valid device filter defined in the <deviceFilters> section of this application's Web.config file. Device filters are case sensitive. If you don't define this attribute, the <Choice> element will be the default choice. The default <choice> element should always be the last element in the list. |
Property overrides | You can specify any attribute of the control that encloses the DeviceSpecific/Choice constuct. If the device filter returns true, the property of the enclosing control is set to the value specified here, overriding any setting defined for the enclosing control. You saw an example of this earlier, when we set the ImageUrl property of the Image control. |
Template elements | The templated controls—Form, Panel, List, and ObjectList—allow you to define content that's incorporated into the control when rendered. (You'll learn more about templated controls later in this chapter, in the section "Using Templated Controls.") |
xmlns | This attribute is not for general developer use. It is used by the Microsoft Visual Studio .NET Mobile Internet Designer to determine the type of markup inside templates. Visual Studio .NET inserts this attribute into <Choice> elements you create using the integrated development environment (IDE). Your application doesn't require this attribute to operate, and you don't need to supply a value. |
You can specify one of the <Choice> elements within a <DeviceSpecific> element without a Filter attribute; this is the default <Choice> element. You don't have to define a default <Choice> element, but if you do, it should always be the last in the list. Because the runtime evaluates the <Choice> elements sequentially, it will apply the first element that returns true for the particular client requesting the mobile page. The default <Choice> element will always return true, so the runtime will apply this <Choice> element to the enclosing control unless a <Choice> element earlier in the list is applied first. If a default <Choice> element appears earlier in the list, you can't use any <Choice> elements below it.
Listing 9-2 illustrates the various ways you can use the <Choice> element—using it for property overrides and to define <HeaderTemplate> and <FooterTemplate> elements, which are templates used with the Form control.Listing 9-2: Source file DeviceSpecificExample.aspx
<%@ Page Inherits="System.Web.UI.MobileControls.MobilePage"
Language="C#" %>
<%@ Register TagPrefix="mobile"
Namespace="System.Web.UI.MobileControls"
Assembly="System.Web.Mobile" %>
<mobile:Form runat="server">
<DeviceSpecific>
<Choice Filter="isHTML32">
<HeaderTemplate>
<table width="100%" height="100%" cellspacing="1">
<tr><td bgcolor="#003366">
<img src="sportsextra.gif">
</td></tr>
<tr><td bgcolor="#cccccc" valign="top" height="100%">
</HeaderTemplate>
<FooterTemplate>
</td></tr>
<tr><td bgcolor="#003366" height="4"></td></tr>
</table>
</FooterTemplate>
</Choice>
<Choice>
<HeaderTemplate>
<mobile:Label runat="server" StyleReference="title"
Text="SPORTS EXTRA!" />
</HeaderTemplate>
</Choice>
</DeviceSpecific>
<mobile:Label runat="server" Font-Size="Small" Font-Name="Arial">
Welcome to our mobile Sports Extra Web site.
Check here for up-to-the minute sports news as it happens!
<DeviceSpecific>
<Choice Filter="isWML11" Text="Welcome to LIVE results!"/>
<Choice Filter="isCHTML10"
ForeColor="Red"
Text="Welcome to LIVE results!">
</Choice>
</DeviceSpecific>
</mobile:Label>
</mobile:Form>
This example requires the following device filters in the application Web.config file:
<configuration>
<system.web>
<deviceFilters>
<filter name="isHTML32"
compare="PreferredRenderingType" argument="html32" />
<filter name="isWML11"
compare="PreferredRenderingType" argument="wml11" />
<filter name="isCHTML10"
compare="PreferredRenderingType" argument="chtml10" />
</deviceFilters>
</system.web>
</configuration>
The Form control contains a <DeviceSpecific> element that inserts a HeaderTemplate and a FooterTemplate if the client device supports HTML 3.2. Together these templates insert HTML markup to format the page as a table. This table has a graphic in the top row specified by using the HTML <img> tag.The second <Choice> element in the Form control's DeviceSpecific/Choice construct has no Filter attribute, so this is the default <Choice> element. If the isHTML32 filter evaluates to False for the current request, the application uses a <HeaderTemplate> element that contains a single, mobile Label control.The form defined in Listing 9-2 also contains a Label control with a DeviceSpecific/Choice construct, which is used to apply a property override. The default value for the Label control's Text property is the long string Welcome to our mobile Sports Extra Web site. Check here for up-to-the minute sports news as it happens! However, on smaller devices, such as those for which isWML11 or isCHTML10 is true, this text shortens to Welcome to LIVE results! And on the i-mode device, both the Text and the ForeColor properties have overrides as well.These device-specific customizations yield an application that's visually appealing on Pocket Internet Explorer. Figure 9-5 shows an example of this display. In this example, the Openwave simulator accesses the application as a WML browser, and so the isWML11 filter evaluates to true.
Figure 9-5: The DeviceSpecific/Choice construct used to customize presentation on Pocket Internet Explorer and a WML browser
