使用 svg 缩放 WebView。如果缩放，SVG 会被像素化答案

【问题标题】：Zooming WebView with svg inside. SVG is pixelized if zoomed使用 svg 缩放 WebView。如果缩放，SVG 会被像素化
【发布时间】：2013-01-15 09:39:34
【问题描述】：

public class TWVSVGMainActivity extends Activity {  
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    WebView webView = new WebView(this);
    setContentView(webView);
    webView.getSettings().setDefaultZoom(WebSettings.ZoomDensity.FAR);
    webView.getSettings().setJavaScriptEnabled(true);
    webView.getSettings().setRenderPriority(RenderPriority.HIGH);
    webView.getSettings().setUseWideViewPort(true);
    webView.getSettings().setBuiltInZoomControls(true);     
    webView.getSettings().setDisplayZoomControls(false);
    webView.loadUrl("file:///android_asset/003.svg");
}}

缩放 SVG 图像后，它会被像素化。

我想将 svg 加载到 WebView，并且我希望 *.svg 文件中的文本不被像素化。

我错过了什么？

【问题讨论】：

在 HTML 端修复。有一些错误，如果 html 页面只有 SVG - 如果缩放，它将被像素化。但是，如果 HTML 页面包含至少一个符号 - 缩放将正常工作。
请将您的解决方案指定为正确答案，而不是评论，如果它适合您，请接受（您自己的）答案。提供更多细节会很有用。 “HTML 页面包含至少一个符号”是什么意思？谢谢！
遇到了同样的问题，他的意思是你需要在 HTML 中添加一个字符，比如句号或任何字母。您不能只拥有 SVG 图像，否则图像将被像素化。

标签： android svg webview zooming pixels

【解决方案1】：

这就是我能够在 WebView 中缩放 SVG 并最初完全缩小显示它的原因：

setInitialScale(1);
WebSettings settings = getSettings();
settings.setSupportZoom(true);
settings.setDefaultZoom(WebSettings.ZoomDensity.FAR);
settings.setDisplayZoomControls(true);
settings.setBuiltInZoomControls(true);
settings.setUseWideViewPort(true);

【讨论】：

【解决方案2】：

这就是我如何让我的 SVG 文件显示在 Jelly Bean WebView 中：

我使用 embed 标记将 SVG 包含到 HTML 文档中：

<embed width="100%" height="100%" src="{{ svg_url }}" type="image/svg+xml"/>

包含 width 和 height 属性非常重要，否则 SVG 会在 Jelly Bean WebView 中被截断。

感谢 Chab（见上文），我还必须在 HTML 页面中包含一些随机文本。像这样的事情成功了：

<span style="color:White;">hidden</span>

我还必须将<meta name="viewport" content="initial-scale = 1.0, user-scalable = yes"> 标记与webView.getSettings().setUseWideViewPort(true); 结合使用，以使SVG 在不截断部分图像的情况下进行缩放。

希望有帮助

【讨论】：