Developing Mobile Applications Using the Microsoft Mobile Internet Toolkit : Page 3

Our Sample Application—Phone Number Lookups

Figure 4. Creating the Database: The finished application will use the information in this database to look up an employee by name and return his or her phone number.

The best way to learn a new technology is to develop a simple application and then enhance it. For this article, I've chosen to build a phone directory service that allows users who are out of the office to look up the phone numbers of colleagues. The best way to implement this is to build and host the mobile application on a Web server; the client device (PDA or WAP-enabled cell phone) will access the application to check for phone numbers.

Figure 5. Populating the First Form: You'll need just three controls to build the basic form that users will use to request phone number data from the Employee database.

First I need to create my database. I used Microsoft SQL Server and created the EmployeeInfo database containing a table called Employees. Populate the database with some sample records (see Figure 4).

Use Figure 5 to help you begin building the first form. Drag and drop each control onto your form in the configuration shown.

You can configure the various properties of the controls via the Property window. For the Password textbox control, set the Password property value to true so that the entered text is replaced by dots on the screen.

Once the controls are in place, you can write the application logic of the Login button:

VB.NET

    Private Sub cmdLogin_Click
	(ByVal sender As System.Object, ByVal e As System.EventArgs) 
	Handles cmdLogin.Click
        If txtName.Text = "weimeng" And txtPassword.Text = "secret" Then
            ActiveForm = Form3
        Else
            ActiveForm = Form2
        End If
    End Sub

C#

private void cmdLogin_Click(object sender, System.EventArgs e)
{
   if ((txtName.Text == "x") && (txtPassword.Text == "x")) {
      ActiveForm = Form3;
   }
   else {
      ActiveForm = Form2;
   }
}

The code above performs a check to authenticate the user. Your application should also check against a database of valid users. If the user is authenticated, the user will be transferred to Form3, else to Form2, which will be built later in this article. The ActiveForm property sets the current active form to display.

At this point I want to test the output thus far using my two emulators (see Figure 6).

Figure 6. Viewing Form1 in Pocket IE and UP.Simulator: You can preview the user interface for your initial ASP form on both the Pocket PC emulator (left) and the Openwave emulator (right).

Figure 7. Populating Form2 and Form3: Two more simple forms complete the user interface for the sample application..

Obviously, the look and feel for each browser differs wildly. While the Pocket IE displays all the controls in a single page, the UP.Simulator prompts the user name and password in different cards.

Now I'll build the remaining forms that I need for my completed app (see Figure 7).

Form2 contains the TextView control to display the error message. The use of the TextView control is very similar to that of the Label control, that is, to display text. However the Label control appends a line break <br> after it so the next control will appear below it. The TextView control allows you to turn off the line break so that controls can be positioned on the same line.

Figure 8. Displaying Form2 in Pocket IE and UP.Simulator: Form 2 simply directs a user back to Form 1 in the event of an invalid login.

Form2 also contains the Link control. The Link control creates a hyperlink to link to another page or another form. In this case, I have set the NavigateURL property of the control to "#Form1" (note the "#" character in front of the form name). Figure 8 shows Form2 completed and loaded in Pocket IE and UP.Simulator.

In Form3, I used a SelectionList control (see Figure 9) to display all the unique locations available in the database. I did this in the Activate event of the form to ensure that the list is populated when the user sees it.

Here's the code to activate Form3, in VB.NET and C#:

VB.NET

    Private Sub Form3_Activate
	(ByVal sender As System.Object, ByVal e As System.EventArgs) 
	Handles Form3.Activate
        Dim sql As String = "SELECT DISTINCT Location FROM Employees"
        Dim conn As New SqlConnection
		("server=localhost; uid=sa; password=; database=EmployeeInfo")
        Dim comm As New SqlCommand(sql, conn)
        Dim reader As SqlDataReader
        conn.Open()
        reader = comm.ExecuteReader
        lstLocation.Items.Clear()
        lstLocation.Items.Add("All Locations")
        While reader.Read
            lstLocation.Items.Add(reader("Location"))
        End While
        conn.Close()
        conn = Nothing
        comm = Nothing
        reader = Nothing
    End Sub

C#

private void Form3_Activate(object sender, System.EventArgs e)
{
   string sql = "SELECT DISTINCT Location FROM Employees";
   SqlConnection conn = new SqlConnection 
   ("server=localhost; uid=sa; password=; database=EmployeeInfo");
   SqlCommand comm = new SqlCommand(sql, conn);
   SqlDataReader reader;

   conn.Open();
   reader = comm.ExecuteReader();
   lstLocation.Items.Clear();
   lstLocation.Items.Add("All Locations");
   
   while (reader.Read()) 
      lstLocation.Items.Add(reader.GetString(0));

   conn.Close();
   conn = null;
   comm = null;
   reader = null;
}

When Form 3 is loaded and tested, it should look like Figure 9.

Figure 9. Looking Up Locations: With Form3 completed, you can test it in the Pocket IE and UP.Simulator.

Previous Page

Next Page

---

• Download The Code for this Article

---