Products
Database Search Solution (New Version) Search Control SEO Pager Highlighter Shortcut Controls Crypt Package Free ASP.NET Controls
Geotargeting Component ASP.NET Media Player Control Flash Video Player Control Services
ASP.NET Telecommute Jobs Free IP Location Lookup Test .Net Regular Expressions CSS/Table/DIV Page Layouts Custom Programming Article Sites Master List |
How to make ASP.NET Applications that support mobile devicesMobile Devices such as cell phones with web access and Personal Digital Assistants (PDA's) are becoming more common. The infrastructure that supports "Wireless web " is becoming larger and more reliable with the advent of time. There is clear indication that mobile users would keep on growing at tremendous rate. In this scenario, there are good opportunities for developing web pages special to these mobile devices, so that they can make a good use of technology. However, this idea is not liked by many developers. The main reason being the cost of adding extra pages to their web site. Especially, if we look at cellular phones, they use a different standard called "Wireless Markup Language " (WML) for consuming web pages. And we know that developing WML pages would take extra effort on developer's side and hence more cost. So, what's different that ASP.NET offers to Internet applications for Mobile Devices? By using ASP.NET Mobile Software Development kit (Mobile SDK), a developer can create web pages with the same norms and constructs that are required for building any traditional page. This article is aimed to explore some dimensions of ASP.NET Mobile SDK. At the end of this lesson, a reader should have the idea of:
Variance across different mobile devicesThere is inherent difficulty while we deal with mobile devices. They have limitations and constraints. Some of them can use JavaScript and many of them do not. Some of them can display HTML pages but most cell phones can not. They have to rely on WML standard for accessing web. So, making a website that supports all of these devices is difficult. When you study their limitations in details, you would come to know that designing PDA accessible websites is relatively easy. Because: 1. PDA's can render HTML pages and display many existing websites without problems. What is WML & XML?Generally, cell phones can consume WML files only. WML is Wireless Markup Language which is based on XML (eXtensible Markup Language). XML in contrast to HTML supports user defined tags. It supports a natural way of representing data. XML files have schema associated with them which tells the structure in which these files are made up of. Do not worry if you don't know XML in detail. However, you are encouraged to take a look at it ( www.w3schools.com ). The code below shows a sample WML page.
The first line is the standard XML header which is present in all WML pages. The next two lines specify the schema for this WML file. These three lines are integral in every WML page. Every WML page consists of <wml> tags. WML files are made up of cards each which can embed different html tags inside. In Listing 1.1, output is generated under one tag only. Rendering: ASP.NET renders WML files automatically (so you do not have to write WML files explicitly). It detects the nature of caller; cellular phone or PDA. Since PDA can not render WML pages, ASP.NET handles such problems by controlling rendering of pages itself. Emulator Programs: You can test the pages you develop in standard web browser, but it would not give a realistic picture of what you have developed. To resolve this problem, some emulators have been developed. They simulate a cell phone or PDA on desktop of your PC so that it can be treated as virtual mobile device. You should use emulators to test the web pages you design for mobile devices. Two emulators have been developed by Microsoft. One is for Cellular phones and the other one is for PDA's. Download them and install them before testing your pages (This would be the most time consuming task in your learning). Creating ASP.NET Mobile Web pagesNow, we discuss the main theme of this article. How you can create mobile web pages (generally called web forms in ASP.NET environment). The code below displays a simple message for any mobile device. Note that ASP.NET Mobile library classes have to be included in every mobile web page. These classes define mobile web controls.
The first two lines include MobilePage class, which contains definitions of stock mobile classes. The next four lines specify namespace, which defines the mobile controls. All you have to do is include Lines 1-6 in every mobile web page that you design. The TextView displays simple Text messages. Each mobile web form corresponds to single page displayed on mobile device. You can keep one form per page. But a better way is to use multiple forms per web page. To display the other forms, you have to append the second form's ID property to the URL using the # character. There are two benefits of using multiple forms per page.
In the code above, the first form (form1) is linked to the second form (form2) by using NavigateURL property and by appending form2's id to the link preceded by #. Whenever you connect two different forms on a same page, this is standard procedure. You can also set the ActiveForm property of the page to achieve the same goal. ASP.NET Mobile Web ControlsMobile Programming involves many controls that are used to deal with the input/output data and presenting it. Some of these controls are the same you normally use in traditional ASP.NET programming. I am giving a short list of mobile controls along with their description. TextView Description: Used to display simple text messages on the screen. Example: See its use in Listing 1.2 & 1.3 Label Description: Displays strings on the screen. Its value can be set dynamically. Example: if (age<21) MyLabel.text = " Under 21 " List Description: It is used to display a bulleted list of items which users can select. When the user selects an item, an ItemCommandEvent is sent which can be handled programmatically. Example: See the coming example (Listing 1.4). SelectionList Description: It displays a list of items and it can also be populated with the server code. ObjectList Description: To display the user defined items, this control is used. Complex list items can be handled using this control. Input Controls: There are some controls for getting input from the user. These include a button (which appears as a link of cell phones), TextBox (which allows user to enter alphanumeric values), and a link. Validation Controls: All Validation Controls that we see in traditional ASP.NET pages can be used in mobile programming as well. These include RangeValidator (validates the range of values), CompareValidator (compares certain input fields), RegularExpressionValidator (Can be used to restrict user to specific format input), CustomValidator (defined by programmer) and SummaryValidator (Takes results of all their validation controls and let the programmer format these results). Call Control: This is interesting control which can make phone calls from your cell phone and PDA's. To enable this, set the PhoneNumber property to the number that the device should dial when the control is selected. Other Controls: There are some other controls like Calendar, AdRotator and Image Controls which may not be supported by some mobile devices. However, there are alternates available to do these tasks.
In the above code sample, the user would be given two options: Display the comments about a particular day Or Display the name of the Day. You can see the role of ActiveForm here. From the list menu, we would go its event handler that we have defined as GiveComments. This example should be enough for you to do almost all tasks associated with user interaction. Lastly, the final property I am going to elaborate is Pagination . Since the mobile devices have small screens and data to be displayed can be more than the screen size, you can use Pagination property to break the long message into smaller messages. This way a user can read smaller messages by tapping a button at the bottom of the screen or tapping the Select button to show the next part of message. Pagination is achieved by setting Pagination property to true as in:
Summary:
Tutorial toolbar: Tell A Friend | Add to favorites | Feedback | |