在android中显示复杂的Html文本,如gmail

时间:2015-05-19 04:49:41

标签: android html webview textview xamarin.android

您好我必须显示带有样式属性的html文本,我尝试了textview和webview。

当我使用textview与Html.fromHtml(" html text")时,它只显示没有html风格的文本和其他手

当我使用webview时,整个内容以单行显示水平滚动视图

使用texview enter image description here

使用webview enter image description here

但它在gmaill安卓应用程序中运行良好

我的代码是用于文本视图

var text = "<p style=\"margin: 0px 0px 1em; padding: 0px; border: 0px; font-size: 15px; clear: both; color: rgb(34, 34, 34); font-family: \'Helvetica Neue\', Helvetica, Arial, sans-serif; line-height: 19.5px; background-color: rgb(255, 255, 255);\">The main code is:</p><pre class=\"default prettyprint prettyprinted\" style=\"margin-top: 0px; padding: 5px; border: 0px; overflow: auto; width: auto; max-height: 600px; font-family: Consolas, Menlo, Monaco, \'Lucida Console\', \'Liberation Mono\', \'DejaVu Sans Mono\', \'Bitstream Vera Sans Mono\', \'Courier New\', monospace, sans-serif; color: rgb(57, 51, 24); word-wrap: normal; background-color: rgb(238, 238, 238);\"><code style=\"margin: 0px; padding: 0px; border: 0px; font-family: Consolas, Menlo, Monaco, \'Lucida Console\', \'Liberation Mono\', \'DejaVu Sans Mono\', \'Bitstream Vera Sans Mono\', \'Courier New\', monospace, sans-serif; white-space: inherit;\"><span class=\"com\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(128, 128, 128);\">// Use WideViewport and Zoom out if there is no viewport defined</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">\nsettings</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">.</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">setUseWideViewPort</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">(</span><span class=\"kwd\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 139);\">true</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">);</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">\nsettings</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">.</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">setLoadWithOverviewMode</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">(</span><span class=\"kwd\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 139);\">true</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">);</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">\n\nsettings</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">.</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">setLayoutAlgorithm</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">(</span><span class=\"typ\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(43, 145, 175);\">LayoutAlgorithm</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">.</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">TEXT_AUTOSIZING</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">);</span></code></pre><p style=\"margin: 0px 0px 1em; padding: 0px; border: 0px; font-size: 15px; clear: both; color: rgb(34, 34, 34); font-family: \'Helvetica Neue\', Helvetica, Arial, sans-serif; line-height: 19.5px; background-color: rgb(255, 255, 255);\">The other option is to enable pinch zoom:</p><pre class=\"default prettyprint prettyprinted\" style=\"margin-top: 0px; padding: 5px; border: 0px; overflow: auto; width: auto; max-height: 600px; font-family: Consolas, Menlo, Monaco, \'Lucida Console\', \'Liberation Mono\', \'DejaVu Sans Mono\', \'Bitstream Vera Sans Mono\', \'Courier New\', monospace, sans-serif; color: rgb(57, 51, 24); word-wrap: normal; background-color: rgb(238, 238, 238);\"><code style=\"margin: 0px; padding: 0px; border: 0px; font-family: Consolas, Menlo, Monaco, \'Lucida Console\', \'Liberation Mono\', \'DejaVu Sans Mono\', \'Bitstream Vera Sans Mono\', \'Courier New\', monospace, sans-serif; white-space: inherit;\"><span class=\"com\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(128, 128, 128);\">// Enable pinch to zoom without the zoom buttons</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">\nsettings</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">.</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">setBuiltInZoomControls</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">(</span><span class=\"kwd\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 139);\">true</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">);</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">\n\n</span><span class=\"kwd\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 139);\">if</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">(</span><span class=\"typ\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(43, 145, 175);\">Build</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">.</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">VERSION</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">.</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">SDK_INT </span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">&gt;</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\"> </span><span class=\"typ\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(43, 145, 175);\">Build</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">.</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">VERSION_CODES</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">.</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">HONEYCOMB</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">)</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\"> </span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">{</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">\n    </span><span class=\"com\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(128, 128, 128);\">// Hide the zoom controls for HONEYCOMB+</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">\n    settings</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">.</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">setDisplayZoomControls</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">(</span><span class=\"kwd\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 139);\">false</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">);</span><span class=\"pln\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">\n</span><span class=\"pun\" style=\"margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);\">}</span></code></pre> "

为textview设置文字

var textView = FindViewById<TextView>(Resource.Id.mywebtext);
textView.TextFormatted = Html.FromHtml(text);

webview

WebSettings settings = webView.Settings;
       //        webView.SetBackgroundColor(Android.Graphics.Color.ParseColor("#123456"));
        settings.UseWideViewPort = false;
        settings.LoadWithOverviewMode = false;
        settings.SetLayoutAlgorithm(WebSettings.LayoutAlgorithm.NarrowColumns);
        webView.LoadData(text, "text/html", "utf-8");

1 个答案:

答案 0 :(得分:1)

WebView webview = (WebView)this.findViewById(R.id.webview);


String html = "<html><head><title>TITLE!!!</title></head>";
html += "<body><h1>text header</h1></body></html>";


webview.loadDataWithBaseURL(filePath, html, "text/html", "UTF-8", null);

如果没有filePath:

webview.loadDataWithBaseURL(null, html, "text/html", "UTF-8", null);