How to Embed HTML File in Windows Phone 7

This article will explain how to embed HTML content and show in WebBrowser control in Silverlight Windows Phone 7.

Getting Started

Creating a Windows Phone Application:

 Open Visual Studio 2010.

 Go to File => New => Project

 Select Silverlight for Windows Phone from the Installed templates and choose Windows Phone Application

 Enter the Name and choose the location.

Click OK

First of all add a new .htm file in application and put some text in body tag like this:

<html>

<head>

<title>This page shows how to embed HTML Content in WP7</title>

</head>

<body>

<h1>Welcome!</h1>

<br />

<h1>To see the all articles by Raj Kumar on C-SharpCorner.com</h1>

<h1>Click here "<a

href="http://www.c-sharpcorner.com/Authors/raj1979/raj-kumar.aspx">Raj

Kumar's World</a>"</h1>

</body>

</html>

Now drag and drop a WebBrowser control on page and a button and put this code on button click event.

MainPage.xaml

<Grid.RowDefinitions>

</Grid.RowDefinitions>

</StackPanel>

<phone:WebBrowser HorizontalAlignment="Left" Margin="10,73,0,0" Name="webBrowser1" VerticalAlignment="Top" Width="440" Height="528" />

<Button.Background>

</LinearGradientBrush>

</Button.Background>

</Button>

</Grid>

MainPage.xaml.cs

Here are the namespace you have to add first:

using System.IO.IsolatedStorage;
using System.Windows.Resources;
using System.IO;

First I am storing html file in Isolated Storage.

What is Isolated Storage?

Isolated Storage is like cookies which provide the ability to store data on client between application invocations but unlike cookies Isolated Storage is full-fledged virtual file system, it provides the application ability to Create, Read, Write, Delete and enumerate files and directories inside the virtual file system.

private void SaveHTMLFile()

{

string fileName = "TextFile1.htm";

IsolatedStorageFile isolatedStorageFile = IsolatedStorageFile.GetUserStoreForApplication();

if (isolatedStorageFile.FileExists(fileName) == true)

{

isolatedStorageFile.DeleteFile(fileName);

}

StreamResourceInfo streamResourceInfo = Application.GetResourceStream(new Uri(fileName, UriKind.Relative));

using (BinaryReader binaryReader = new BinaryReader(streamResourceInfo.Stream))

{

byte[] data = binaryReader.ReadBytes((int)streamResourceInfo.Stream.Length);

using (BinaryWriter bw = new BinaryWriter(isolatedStorageFile.CreateFile(fileName)))

{

bw.Write(data);

bw.Close();

}

private void btnLoadHTML_Click(object sender, System.Windows.RoutedEventArgs e)

{

// TODO: Add event handler implementation here.

SaveHTMLFile();

webBrowser1.Navigate(new Uri("TextFile1.htm", UriKind.Relative));

}

Now time to run the application to see the result on button click.

Image 1.

We are done here. Question or comments are most welcome. Drop me a comment in c-sharpcorner comments section.