C# – WPF – Creating a browser with WPF

Posted on January 26, 2014 by

With this article I will show how to create a simple browser application with WPF (Windows Presentation Foundation). The browser is really just a simple one, with just four options: Back button, Forward button, History Chooser and Go Button.

Before proceeding to the code, I would like to express with just few words what is WPF – it is a good possibility to unite XAML code with C# (or VB). Thus, you build the front end with XAML and you power it with C# in the back. In the free version of Visual Studio (the Express one), WPF applications can be created, so there is nothing stopping you from trying it out.

With other words, this is what we achieve with our application:

Not a lot, but still you get your own browser 🙂 Really, it is not advised to use it as far as there are plenty of better ones but this one is probably not bad just for an example of the possibilities of WPF.

This is the XAML code, which builds the front end of the application

<Window x:Class="BrowserNavi.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Vitosh Academy" WindowState="Maximized">
    <DockPanel>
        <WrapPanel DockPanel.Dock="Bottom">
            <Button Margin="5" Click="visit">Go to:</Button>
            <TextBox x:Name="tb" Margin="5" Width="250"></TextBox>
            <Button Margin="5" Click="back">Back</Button>
            <Button Margin="5" Click="forward">Forward</Button>
            <Label VerticalAlignment="Center">History:</Label>
            <ComboBox x:Name="cb" Width="150" Margin="5" SelectionChanged="cb_SelectionChanged" />
        </WrapPanel>
        <WebBrowser x:Name="wb" Source="https://www.vitoshacademy.com"
                    Navigated="wb_Navigated" />
    </DockPanel>
</Window>

<Window x:Class="BrowserNavi.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Title="Vitosh Academy" WindowState="Maximized">

<Button Margin="5" Click="forward">Forward</Button>

<Label VerticalAlignment="Center">History:</Label>

</WrapPanel>

<WebBrowser x:Name="wb" Source="https://www.vitoshacademy.com"

Navigated="wb_Navigated" />

</DockPanel>

</Window>

As you see, we have one dock panel in the bottom, where we put a few buttons, combo box & text box in the bottom. Thus we leave the rest for the browser.

The buttons are made to function with the following code:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace BrowserNavi
{
    /// <summary>
    /// Internet Browser Logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void visit(object sender, RoutedEventArgs e)
        {
            try
            {
                wb.Navigate(new Uri(tb.Text));
            }
            catch (UriFormatException)
            {
                tb.Text = "( This URL is not valid )";
            }
        }

        private void back(object sender, RoutedEventArgs e)
        {
            if (wb.CanGoBack)
                wb.GoBack();
        }

        private void forward(object sender, RoutedEventArgs e)
        {
            if (wb.CanGoForward)
                wb.GoForward();
        }

        private void wb_Navigated(object sender, NavigationEventArgs e)
        {
            cb.Items.Add(wb.Source);
            tb.Text = "" + wb.Source;
        }

        private void cb_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            wb.Navigate(cb.SelectedItem.ToString());
        }
    }
}

using System;

using System.Collections.Generic;

using System.Linq;

using System.Text;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Data;

using System.Windows.Documents;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Imaging;

using System.Windows.Navigation;

using System.Windows.Shapes;

namespace BrowserNavi

{

/// <summary>

/// Internet Browser Logic for MainWindow.xaml

/// </summary>

public partial class MainWindow : Window

{

public MainWindow()

{

InitializeComponent();

}

private void visit(object sender, RoutedEventArgs e)

{

try

{

wb.Navigate(new Uri(tb.Text));

}

catch (UriFormatException)

{

tb.Text = "( This URL is not valid )";

}

private void back(object sender, RoutedEventArgs e)

{

if (wb.CanGoBack)

wb.GoBack();

}

private void forward(object sender, RoutedEventArgs e)

{

if (wb.CanGoForward)

wb.GoForward();

}

private void wb_Navigated(object sender, NavigationEventArgs e)

{

cb.Items.Add(wb.Source);

tb.Text = "" + wb.Source;

}

private void cb_SelectionChanged(object sender, SelectionChangedEventArgs e)

{

wb.Navigate(cb.SelectedItem.ToString());

}

In this code, we have a few methods, which are associated with the buttons, thus making them run. A good practice is the try-catch block, which checks whether an UriFormatException is thrown and then writing “( This URL is not valid )”. Really, a good practice!

At the end, if you only want to try the browser, you may run it from here. However, as far as this file is an *.exe file it is possible that your virus-protection software may tells you not to download it. So if you are suspicious, simply create it by yourself, just twice copy + paste of the above code in Visual Studio.

Enjoy it!