如何为Windows Phone webview控件设置自定义字体

Question

Windows Phone 10不支持webview控件的自定义字体。边缘浏览器也不支持自定义字体。例如。 Burmese字体Zawgyi。

如何在Windows Phone应用程序中为webview控件设置自定义字体？

Answer 1

支持webview控件中的自定义字体：

（1。）创建带有嵌入字体的CSS

    body, a, p, span, div, textarea {
      font-family: MyCustomFont;
    }

    @font-face {
      font-family: MyCustomFont;
      src: url(data:application/x-font-woff;charset=utf-8;base64,d09GRgABAXXXXXXXXXXX......) format('woff');
      font-weight: normal;
      font-style: normal;
     } 

（2.）在WebView_NavigationCompleted方法

中注入jQuery和CSS

 private async void MyWebView_NavigationCompleted(WebView sender, WebViewNavigationCompletedEventArgs args)
 {
    // Inject jQuery file which located at local
    StorageFile jquery = await StorageFile.GetFileFromApplicationUriAsync(new Uri("ms-appx:///JavaScripts\\jquery-1.10.2.min.js"));
    string jquery_string = await FileIO.ReadTextAsync(jquery);
    await MyWebView.InvokeScriptAsync("eval", new string[] { jquery_string });


    // Inject custom font embedded CSS 
    StorageFile myfontcss = await StorageFile.GetFileFromApplicationUriAsync(new Uri("ms-appx:///CSS\\mycustomfont.css"));
    string myfontcss_string = await FileIO.ReadTextAsync(myfontcss);

    myfontcss_string = myfontcss_string.Replace("\n", "").Replace("\t", ""); //.Replace("'", "'").Replace("\"", """);
    string cssRef = "$(\"<style id='myfont' type='text/css'>" + myfontcss_string + "</style>\").appendTo('head');";

    await MyWebView.InvokeScriptAsync("eval", new string[] { cssRef });

  }