Question

我想在我的Windows应用商店的WebView中使用字体。

我指的是这个页面。 http://blogs.msdn.com/b/wsdevsol/archive/2012/10/23/about-webview-and-embedded-fonts.aspx

此页面使用WebView的Navigate方法。但我想使用NavigateToString方法。将使用该字体的HTML字符串传递给NavigateToString方法，并希望显示该HTML。以下示例1失败。

示例1：

    private async void Button_Click_1(object sender, RoutedEventArgs e)
    {
        MyWebView.NavigateToString("<html lang=\"en\" xmlns=\"http://www.w3.org/1999/xhtml\"><head><meta charset=\"utf-8\" /><style type=\"text/css\">  @font-face { font-family: \"ipafont\"; font-style: normal; font-weight: 400; src: url(ipaexm.woff);} .ipa { font-family: \"ipafont\"; font-size: xx-large; }</style></head><body><div class=\"ipa\">Hello, Good morning.</div></body></html>");
    }

我尝试过更改

src：url（ipaexm.woff）;

到

src：url（“ms-appx-web：///ipaexm.woff”）;

但我失败了。当然，我在我的Windows应用商店应用的根文件夹中包含了'ipaexm.woff'字体。

以下示例2成功。

示例2：

    private async void Button_Click_1(object sender, RoutedEventArgs e)
    {
       string style = "@font-face { font-family: 'ipa';  src: url(data:application/x-font-woff;charset=utf-8;base64," + <BASE 64 ENCODED TEXT OF FONT GOES HERE)> + ") format('woff'), url('ipa__-webfont.ttf') format('truetype'); font-style: normal; font-weight: 400; }";

        MyWebView.NavigateToString("<html lang=\"en\" xmlns=\"http://www.w3.org/1999/xhtml\"><head><meta charset=\"utf-8\" /><style type=\"text/css\">  @font-face { font-family: 'ipafont'; src: url('ipa__-webfont.eot'); } " +  style + " .ipa { font-family: \"ipafont\"; font-size: xx-large; }</style></head><body><div class=\"ipa\">Hello, Good morning.</div></body></html>");

    }

我想用一种example1的方式。我使用的字体大约是5MB，因此字体的基本64位编码文本太长。是否有通过NavigateToString方法使用字体的好方法？

Answer 1

我自己也问了同样的问题，最后找到了答案。

如果您使用Source属性将HTML放入WebView，那么有几种解决方案可行，但如果您使用NavigateToString

，这些解决方案都不起作用

除此之外。

将此代码放入HTML文件的头部。如果在css文件中，这将不起作用。

@font-face {
    font-family: 'FontAwesome';
    src: url(data:application/x-font-woff;charset=utf-8;base64,<BASE64 STRING OF fontawesome-webfont.woff>) format('woff'), 
        url('ms-appx-web:///fontawesome-webfont.ttf?v=4.2.0') format('truetype');
    font-weight: normal;
    font-style: normal;
}

您可以使用this page转换您的woff文件。如果该链接不起作用，那里有很多其他页面也是如此。

如何将字体嵌入Windows应用商店应用并从WebView NavigateToString方法使用它？

1 个答案: