Home > DeveloperSection > Articles > WebBrowser Control in Windows 7 Phone Development

WebBrowser Control in Windows 7 Phone Development

Posted by  Arun Singh
on    April-14-2012 16:19 PM

Windows Phone Windows Phone 
Ratings:
0 Comment(s)
 3320  View(s)
Rate this:

WebBrowser Control in Windows 7 Phone Development

The most obvious reason to use the WebBrowser control is to display web content within the page of a Windows Phone 7 application. For instance, you may be developing an application that shows Twitter feeds in a portion of the screen. The easiest way to do this would be to create a WebBrowser control in the application and navigate to a given Twitter page from within that control.

This article is going to explain how to use WebBrowser control in Windows 7 phone development. Let’s see a brief demonstration on it.

Getting started:

1.       Open Visual Studio

2.       Create new Silverlight Windows 7 Phone Development Project

3.       Enter your project Name

4.       Click on button ‘Ok’

WebBrowser Control in Windows 7 Phone Development

Now drag and drop WebBrowser control in ‘MainPage.xaml’ design interface and set some properties of WebBrowser control.

WebBrowser Control in Windows 7 Phone Development

Now write down the following to code to build up above layout.

Code of MainPage.xaml:

<!--LayoutRoot is the root grid where all page content is placed-->

    <Grid x:Name="LayoutRoot" Background="Transparent">

        <Grid.RowDefinitions>

            <RowDefinition Height="Auto"/>

            <RowDefinition Height="*"/>

        </Grid.RowDefinitions>

 

        <!--TitlePanel contains the name of the application and page title-->

        <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">

            <TextBlock x:Name="ApplicationTitle" Text="My Application" Style="{StaticResource PhoneTextNormalStyle}"/>

            <TextBlock x:Name="PageTitle" Text="WebBrowser Demo" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}" FontSize="40" />

        </StackPanel>

 

        <!--ContentPanel - place additional content here-->

        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">

            <phone:WebBrowser HorizontalAlignment="Left" Margin="0,74,0,0" Name="webBrowser1" VerticalAlignment="Top" Background="#FF64E5E5" DataContext="{Binding}" Height="603" Width="456" AllowDrop="False" />

            <Button Content="Go" Height="72" HorizontalAlignment="Left" Margin="348,6,0,0" Name="btnGo" VerticalAlignment="Top" Width="102" FontSize="22" Click="btnGo_Click" />

            <TextBox Height="72" HorizontalAlignment="Left" Margin="6,6,0,0" Name="txtSearch" Text="" VerticalAlignment="Top" Width="336" />

        </Grid>

    </Grid>

 

 Code of MainPage.xaml.cs:

using System;

using System.Windows;

using Microsoft.Phone.Controls;

 

namespace webBrowserDemo

{

    public partial class MainPage : PhoneApplicationPage

    {

        // Constructor

        public MainPage()

        {

            InitializeComponent();

        }

 

        private void btnGo_Click(objectsender, RoutedEventArgse)

        {

            string strUri=txtSearch.Text;

            webBrowser1.Source=new Uri(strUri, UriKind.Absolute);

            webBrowser1.Visibility=System.Windows.Visibility.Visible;

        }

 

      

    }

}

 

 

Now execute your application; following output will be appearing.

WebBrowser Control in Windows 7 Phone Development

Now click on button ‘Ok’.

WebBrowser Control in Windows 7 Phone Development

This is the complete description of WebBrowser control in windows phone development.  I hope you will enjoy it. Thanks for reading this article.
















Recent Activities

Pravesh Singh Created New Discussion Stop items with same id being add in a session   4 hours ago

Barbara Jones added new Question What is ANR?   2 days ago

Kamlakar Singh added new Blog Convert Text Document to PDF File   15 days ago

Kamlakar Singh added new Article Introduction to Backbone.js   15 days ago

Don't want to miss updates? Please click the below button!