Android webView 支持 svg 渲染

Posted

技术标签:

【中文标题】Android webView 支持 svg 渲染【英文标题】:Android webView support for svg rendering 【发布时间】:2013-09-16 09:03:36 【问题描述】:

我有一个使用 android 4.03 - API 级别 15 开发的应用程序。它有一个 webView,我想用它来显示一个带有一些 svg 内容的 html 页面。有些 svg 内容直接嵌入到 html 中,有些则使用 javascript 动态呈现。

我有一台运行 android 2.2 的华为 S7 平板电脑。我添加了一个向后兼容包,因此我可以在选项卡中运行我的应用程序。

现在,当我创建 html 页面并在 dektop 浏览器中运行它时,它完美地呈现了所有 svg 内容。 当我在平板电脑上运行应用程序时,它不显示任何 svg 内容。它只显示白色背景。 但是,当我在我的朋友 nexus 7 平板电脑上使用 android 4.3 尝试相同的应用程序时,它完美地显示了 webView 中的所有 svg 内容。

我使用这段代码来初始化 webView

WebView mapView;
mapView = (WebView) findViewById(R.id.mapview);
mapView.setWebViewClient(new WebViewClient() 
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) 
                view.loadUrl(url);
                return true;
            

            @Override
            public void onPageFinished(WebView view, String url) 
            
        );

        WebSettings s = mapView.getSettings();
        s.setLoadWithOverviewMode(true);
        s.setLoadsImagesAutomatically(true);
        s.setUseWideViewPort(true);
        s.setJavaScriptEnabled(true);
        s.setSupportZoom(true);
        s.setBuiltInZoomControls(true);


        File externalStorage = Environment.getExternalStorageDirectory();    
        String url = "file:///" + externalStorage + "/floor_one.html";

mapView.loadUrl(url);

android 2.2 webView 与 SVG 是否存在兼容性问题?

【问题讨论】:

查看相关帖子***.com/questions/6677397/svg-support-in-android 【参考方案1】:

Android 3.0 之前不支持 SVG,所以你必须找到一些解决方法。

这篇博文解释了两个用于 SVG 的 Javascript polyfill。

http://www.kendoui.com/blogs/teamblog/posts/12-02-17/using_svg_on_android_2_x_and_kendo_ui_dataviz.aspx

【讨论】:

但是该应用程序是使用 4.03 sdk 开发的,所以其中的 webView 应该支持 svg 对吧?我也会试试这篇博文。谢谢! 即使您在最新的 SDK 上开发,旧的 Android 设备仍然运行旧的运行时库,包括 WebView。 有什么方法可以让它在新的运行时库上运行?无论如何手动添加它们。我有 2.2 平板电脑的 root 访问权限。 我没有华为S7,所以我自己无法确认,但该设备似乎有官方更新。 huaweidevice.com/worldwide/…【参考方案2】:

如果你添加这个会怎样:

webView.getSettings().setPluginState(PluginState.ON);

我可以看到你没有的唯一参数可能会产生影响。

【讨论】:

它的@deprecated 插件以后将不再支持,不应该使用。

以上是关于Android webView 支持 svg 渲染的主要内容,如果未能解决你的问题,请参考以下文章

.svg 文件作为 HTML 中的对象未显示在 Android WebVIew 中

在android webview上暂停/恢复svg动画

Android WebView:svg 或 webm 在 HTML 中的对象标记中时调用 shouldOverrideUrlLoading

在Android上怎样实现JAVA和JS交互

Android使用flutter WebView插件渲染画面

反应原生 - 构建发布 apk 时 webview 不呈现本地 html