martPhones are the new devices that are said to be the death knell of the PDA and its clones. You can leverage your existing .NET skills and be among the first developers making expert apps for the SmartPhone. This article will get you familiar with the SmartPhone development environment, covering all the basics and revealing the pitfalls you need to watch out for. In it, you’ll learn to build a simple application that consumes a Web service that looks up stock quotes.

Understanding the device is the first step to building SmartPhone applications. Figure 1 shows a typical SmartPhone device and its key features.

Figure 1. SmartPhone Hardware: Get familiar with the form factor before you begin.

As its name implies, the SmartPhone is a phone first, with PDA features added to it. Hence it has two very distinct send and end buttons to make or disconnect a call. The back key is a multi-function key, it acts like a backspace key when focus is in a text box and otherwise acts like a browser back button, moving to the previous screen/application in the display history.

There are two soft keys, and they are your application’s best friends. They enable you to give options to your users. Soft keys are essentially programmable keys, the functions depend on the options you provide within your program. The central navigation controls provide the ability to tab/scroll and the center button is like an action button (Enter).

Before you can build SmartPhone applications using Visual Studio.NET 2003, you need to install the SmartPhone 2003 SDK. This provides a SmartPhone 2003 template.

Once you install the SDK, choose SmartDevice ?>SmartPhone as the target platform to start building your project. You’ll get a default form and a toolbox filled with new controls specifically for the SmartPhone as well as some grayed out controls that are not available for the SmartPhone. Figure 2 is a partial snapshot of the toolbox.

Figure 2. Device Controls: This is a partial list of the controls that Visual Studio offers for use with a SmartPhone project.

Figure 3. Simple Form with MainMenu Control: This menu has two items, Go and Options, with a submenu item Exit.

One of the first things I noticed is the absence of a Button control, which is typically used by the user to indicate action. There are two reasons for this absence, 1) the SmartPhone doesn’t have a touch screen, and 2) there are alternate controls such as the menu, which allow the user to interact with the application. I discovered another problem when I tried to use the DataGrid control:it is completely unusable when you place it on a SmartPhone form.

Visual Studio will put a MainMenu control on your form by default. Use it to enable navigation, give user options, and allow the user to interact with your application. But the MainMenu is a bit too flexible for its own good: It doesn’t enforce a limitation of top-level options when building a menu. But if you add too many the application will crash. In fact, you can have only two top-level menu items, but each of those can have n-number of options (see Figure 3).

Adding a Web Reference
The sample application in this article retrieves stock quotes from a public Web service at http://www.webservicex.net/stockquote.asmx. Add a reference just as you would in any .NET application, by. right-clicking the project name in the Solution Explorer and choosing Add Web Reference. I gave the Web reference name as StockWS. This Web service has a single method called GetQuote, which takes a stock symbol as a parameter and returns a variety of information such as the Opening price, High, Low, Earnings, Last price, etc. in an XML format. Once you have added the Web service you need to invoke it in code.

Figure 4. The Application UI: The working application will accept a stock quote in a TextBox control.

Creating the Application UI
The UI for this sample application is very simple: It allows the user to enter a stock symbol and it displays the resulting stock quote (see Figure 4).

You need to place two label controls and one TexBox control on your form. I enlarged the Label2 control to fit the rest of the form, in order to best accommodate the returned values from the Web service. Next, modify the text property of the Label1 control to “Enter Stock Symbol” and leave the text property of both Label2 and TextBox1 blank. That’s all the UI you require.

Calling the Web Service
Double-click the Go menu option to open its client event, and enter the following code:

        Label2.Text = "Getting Stock Quote..."        Me.Refresh()        Dim myService As StockWS.StockQuote = New StockWS.StockQuote        Label2.Text = myService.GetQuote(TextBox1.Text)

Because we’re calling a Web service that I know is going to take some time to retrieve data, I decided to change the text of Label2 to warn the end user. Be aware that sometimes, even though you change the text of a control in code, the change doesn’t seem to occur. Therefore you need to be sure to call the form’s refresh method. This will force the window to invalidate its client area and immediately redraw itself and any child controls. The next two lines of code instantiate the Web service and change the TextBox1 text property to reflect the returned values.

Deploying the Application
Hitting F5 will pop up the deployment options dialog box.

For deployment, you have three choices: deploy your application to an actual SmartPhone device, deploy it to an emulator that connects to radio device attached to your machine, or deploy to an emulator that simulates a radio (Virtual Radio). The Virtual Radio emulator is an actual copy of the device OS that loads up in a virtual machine within your desktop operating system. This ensures you’re working with the actual bits that would be on the device.

Selelct the Virtual Radio deployment option and click Deploy. This will start the process of loading the emulator and the application. While deploying the application it first loads up System_SR_ENU.phone.cab, you need to watch the emulator screen and click the left soft key button to install it. It is a file used for development purposes; it contains string resources useful for debugging applications. Do not include it in your final application package.

Deployment Issues
The first time you try to deploy, especially on a slower machine, you may get an error that says, simply, ‘Deployment Errors.’ This happens because the emulator takes a long time to load the first time it’s used, and Visual Studio times out while waiting for it. If you get this error, you’ll just need to wait until the emulator is fully loaded and hit F5 to deploy again.

Once the application is loaded, enter a stock symbol such as MSFT, IBM, or AMZN to retrieve the latest stock price for that company. Navigating the emulator via the mouse is tedious. These shortcuts should save you a whole lot of mouse clicks:

F1?Left Soft Key
F2?Right Soft Key
Esc?Behaves like the cancel/back button
Del?Deletes characters when in text editing mode

The XML returned by the Web service contains a lot of data. Therefore I decided to add a ListView control to the form to allow these details to be viewed. You will need to resize/reposition the controls on the form including the ListView control to ensure they fit on one screen. You then need to alter the ListView columns collection by adding two columns, Symbol and Price (see Figure 5).

Figure 5. ListView Control Columns Collection: Add two columns, Symbol and Price.

The default value for the View property of the ListView control is “LargeIcon,” change this to “Details.” This enables the ListView to display its items in detail showing each value.

Hit F7 to switch to code view. Add the following statement to the top of the file:

             Imports System.XML 

Double click on an empty space on the form to add a form load event, and paste the following into the load event:

        TextBox1.Focus()

Why give the TextBox1 control focus? There is an issue with the tab order for controls. The default way to set the tab order is by selecting the menu View->Tab Order, but this doesnt work. There is another option under View->SmartPhone Tab Order, but this doesnt work at times. When the application is running, the ListView control on the form receives focus first. Thus navigating to the TextBox control to enter stock symbols becomes impossible. Giving the TextBox1 control focus in the form load event, circumvents this problem.

You also need to also alter the Go button’s click event. Replace the code with the following:

        Label2.Text = "Getting Stock Quote..."        Me.Refresh()        Dim myService As StockWS.StockQuote = New StockWS.StockQuote        Dim dsStocks As New DataSet        Dim sXML As String = myService.GetQuote(TextBox1.Text)        Dim xmlSR As System.IO.StringReader = New System.IO.StringReader(sXML)        Dim xmlR As XmlTextReader = New XmlTextReader(xmlSR)        dsStocks.ReadXml(xmlR)        ListView1.Items.Clear()        For Each dr As DataRow In dsStocks.Tables(0).Rows()            Dim Stock As New ListViewItem            Stock.Text = dr("Symbol").ToString            Stock.SubItems.Add(dr("Last").ToString())            ListView1.Items.Add(Stock)        Next        Label2.Text = ""        Me.Refresh()        TextBox1.Focus()

This code first creates an instance of the stock quote Web service. The XML returned from the GetQuote service is stored in a local variable sXML. Next I create a StringReader, xmlSR, and pass it the XML via the sXML variable. The StringReader in turn is passed to the XMLTextReader. The ReadXML method of the dataset accepts the XMLTextReader as a parameter to populate the dataset. Next I loop through the dataset rows and pick the relevant values of Symbol and Last (which is the last price of the stock) and these are added to the ListView items collection.

Hit F5 to run the application. This Web service will look up multiple stock symbols simultaneously, so this time put two symbol values in the TextBox, separated by a space (such as “MSFT AMZN”). The ListView will display the last traded values for both Microsoft and Amazon stocks.

Why use a dataset? A dataset provides a great deal of flexibility and lets you manipulate data very easily. In addition, just like the ReadXML method, you could use the WriteXML method to persist the data to the device.

Distribution and Security
Another gotcha to be aware of in the development environment is the Build Cab File option on the Build menu. This does not work for SmartPhone application development. You must use CabWizSP.exe at the command line to create CAB files for a SmartPhone application

SmartPhone application CAB files may need to be signed before they can run on the device. Most operators provide their own certification for applications before they can be loaded onto devices supplied by them. For more information, see Security in Managed Code and the .cab Signing topic in the SDK Adaptation Kit for Mobile Operators (AMO).This is part of the SmartPhone SDK documentation.

Support for the .NET CF opens the SmartPhone world to .NET developers. However, it’s got a lot of rough edges that need to be smoothed. The first mover advantage does come with pitfalls. There are various business applications such as field force automation, distribution, and customized end user applications that can be developed leveraging the strength of Web services and the rich features of the device. This might just be the device that gives a real boost to the growing mobile market. Why not be there first?