Working With WebView Control In Universal Windows Apps

Article

Prerequisites

Visual Studio 2015

Now, let's get started with the steps, given below:

Step 1 : Create Windows Universal Project

Open Visual Studio 2015 and Click File -> New -> Project Option for New Universal App.

New

Step 2 : Giving the Project Name

Next, New Project Window will open, there we can select an installed template like “Universal” under the Windows on Visual C# Template and select a Blank App (Universal Windows) then type our Project Name HTMLApp and click the OK button.

Step 3: Setting the platform Versions

Here, we choose the Target Version and Minimum Version for our Universal Windows application and click OK button

Step 4: Designing the App

Now we go to the Solution Explorer, select MainPage.xaml, drag the WebView Tool from the Toolbox, and change the Name to myweb in the Property window.

Step 5: Adding the HTML file

Next, Go to the Assets in the Solution Explorer and right click on Assets for adding HTML files.

Then, Choose the Add-> New Item.

Here we choose the HTML Page and give the name as HTMLPage1.html and then click Add button.

Add

Step 6: Add the Coding

Next, Open MainPage.xaml.cs file and add the below mentioned source code in the MainPage() Function .

myweb.Source = new Uri("ms-appx-web:///HTMLPage1.html");
myweb.Navigate(new Uri("ms-appx-web:///HTMLPage1.html"));
myweb.NavigateToString("<Html><Body><h1>My First HTML File in Universal App<h1><Body></Html>");