Wednesday, January 2, 2013

Windows Phone Web Browser Control


The Web Browser control is used to access static content or web based content, based
on the development need. We can use this control in a number of ways in our Windows Phone Application
development, such as using it to dynamically generate HTML code and display it as a page or show a
static page saved in Isolated Storage.

1) make a new project with name WebBroserControl and copy the following layout code to MainPage.xaml


<phone:PhoneApplicationPage
    x:Class="WebBroserControl.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait" Orientation="Portrait"
    shell:SystemTray.IsVisible="True">

    <!--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="Jitesh Blogspot Visit" Style="{StaticResource PhoneTextNormalStyle}"/>
            <TextBlock x:Name="PageTitle" Text="Web Browser Control" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
        </StackPanel>

        <!--ContentPanel - place additional content here-->
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <phone:WebBrowser HorizontalAlignment="Left" Margin="9,121,0,0" Name="webBrowser1"
VerticalAlignment="Top" Height="475" Width="441" />
            <TextBox Height="72" HorizontalAlignment="Left" Margin="-4,22,0,0" Name="textBox1"
Text="http://www.blogger.com/profile/16670167524123575126" VerticalAlignment="Top" Width="380" />
            <Button Click="button1_Click" Content="Go" Height="72" HorizontalAlignment="Left" Margin="371,22,0,0"
Name="button1" VerticalAlignment="Top" Width="85" />

        </Grid>
    </Grid>

    <!--Sample code showing usage of ApplicationBar-->
    <!--<phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
            <shell:ApplicationBarIconButton IconUri="/Images/appbar_button1.png" Text="Button 1"/>
            <shell:ApplicationBarIconButton IconUri="/Images/appbar_button2.png" Text="Button 2"/>
            <shell:ApplicationBar.MenuItems>
                <shell:ApplicationBarMenuItem Text="MenuItem 1"/>
                <shell:ApplicationBarMenuItem Text="MenuItem 2"/>
            </shell:ApplicationBar.MenuItems>
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>-->

</phone:PhoneApplicationPage>

2) coly following code to MainPage.xaml.cs


using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Microsoft.Phone.Controls;

namespace WebBroserControl
{
    public partial class MainPage : PhoneApplicationPage
    {
        // Constructor
        public MainPage()
        {
            InitializeComponent();
        }
        private void button1_Click(object sender, RoutedEventArgs e)
        {
            string strURI = textBox1.Text.ToString();
            webBrowser1.Source = new Uri(strURI, UriKind.Absolute);
            //webBrowser1.Navigate(new Uri(strURI, UriKind.Absolute));
        }

    }
}

3) after clicking Go you can see the below the output on emulator




No comments:

Post a Comment