1

jsonからさまざまなデータを受信するC#/XAMLwinストアアプリがあります。その一部-html文字列。

WebView.NavigateToStringを使用してその文字列を表示します

ただし、どのようにスタイルを設定できるかわかりません。通常、私はブレンドを使用してデフォルトのスタイルを取得してから編集します。しかし、BlendではWebViewのスタイルを設定できません。

私はjsonhtmlをにラップすることになりました

<body style='background-color:black;color:white' />

しかし、このアプローチでは、アプリケーションの他の部分が使用するテーマを使用できません。

WebViewのコンテンツをスタイル設定および/またはフォーマットするための「適切な」方法は何ですか?

4

3 に答える 3

3

別の解決策は、WebViewContentHelper(またはそれくらい)クラスを作成することです。テーマを渡し、それに応じてCSSのスタイルを設定できます。例えば:

string content = WebViewContentHelper.WrapHtml(originalHtmlString, backGroundColor, webView.ActualHeight);
 webView.NavigateToString(content);

すでにWindows8からフォントスタイルをコピーし、水平スクロールを提供し、ItemDetailsテンプレートと同様に、コンテンツを列に配置するこのクラスを適応させることができます。

class WebContentHelper
{
    public static string HtmlHeader(double viewportWidth, double height) //adapt parametres
    {
        var head = new StringBuilder();
        head.Append("<head>");

        head.Append("<meta name=\"viewport\" content=\"initial-scale=1, maximum-scale=1, user-scalable=0\"/>");
        head.Append("<script type=\"text/javascript\">"+
            "document.documentElement.style.msScrollTranslation = 'vertical-to-horizontal';"+
            "</script>"); //horizontal scrolling
        //head.Append("<meta name=\"viewport\" content=\"width=720px\">");
        head.Append("<style>");
        head.Append("html { -ms-text-size-adjust:150%;}");
        head.Append(string.Format("h2{{font-size: 48px}} "+
        "body {{background:white;color:black;font-family:'Segoe UI';font-size:18px;margin:0;padding:0;display: block;"+
        "height: 100%;"+
        "overflow-x: scroll;"+
        "position: relative;"+
        "width: 100%;"+
        "z-index: 0;}}"+
        "article{{column-fill: auto;column-gap: 80px;column-width: 500px; column-height:100%; height:630px;"+
        "}}"+
        "img,p.object,iframe {{ max-width:100%; height:auto }}"));
        head.Append(string.Format("a {{color:blue}}"));
        head.Append("</style>");

        // head.Append(NotifyScript);
        head.Append("</head>");
        return head.ToString();
    }
    public static string WrapHtml(string htmlSubString, double viewportWidth, double height)
    {
        var html = new StringBuilder();
        html.Append("<html>");
        html.Append(HtmlHeader(viewportWidth,height));
        html.Append("<body><article class=\"content\">");
        html.Append(htmlSubString);
        html.Append("</article></body>");
        html.Append("</html>");
        return html.ToString();
    }
}
于 2012-12-04T10:16:03.447 に答える
1

Webviewのスタイルを設定/拡張することはできません。Webviewはコントロールサブクラスの派生物ではなく(コントロールテンプレートがありません)、独自のHWNDでホストされています。あなたはおそらくwebviewbrushを使用する方が良いでしょう。このサンプルを参照してください

于 2012-12-04T01:54:12.620 に答える
0

あなたはこのようにスタイリングすることができます

 public static string Scape(string htmlContent, string fontColor)
        {
            var htm = "<html>  <head>    <script type=\"text/javascript\"></script>    <style>      body {        color: "+ fontColor +";      }    </style>  </head>  <body>" + htmlContent +"</body></html>";
            return htm;
        }
于 2021-05-24T04:04:51.893 に答える