Tabbed WebBrowser - a work in progress

Lots of people have asked lots of questions relating to building a tabbed Web browser. I've seen the same questions asked again and again so, rather than answering them again and again, I'm going to build a tabbed Web browser, piece by piece, and post the result here.

The first stage is the WebBrowser controls on the TabPages. It's usually beginners but I've answered the question of how to put multiple WebBrowser controls on multiple TabPages too many times already. One of the basic ideas of OOP is encapsulation. Another is inheritance. Let's put those together to inherit the TabPage control to encapsulate a WebBrowser control.

VB.NET Code:

Public Class WebBrowserTabPage
    Inherits System.Windows.Forms.TabPage
 
    Private _browser As New WebBrowser
 
    Public ReadOnly Property Browser() As WebBrowser
        Get
            Return Me._browser
        End Get
    End Property
 
    Public Sub New()
        Me._browser.Dock = DockStyle.Fill
        Me.Controls.Add(Me._browser)
    End Sub
 
End Class

Now, instead of adding regular TabPages to your TabControl you create WebBrowserTabPage objects and add them. Each one IS a TabPage so it can be added to a TabControl, and each one creates and displays it's own WebBrowser control.

I've added a ReadOnly property via which you can access the WebBrowser control from the TabPage. This allows you to access properties, methods and events of the WebBrowser from outside the TabPage. If you wanted to be "more correct" you could keep the WebBrowser private and declare pass-through members in the WebBrowserTabPage class, e.g.

VB.NET Code:

Public Sub Navigate(ByVal urlString As String)
    Me._browser.Navigate(urlString)
End Sub

That would be considerably more work though, as the WebBrowser class has quite a few members.

Stay tuned for additions and improvements but, for now, it's a start. :)

Here's the first update. It's a couple of improvements to the WebBrowserTabPage class.

vb.net Code:

Public Class WebBrowserTabPage
    Inherits System.Windows.Forms.TabPage
 
    Private WithEvents _browser As WebBrowser
 
    Public ReadOnly Property Browser() As WebBrowser
        Get
            Return Me._browser
        End Get
    End Property
 
    Public Sub New()
        Me.New(New WebBrowser)
    End Sub
 
    Public Sub New(ByVal browser As WebBrowser)
        browser.Dock = DockStyle.Fill
        Me.Controls.Add(browser)
        Me._browser = browser
 
        If browser.DocumentTitle = String.Empty Then
            Me.Text = "(Empty)"
        Else
            Me.Text = browser.DocumentTitle
        End If
    End Sub
 
    Private Sub _browser_DocumentTitleChanged(ByVal sender As Object, _
                                              ByVal e As EventArgs) Handles _browser.DocumentTitleChanged
        Me.Text = Me.Browser.DocumentTitle
    End Sub
 
End Class

Firstly the _browser variable has been declared WithEvents. I've then handled its DocumentTitleChanged event so the the page title is displayed automatically on the tab.

I've also changed the constructor a bit and added another. This allows you to create a page with an existing WebBrowser control. The reason for this will become clear at a later stage.

Thanks for this, it is very helpful!

The next instalment is here. It's nothing too exciting. I've added some pass-through members to the WebBrowserTabPage class for what I consider to be the most important members of the WebBrowser class. By "pass-through members" I mean public members whose only purpose is to provide access to the corresponding member of the internal WebBrowser control. For instance, the WebBrowserTabPage.IsBusy property simply returns the value of the WebBrowser.IsBusy property. This just makes things a bit cleaner because we can access members of the tab page instead of having to access a member of its Browser property. The Browser property is still there in case we need to access other members though.

This is pretty much it for the WebBrowserTabPage. The next step will be to customise the TabControl a little to get easier access to WebBrowserTabpage objects, rather than casting TabPage references all the time. After that it will be time to create a UserControl that incorporates the customised TabControl but also lets us hide the tabs when there is only one page open, which many browsers do. Beyond that it will be time to put that control on a form and start implementing some real Web browser functionality.

Back again with another addition. As I said it would be, this is not especially exciting but it is useful. It's a customised TabControl will return the SelectedTab or any tab page by index as a WebBrwoserTabPage reference. That saves you having to cast from type TabPage to type WebBrowserTabPage yourself every time you want to reference a page.

Note that this control will be beefed up later on, with the addition of things like context menus on each tab and a close button on each tab too. That's advanced functionality though, so let's get the basics in place first.

The next installment will be the promised UserControl, which will be a bit more interesting. After that there will be a form involved, so we will start to see some of this functionality in action. Initially the form will have an address bar, a Go button and Back and Forward buttons.

Could i get a full project of this?

Quote:

---

Originally Posted by gameguru345

Could i get a full project of this?

---

I will be attaching the project to each post as I go as soon as there's a project worth posting. That will be when there's more than just my own code involved. That will be as soon as I create a user control or a form. That will be the next stage.

thank you, but please hurry, i have limited time to get the tabs. (homework project)

Quote:

---

Originally Posted by gameguru345

thank you, but please hurry, i have limited time to get the tabs. (homework project)

---

Yes, let me hurry to do this on my own time so you don't have to do your own homework.

soz, cant you just send a full project of your last one. it would make things easier

and no your not doing it for me its a feature i want to have in my own project.

I have a small problem when i add the first tab it works great when i add others all the web browser controls disapear am i doing some thing wrong

Quote:

---

Originally Posted by dead-man

I have a small problem when i add the first tab it works great when i add others all the web browser controls disapear am i doing some thing wrong

---

Yes you are.

To those who were following this thread, I apologise for letting it go stale. I have been looking for a job and a place to live in recent weeks. I've been spending most of my free time improving my ASP.NET skills. I start a new job in a week and once I'm settled in I'll get back to this project.

Quote:

---

Originally Posted by jmcilhinney

To those who were following this thread, I apologise for letting it go stale. I have been looking for a job and a place to live in recent weeks. I've been spending most of my free time improving my ASP.NET skills. I start a new job in a week and once I'm settled in I'll get back to this project.

---

You going to be alright? At least where you live the economy's not f**ked (unlike where I live - Michigan, USA)

Hey! I'm finally back to this project. I have attached the most recent version of the project to the first post in this thread. I'll do the same each time I make changes.

Note that the code is well commented so make sure you read it carefully before posting any questions.

At the moment you can add and close tabs and the application will react appropriately to changes in the selected tab. This means that the window title, the address and the status text and progress will update for the currently selected tab.

The Back, Forward, Refresh, Stop and Open commands don't work at the moment. Working versions of these will be the next addition to the project. After that I'll look at adding functionality like favourites and history, as well as addressing issues like what happens when a new window wants to open.

Questions and suggestions are welcome but I make no guarantees about if or when I'll be able to address them.

Great news :) Looking forward for uptades

I've added another update to the project. The Back and Forward buttons and menu items now work. I've also added a Home button and menu item and an Options dialogue where you can set the home page. There are a few other little superficial changes that I won't go into. The new version has replaced the old version attached to the first post.

Note that the home page feature demonstrates the use of My.Settings for those who aren't familiar with it. I chose not to bind the controls in the Options dialogue to the settings to allow the user to make changes and then cancel without saving.

It might be superfluous but you could make the default page for each new tab "about:Tabs". Then it shows the "new tab opened" page from Internet Explorer.

Otherwise, a brilliant little application! You could always try and write your own web browser too if you had the patience!

if you do incorporate anything, make the home page configurable. That annoying home page is one of the reasons i quit using IE. Besides which, even that page itself has a setting to stop you ever seeing it again. then it automatically opens about:blank.

jmc, excellent work on this project.

Please can you show me how to capture the url of the currently selected tab within tabbedwebbrowser ?

Quote:

---

Originally Posted by Xancholy

jmc, excellent work on this project.

Please can you show me how to capture the url of the currently selected tab within tabbedwebbrowser ?

---

The current project already does that, when a page loads or when you switch tabs.

Thanks. I see what you mean. Selected tab's url is displayed in addressbar.

Quote:

---

Originally Posted by Xancholy

Thanks. I see what you mean. Selected tab's url is displayed in addressbar.

---

Uhuh. Look first, ask questions later.

When user selects any tab, how can I find the tab name and refer to that tab in code ? Thank you

Quote:

---

Originally Posted by Referee2424

When user selects any tab, how can I find the tab name and refer to that tab in code ? Thank you

---

did you happen to read his other posts? Read #5 again.

Quote:

---

Originally Posted by jmcilhinney

It's a customised TabControl will return the SelectedTab or any tab page by index as a WebBrwoserTabPage reference.

---

Thanks> I'm sorry I'm just learning. Please can you show me how to refer to selectedtab by code ?

Quote:

---

Originally Posted by Referee2424

Thanks> I'm sorry I'm just learning. Please can you show me how to refer to selectedtab by code ?

---

No. Download the project. Open it. Read the code.

No ? I had downloaded it, opened it and read the code. OK, then, people seem to be rude on these forums.

Code:

---

Warning        1        XML comment has a tag with a 'cref' attribute 'OptionsDialogue' that could not be resolved. XML comment will be ignored.        TabbedWeBrowserOptionsDialogue.vb        18        39        Tabbed Web Browser

---

Anyone else getting this error ? Also main form line 22/39 same xml 'cref' error.

Code compiles and builds fine though... Just thought I'd check.

Quote:

---

Originally Posted by Referee2424

No ? I had downloaded it, opened it and read the code. OK, then, people seem to be rude on these forums.

---

Maybe people think that when they spend hours creating a sample program for the benefit of others that those others shouldn't really need to ask a questions that are clearly answered in that sample program. Have you searched that code for SelectedTab to see how I've used it? If you have a separate question that doesn't relate to my code specifically then this thread is not the place to post it.

Quote:

---

Originally Posted by Xancholy

Code:

---

Warning        1        XML comment has a tag with a 'cref' attribute 'OptionsDialogue' that could not be resolved. XML comment will be ignored.        TabbedWeBrowserOptionsDialogue.vb        18        39        Tabbed Web Browser

---

Anyone else getting this error ? Also main form line 22/39 same xml 'cref' error.

Code compiles and builds fine though... Just thought I'd check.

---

That's a warning, not an error, and it doesn't exist in my code. You have presumably changed the name of the OptionsDialogue class to TabbedWeBrowserOptionsDialogue and failed to change the reference to the original class name in the XML documentation comments. Just double-click the warning message in the Error List window and it will take you to the offending line, which you can then edit. You might also like to consider spelling the name of your class correctly. It should be "TabbedWebBrowserOptionsDialogue".

That said, how many Options dialogues are you going to have in the Tabbed Web Browser project that you need to change the name like that anyway? Isn't it fairly obvious that an OptionsDialogue class in a Tabbed Web Browser project is a dialogue for the options for the app without changing the name? What's the point of really long names if they don't actually add any clarity?

Nice job jmc on the tabbed browser.

What other plans do you have for this?
What's next?

:)

Quote:

---

Originally Posted by epixelman

Nice job jmc on the tabbed browser.

What other plans do you have for this?
What's next?

:)

---

Bookmarks, history and then some tab-specific features like a right-click menu.

Jmc, if it's possible, how can I add your WebBrowserTabControl component to my toolbox? I already added files to my project, but WebBrowserTabControl component is still missing...

Edit: Nevermind, I found a video tutorial on youtube:D

yay for youtube :P

Anyway, on topic reply: Great job here ;), I would ask for permission to use this project as a basis for a big thing I'm doing, but, I'll use it as a reference, cause it is well commented as he has said.

Props to you my friend :D

Quote:

---

Originally Posted by formlesstree4

yay for youtube :P

Anyway, on topic reply: Great job here ;), I would ask for permission to use this project as a basis for a big thing I'm doing, but, I'll use it as a reference, cause it is well commented as he has said.

Props to you my friend :D

---

Anything I post on this forum is intended to be free to access and use under any conditions by anyone, unless otherwise stated. I do appreciate your asking though.

Oh ok then, well, I'll still be sure to give you credits in the about page :D

I have removed some posts from this thread. If you have any comments concerning other members then you are welcome to state them directly in a private message and not in the public forums. Please keep this this thread to comments and discussion concerning this codebank submisssion ONLY.

No this doesn't help to download files from FTP server

Hey JMC, how's this project coming along? You haven't been asked since 25-Aug-08...thought it'd be time to annoy you again! ;-)