Android WebView实现截长图功能

 更新时间:2018年05月15日 10:55:47   作者:lixiaodong_  
这篇文章主要为大家详细介绍了Android截长图的一种实现方式,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了Android实现截长图功能的具体代码,供大家参考,具体内容如下

先看看手机自带的长截屏功能:  机型: vivo x9 plus

     

大胆推测实现逻辑:        

 1:需要一个可以滚动的View    

 2:截取View在屏幕渲染的内容        

 3:不断滚动View,截取View渲染的内容,存储到容器中            

 4:将容器中图片,按顺序拼接组装起来.        

 5.保存

 根据我们推测的逻辑,一步步实现:

1.我们这里以WebView控件为介绍对象

<WebView 
 android:id="@+id/web_view" 
 android:layout_width="match_parent" 
 android:layout_height="match_parent"/> 

2.获取View渲染的内容

//1:打开缓存开关 
view.setDrawingCacheEnabled(true); 
//2:获取缓存 
Bitmap drawingCache = view.getDrawingCache(); 
//3:拷贝图片(这里就是我们需要的截图内容啦) 
Bitmap newBitmap = Bitmap.createBitmap(drawingCache); 
//4:关闭缓存开关 
view.setDrawingCacheEnabled(false); 

3.不断滚动View,截取View渲染的内容,存储到容器中

滚动的方法

//这些都是View的方法 
webView.setScrollY(); 
webView.scrollTo(); 
webView.scrollBy(); 

每次滚动多少距离?

假设我们的WebView是宽高占满屏幕的, 那么通过getDrawingCache()方法,是获取WebView在屏幕显示渲染的内容,那么WebView控件的高度就是我们每次滚动的距离.

滚动几次?

滚动次数 = WebView内容的高度 / WebView控件的高度 + 1(有余数的情况下会多滚动1次)

假设: 内容高度为3840,控件高度为1920, 那么我们只需滚动两次,2次截图

内容高度为4000,控件高度为1920, 会余160高度没有截取,需要截图3次,所有需要滚动次数要+1

核心代码:

//1:发起测量 
mWebView.measure(0, 0); 
//2:获取测量后高度 == Webview的高度 
int contentHeight = mWebView.getMeasuredHeight(); 
//3:获取Webview控件的高度 
int height = mWebView.getHeight(); 
//4:计算滚动次数 
int totalScrollCount = contentHeight / height; 
//5: 剩余高度 
int surplusScrollHeight = contentHeight - (totalScrollCount * height); 
 
//存储图片容器 
List<Bitmap> cacheBitmaps = new ArrayList<>(); 
for (int i = 0; i < totalScrollCount; i++) { 
 if (i > 0) { 
  //滚动WebView 
  mWebView.setScrollY(i * height); 
 } 
 //获取截图,通过步骤1获取,这里不贴代码了 
 Bitmap bitmap = getScreenshot(mWebView); 
 cacheBitmaps.add(bitmap); 
} 
 
//如果不能整除,需要额外滚动1次 
if (surplusScrollHeight > 0) { 
 mWebView.setScrollY(contentHeight); 
 Bitmap bitmap = getScreenshot(mWebView); 
 cacheBitmaps.add(bitmap); 
} 

4.组装拼接图片

  遗憾的是,google并没有提供组装图片的api,所有就我们需要自己画啦

  what? 自己画?

 没错,就是自己画啦,在android中画画,跟现实世界画画步骤一样的,同样要先准备纸,画板,画笔.

核心代码:    

public Bitmap mergeBitmap(List<Bitmap> datas) { 
 //图纸宽度(因为是截图,图片宽度大小都是一样的) 
 int bitmapWidth = datas.get(0).getWidth(); 
 //图纸高度 = WebView内容的高度 
 int bitmapHeight = contentHeight; 
 //1:创建图纸 
 Bitmap bimap = Bitmap.createBitmap(bitmapWidth, bitmapHeight, Bitmap.Config.RGB_565); 
 //2:创建画布,并绑定图纸 
 Canvas canvas = new Canvas(bimap); 
 //3:创建画笔 
 Paint paint = new Paint(); 
 for (int count = datas.size(), i = 0; i < count; i++) { 
  Bitmap data = datas.get(i); 
  float left = 0; 
  float top = i * data.getHeight(); 
  Rect src = null; 
  RectF des = null; 
  /** 
  * Rect src = new Rect(); 代表图片矩形范围 
  * RectF des = new RectF(); 代表Canvas的矩形范围(显示位置) 
  */ 
  if (i == count - 1 && surplusScrollHeight > 0) { 
  int srcRectTop = data.getHeight() - surplusScrollHeight; 
  src = new Rect(0, srcRectTop, data.getWidth(), data.getHeight()); 
  des = new RectF(left, top, data.getWidth(), top + surplusScrollHeight); 
  } else { 
  src = new Rect(0, 0, data.getWidth(), data.getHeight()); 
  des = new RectF(left, top, data.getWidth(), top + data.getHeight()); 
  } 
  //绘制图片 
  canvas.drawBitmap(data, src, des, paint); 
 } 
 return bimap; 
} 

关于canvas.drawBitmap()两个Rect的个人的理解:

src: 代表你要显示图片的大小,是全部显示,还是只是显示一半

        

 以图片作为例子:

 new Rect(0,0,bitmap.getWidth()/2,bitmap.getHeight())  显示图片宽度一半大小

     

new Rect(0,0,bitmap.getWidth()/2,bitmap.getHeight()/2) 显示1/4的图片大小

         

des: 代表你要将src的图片放在哪个位置显示, 显示在左边,右边,还是居中显示     

 

以图为例(图纸代表为Canvas,图片代表为Bitmap):

new Rect(0,0,bitmap.getWidth(),bitmap.getHeight()) 左上角显示

new Rect(0,图纸高度/2,bitmap.getWidth(),bitmap.getHeight()) 居中显示

5.保存

保存到本地,可以通过 bimap.compress()方法

Demo演示:

     

Github地址:  ScreenshotExample  不足之处:

WebView内容不宜太长,否则图片太多,合并起来,会有内存溢出危险

WebView里的html不是有悬浮的标签,否则每次截图都会把标签的内容截取进去

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • Android实现文件的分割和组装

    Android实现文件的分割和组装

    这篇文章主要介绍了Android实现文件的分割和组装,针对UDP大数据包的分割传输与组装有着非常实用的价值,需要的朋友可以参考下
    2014-09-09
  • Android悬浮按钮点击返回顶部FloatingActionButton

    Android悬浮按钮点击返回顶部FloatingActionButton

    这篇文章主要为大家详细介绍了Android悬浮按钮FloatingActionButton点击回到顶部的实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-02-02
  • android真机调试时无法显示logcat信息的解决方法介绍

    android真机调试时无法显示logcat信息的解决方法介绍

    以下是对android真机调试时无法显示logcat信息的解决方法进行了详细的分析介绍,需要的朋友可以过来参考下
    2013-07-07
  • Framework源码面试之activity启动流程

    Framework源码面试之activity启动流程

    这篇文章主要为大家介绍了Framework源码面试之activity启动流程实例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-09-09
  • Android开发设置RadioButton点击效果的方法

    Android开发设置RadioButton点击效果的方法

    这篇文章主要介绍了Android开发设置RadioButton点击效果的方法,详细分析了Android开发中RadioButton属性功能及相关设置技巧,需要的朋友可以参考下
    2017-06-06
  • Android实现360手机助手底部的动画菜单

    Android实现360手机助手底部的动画菜单

    这篇文章给大家分享了利用Android实现360手机助手底部的动画菜单效果,文中给出了实例代码,这样对大家的学习或者理解更有帮助,有需要的朋友们下面来一起看看吧。
    2016-10-10
  • Android中使用Expandablelistview实现微信通讯录界面

    Android中使用Expandablelistview实现微信通讯录界面

    本文主要介绍了Android中使用Expandablelistview实现微信通讯录界面(完善防微信APP)的方法,具有一定的参考价值,下面跟着小编一起来看下吧
    2016-12-12
  • http请求绕过Filter的实现实例

    http请求绕过Filter的实现实例

    这篇文章主要介绍了http请求绕过Filter的实现实例的相关资料,需要的朋友可以参考下
    2017-06-06
  • Android开发之自定义UI组件详解

    Android开发之自定义UI组件详解

    这篇文章主要给大家介绍了关于Android开发之自定义UI组件的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-05-05
  • Android省电的秘密之JobScheduler

    Android省电的秘密之JobScheduler

    JobScheduler是Android L版本新引入的API,JobScheduler,顾名思义,是用来调度工作。工作被调度的条件包括网络变化,充电插拔,周期执行等。谷歌为什么要引入这个新的API呢?是为了省电而制定的一种规范。下面跟着小编一起来看下吧
    2017-02-02

最新评论