1***@163.com
1***@163.com
  • 发布:2020-02-13 17:37
  • 更新:2021-01-24 14:47
  • 阅读:4329

uniapp开发app,实现存长图的功能

分类:uni-app

关于在uniapp中保存长图的功能

现碰到一个需求是在点击某个按钮后将页面中的某个元素(宽度100%,高度超过一个屏幕)以保存图片的形式存放到相册中,

在uniapp官方提供的api中只有用webview,通过Bitmap格式转换能将数据存为图片并放到相册中,

这个api有个问题是只能截取当前可视区域进行保存,对区域外无能为力,

另外一种方式是通过html2canvas的方式,将dom元素转为canvas后再次转为Bitmap格式,

在实际操作中发现,一是引入html2canvas时编译到手机上整个应用无法运行,报错信息为window属性为空置,

二是在app中无法操作dom,只能通过uni.createSelectorQuery的方式获取节点信息,这种是无法使用html2canvas的,

所以想问有其他的方式实现长截图保存图片的方式吗

2020-02-13 17:37 负责人:无 分享
已邀请:
DCloud_heavensoft

DCloud_heavensoft

  1. 最简单的,是自己把内容再给canvas上绘制一次。

  2. 找下有没有人做了html2canvas的小程序改造,或者看看微信小程序下有什么截长图方案,在app端通用。

  3. app下html2canvas也是能用的,可以用render.js把这个库放到渲染层操作,https://uniapp.dcloud.io/frame?id=renderjs

  • 1***@163.com (作者)

    非常感谢,我去试试,这个问题困扰了好长时间

    2020-02-17 09:23

  • 3***@qq.com

    回复 1***@163.com: 你好呀,请问你解决了这个问题了吗,有的话可以分享一下经验吗

    2020-03-18 11:49

  • 2***@qq.com

    回复 1***@163.com: 请问下您的问题解决了吗?可以分享一下经验吗

    2020-03-30 11:22

  • 1***@163.com (作者)

    回复 2***@qq.com: 通过canvas重绘是可以的,不过这种方式没有使用,使用html2canvas需要使用v3编译器才能够使用这种功能,不过会和未使用v3编译的版本有些微的出入,需要做兼容。后来这个项目不需要我改进,就没有再考虑这个问题

    2020-03-31 16:53

  • 2***@qq.com

    回复 1***@163.com: 好的,谢谢

    2020-04-03 16:50

  • s***@qq.com

    回复 1***@163.com: 能发个dome看看怎么写的吗?

    2020-07-10 19:13

Q***@163.com

Q***@163.com

解决拉 用html2canvas-renderjs

  • 就是看看

    兄弟,这个插件我放到项目里,不触发他的方法,有demo吗

    2021-06-03 15:42

该问题目前已经被锁定, 无法添加新回复