实现WebView中点击图片显示大图

最新推荐文章于 2024-08-08 07:43:10 发布

ruancoder

最新推荐文章于 2024-08-08 07:43:10 发布

阅读量6.5k

点赞数 4

分类专栏： Android基础文章标签： WebView 大图

本文链接：https://blog.csdn.net/ruancoder/article/details/53958773

版权

本文介绍了如何在WebView中处理图片，使得用户点击图片时能够查看大图。内容包括设置WebView加载网页的配置，处理点击事件，以及利用JavaScript接口实现图片预览功能。

摘要由CSDN通过智能技术生成

在新闻资讯app中，点击图片可以查看大图显示，如华尔街见闻。实现该功能，主要在于如何响应网页图片的点击事件，并获取到图片链接地址。而WebView里的交互操作，我们很容易想到使用Java与Javascript交互。好的，思路已经有了，为网页里的图片添加点击事件，在js里调用java代码，跳转到查看大图的页面，并将图片地址传递过去。

下面，我们分三步来实现该功能。

(1).创建JavascriptInterface。JavascriptInterface是Google官方为我们提供的Javascript与Native通信的解决方案。这里创建一个类，名称为JavascriptInterface（可自定义），为其添加一个方法startPhotoActivity()，该方法接收图片地址，启动PhotoActivity显示大图。

public class JavascriptInterface {
    @android.webkit.JavascriptInterface
    public void startPhotoActivity(String imageUrl) {
        Intent intent = new Intent(MainActivity.this, PhotoActivity.class);
        intent.putExtra("image_url", imageUrl);
        startActivity(intent);
    }
}

接下来将创建好的JavascriptInterface设置到WebView中。调用WebView类的addJavascriptInterface()方法，该方法接收两个参数，参数1是JavascriptInterfa