Load local html file in WebView Metro Style app

在开发Metro风格的应用程序（通常称为Windows Store应用程序）时，使用WebView控件来加载和显示本地HTML文件是一个常见需求。这可以通过几种不同的方法来实现，下面我将详细介绍一种实用的方法并提供具体的示例。

方法：使用ms-appx-web协议

在Windows Store应用中，WebView控件支持特殊的URI方案，如ms-appx-web://，该方案用于访问应用包内的资源。这意味着您可以将HTML文件放置在项目的特定文件夹中（例如Assets文件夹），然后通过WebView控件加载它们。

步骤说明：

1. 准备HTML文件： 将需要加载的HTML文件放入项目的Assets文件夹中。例如，假设您有一个名为example.html的文件。

2. 修改页面的XAML代码： 在您的XAML页面中添加一个WebView控件，并设置其Source属性为指向您的HTML文件的ms-appx-web URI。

   xml
   <WebView x:Name="webView" Source="ms-appx-web:///Assets/example.html"/>

3. 处理WebView的导航事件（可选）： 如果需要在HTML页面中处理链接或进行额外的JavaScript交互，您可以在WebView控件的导航事件中进行处理。

   csharp
   private void webView_NavigationStarting(WebView sender, WebViewNavigationStartingEventArgs args)
   {
       // 在这里处理导航事件，例如拦截某些URL等
   }

示例代码：

以下是一个简单的示例，其展示了如何在Windows Store应用程序中使用WebView加载本地的example.html文件：

xml
<Page
    x:Class="MyApp.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <WebView x:Name="webView" Source="ms-appx-web:///Assets/example.html"/>
    </Grid>
</Page>

注意事项：

• 确保HTML文件已正确添加到项目中，并且其“生成操作”属性设置为“内容”，以确保它被包含在应用程序的打包文件中。
• 使用ms-appx-web方案时，只能访问包内的资源，如果需要访问外部文件，可能需要考虑其他方案如使用文件选取器等。

通过以上步骤，您可以在您的Metro风格应用程序中成功地通过WebView控件加载本地HTML文件，提供丰富的内容和交互式体验。