Click here to Skip to main content
Click here to Skip to main content

Building a Tabbed Pocket PC 2003 Web Browser using C#

, 4 Jun 2007 CPOL
Rate this:
Please Sign up or sign in to vote.
An article on building a Pocket PC application using VS 2005 and C#.

Screenshot - PPC_Web_Browser.jpg

Introduction

Recently, I was trying to find a browser on the net for my Imate–Jam Pocket PC that has a tabbed page facility, as in Mozilla Firefox or Internet Explorer 7. I ended up disappointed. I may have been inefficient with my search, but instead of wasting too much time with searching, I decided to build one to meet my needs. I thought sharing it others who may be be suffering like I was would be a good idea and so here it is.

Initial setup

Instead of going directly into the implementation, which of course is very simple, I would like to start from scratch in order to help those first-timers. To begin with, the first thing you need is the VS 2005 IDE. It gives a great set of tools to make the development task very easy. First, select a new project and under the project types, select Visual C# -> Smart Devices and then device application. This should get you to the correct environment to begin with.

Those of you who are building the application for the first time might be surprised to see the forms coming inside of a Pocket PC device. This is where you design your form and, like any other windows application, you can drag items from the tool box to design the form. Keep in mind, though, that you get only a small subset of tools to work with. These are the tools that the device application will support. Another important thing to note is that among the controls that you are supplied with, not all of the control methods and properties are supported. This can generate exceptions if not properly handled.

Using the code

We will be designing the application using a tab control that will help us with the tab's that will be hosting the different pages of our web browser. We add a menu bar for the tasks to be performed. The most important one is the "New Tab" menu, which will create a new tab page and associate it with the tab control.

/// <summary>
/// adds a new tab page dinamically to the tab control.
/// </summary>
private void AddNewTabPage()
{
    TabPage newTab = new TabPage();
    newTab.Text = (this.tbControl.Controls.Count + 1).ToString();
    newTab.Size = new Size(
        this.tbControl.Bounds.Width, this.tbControl.Height);
    newTab.Name = "tab" + (this.tbControl.Controls.Count + 1).ToString();
    WebBrowser w = new WebBrowser();
    w.Name = "tab" + (this.tbControl.Controls.Count).ToString();
    newTab.Controls.Add(w);
    w.Dock = DockStyle.Fill;
    this.tbControl.Controls.Add(newTab);
    this.tbControl.SelectedIndex = this.tbControl.TabPages.Count - 1;
}

You may have noticed in the above code that I am adding a web browser control to the new tab page. This is required because each new tab page should have a separate web page associated with it in order to load individual documents. I have used a combo box control to take the input of the web address. This address, which is in the form of a string, cannot be passed directly to the web browser's navigate method to fetch the content. So, we prepare a URI object that serves the purpose. Note that the address should be passed in the form: http://www.yyy.com to the URIconstructor. We achieve this using the Regex.Replace method.

if (address != null)
address = Regex.Replace(address, "^www", "http://www");
Uri url = new Uri(address);

The work is almost at an end, except for one last thing. Each time the user enters an address in the combo box and opts to navigate, the page has to be displayed in the currently selected tab. If no tab exists, we create a new tab.

if (this.tbControl.Controls.Count == 0)
{ 
    AddNewTabPage(); 
}

int selectedtabIndex = this.tbControl.SelectedIndex; 
 
//navigate to the the address apecified. 
try
{ 
    ((
        WebBrowser)this.tbControl.TabPages[
        selectedtabIndex].Controls[0]).Navigate(url);
} 
catch 
{
    MessageBox.Show("There was some error trying to reach the site");
}

In order to deploy this application in a Pocket PC or PDA, you would require Net CF 2.0 (.NET Compact Framework) installed on the device. In the case that it's not, then connect your device with the PC using Microsoft active sync (version 4.1 or above) and run the application from Visual Studio. It will prompt for the option of whether or not to deploy on the available emulators or the device. Select the device and wait for the deployment to finish. Later, you can just copy the built EXE file to the application and run it.

Points of interest

It may be a very simple application, but when the tabbed browsing experience is needed, it surely does the job. I will be coming back with other more interesting matters on this topic.

History

  • 23 May, 2007 -- Original version posted
  • 4 June, 2007 -- Article edited and posted to the main CodeProject.com article base

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

Saraf Talukder
Software Developer
United Kingdom United Kingdom
Currently living and working in London. He is an enthusiastic software developer passionate about microsoft technologies, specially C#, WPF, Silverlight WCF and windows Azure. Contributes to several open source project and msdn forums.
 
My Blog
twitter : @sarafuddin
Follow on   Twitter

Comments and Discussions

 
Questioncan't connect Pinmembergreeshmag10-Nov-11 5:04 
AnswerRe: can't connect PingroupSaraf Talukder10-Nov-11 6:56 
GeneralRe: can't connect Pinmembergreeshmag10-Nov-11 18:17 
GeneralRe: can't connect PingroupSaraf Talukder10-Nov-11 23:45 
Questionbrowser in a mobile environment Pinmembergreeshmag9-Nov-11 23:48 
AnswerRe: browser in a mobile environment PingroupSaraf Talukder10-Nov-11 0:00 
Questioni have a question Pinmembernghien_rbc5-Mar-10 16:15 
GeneralFullscreen PinmemberYatendra Kumar23-Feb-10 21:19 
GeneralRe: Fullscreen PingroupSarafuddin24-Feb-10 5:52 
GeneralHi, How can I set default webpage for this browser. PinmemberYatendra Kumar17-Feb-10 1:01 
GeneralRe: Hi, How can I set default webpage for this browser. PingroupSarafuddin24-Feb-10 5:55 
GeneralNice one buddy! PinmemberR. M. Masudur17-Jan-10 8:26 
QuestionCustomizing browser context menu on links PinmemberMvL7-Dec-07 11:16 
GeneralURLs without "www." PinmemberDanYHKim25-Oct-07 7:52 
GeneralRe: URLs without "www." PinmemberSaraf Uddin Talukder21-Oct-08 0:14 
GeneralVery nice implementation for tabs PinmemberDanYHKim25-Oct-07 5:16 
GeneralOpera 8 for Pocket PC PinmemberJoebloggs48175-Jun-07 23:48 
GeneralRe: Opera 8 for Pocket PC Pinmemberabakshi12-Jun-07 6:39 
GeneralSuggesting Minimo Pinmemberromlel594-Jun-07 23:49 
GeneralGood One for starters PinmemberSyed Moshiur Murshed23-May-07 3:59 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web02 | 2.8.141223.1 | Last Updated 4 Jun 2007
Article Copyright 2007 by Saraf Talukder
Everything else Copyright © CodeProject, 1999-2014
Layout: fixed | fluid