Post
Ask Question

Working With WebView Control In Universal Windows Apps

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.

Project Name

Step 3: Setting the platform Versions

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

Versions

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.

Designing the App

Step 5: Adding the HTML file

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

Adding the HTML file

Then, Choose the Add-> New Item.

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 .

Add the Coding

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

Now we are ready to run our Project, So Click the Local Machine for running the Application.

Application

Output

Output

Conclusion: I hope you understood how to add HTML Files in Universal Window Apps and how to run it.

 


Similar Articles