业务场景:webapp点击图片保存到相册

思路:点击保存到相册要调用保存到相册的save方法,第一个参数为手机的本地文件路径,这个就有一个问题我们需要将当前的页面的文件先存入手机的系统文件中,经过api的寻找发现nativeObj中的bitmap是可以通过loadBase64Data()将base64转换成原生图片对象,之后使用bitmap.save可以将原生图片对象放入系统文件并且通过成功回调获得文件的地址,之后再调用先gallery的save()保存就好了。

1.imageDown:入口函数(转化的图片base64,成功回调,失败回调)

初始化bitmap对象

2.bigmapTosave:调用保存bitmap的图片到本机系统文件,为之后相册保存提供路径

保存返回bitmap一个地址路径注意:这里使用过的随机一个字符串的作为存的安卓路径名,是因为如果写死同个路径,不用的base64图片对象会覆盖原有的路径,不同机型还没测试,bitmap.save()中的saveOption的overwrite在我测试机上无效。故使用过这个方法

3.imageSaveByGallery:保存到相册,保存成功调用外部的成功的回调,失败调用失败的回调

保存到相册注意:当你保存成功之后要记得使用bitmap.clear()清楚内存,因为原生图像的内存占用较大,文档中有所提示

4.randomString:随机一个字符串

随机一个字符串

完整代码:

const imageDown = function (base64, success, error) {

var bitmap = new window.plus.nativeObj.Bitmap('image')

bitmap.loadBase64Data(base64, function (i) {

bigmapToSave(bitmap, success, error)

}, function (err) {

window.plus.nativeUI(err.message)

})

}

const bigmapToSave = function (bitmap, success, error) {

var name = randomString(10)

bitmap.save(`_doc/${name}.jpg`, { overwrite: false }, function (event) {

console.log(event.target)

imageSaveByGallery(event.target, success, error)

}, function (err) {

window.plus.nativeUI(err.message)

})

}

const imageSaveByGallery = function (url, success, error) {

window.plus.gallery.save(url, function (event) {

const tarbitmap = window.plus.nativeObj.Bitmap.getBitmapById('image')

tarbitmap.clear()

success()

}, function (err) {

window.plus.nativeUI(err.message)

error()

})

}

const randomString = function randomString (e) {

e = e || 32

var t = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678'

var a = t.length

var n = ''

for (var i = 0; i

return n

}

export default imageDown

html5 plus 保存图片,H5+app点击图片保存到相册相关推荐

  1. 微信小程序点击图片保存到相册

    小程序实现点击图片保存到相册 温馨提示:小程序图片在本地保存成功后放到线上失效,应该是没有设置合法的文件下载域名 // 下载事件函数bindImage: function (e) {var url = ...

  2. 怎样用html实现微信九宫格,微信小程序使用canvas实现,图片分割为九宫格,点击图片保存...

    let _this Page({/** * 页面的初始数据*/data: { canvasInWH:'',//imgUrl: '', cutGap: 5, //切割间隔 imgW: 0, imgH:0 ...

  3. 长按UIWebView上的图片保存到相册

    不知道各位对于这个需求要如何解决? 可能有些人会想到js与原生交互,js监听图片点击事件,然后将图片的url传递给原生App端,然后原生App将图片保存到相册,这样子麻烦吗?超麻烦.(1).js监听图 ...

  4. 教你实现微信公众号效果:长按图片保存到相册

    不知道各位对于这个需求要如何解决? 可能有些人会想到js与原生交互,js监听图片点击事件,然后将图片的url传递给原生App端,然后原生App将图片保存到相册,这样子麻烦吗?超麻烦.(1).js监听图 ...

  5. uniapp 图片保存到相册

    传输门 在看官网的时候发现H5是不能图片保存到相册的 首先 html 绑定 @longtap 长按事件 <image :src="qrcodeImg" @longtap=&q ...

  6. 26.Android 下载图片保存到相册

    26.Android 下载图片保存到相册 Android 下载图片保存到相册 前言 实现思路 自定义Dialog 自定义Handler 自定义AsyncTask AndroidManifest配置权限 ...

  7. 微信小程序长按图片保存至相册

    效果图: 描述: 「长按图片」,是否授权保存图片or视频到相册,「授权成功」,点击「保存到相册」即可完成. 代码: wxml <image src="{{imgSrc}}" ...

  8. OpenGLES(八)GPUImage滤镜链与将滤镜修改后的图片保存到相册

    1.滤镜链 在一个复合滤镜中,多种滤镜效果处理时,通常都是图片 -> 设置顶点/纹理坐标 -> 滤镜效果处理 -> 帧缓冲区 -> 新的纹理 -> 滤镜效果处理 -> ...

  9. 小程序权限设置:小程序下载图片保存到相册拒绝权限后,再次打开权限的解决方案

    小程序下载图片保存到相册功能,首次操作会提示:保存图片或视频到你的相册,有'拒绝'和'允许'两个选项,如果选择了拒绝就会保存失败:saveImageToPhotosAlbum:fail auth de ...

  10. React-Native使用CameraRoll将图片保存到相册

    使用CameraRoll将图片保存到相册在ios和android上的实现有一些差别. 首先CameraRoll有一个CameraRoll.saveToCameraRoll(tag, [type]);方 ...

最新文章

  1. 《C++面向对象高效编程(第2版)》——2.30 has-a关系的重要性
  2. Yii2 HOW-TO(3):调试工具yii2-debug和Xdebug(失败)
  3. Python中使用多重继承
  4. Python使用@property方法改变方法为参数
  5. 苹果6可以分屏吗_榨苹果汁可以加蜂蜜水吗?蜂蜜苹果汁的作用
  6. 【UVA - 10020 】Minimal coverage (贪心,区间覆盖问题)
  7. 233网校计算机二级c语言,[233网校]2018年全国计算机二级Office高级应用精讲班_计算机二级视频教程...
  8. onvif学习笔记10:获取RTSP流地址
  9. 一步之遥 c语言答案是多少,蓝桥杯之一步之遥-Go语言中文社区
  10. 2015年全国大学生电子设计竞赛A题(双向DC-DC变换器)训练总结(硬件部分)
  11. html5模板md风格,使用CSS3 制作一个material-design 风格登录界面实例
  12. 冲刺计划sprint
  13. 参考文献中英文人名_参考文献中英文人名的写法
  14. 双色球网页历史数据爬取
  15. Prisma note
  16. 全触控HIFI级音质,击音Super HD II,你喜欢的样子我都有!
  17. 第七章、Groovy面向对象
  18. java中的匿名内部类总结
  19. 国内外几个主流的CMS系统推荐
  20. ng-zorro nz-menu修改样式

热门文章

  1. Squid合并回源技术
  2. ElasticSearch之elasticsearch-users用法及修改集群密码
  3. Unity实现将图片上传到服务器功能
  4. NetLimiter 4.0.15.0 x64 破解新鲜出炉!
  5. Node.js 网页爬虫再进阶,cheerio助力
  6. App自动化测试之企微打卡、快手刷金币
  7. android 橡皮擦 黑色,Android画板,橡皮擦为黑色痕迹的问题
  8. 智慧运维平台之全息监控
  9. 机动车尾气排放智能抓拍解决应用方案
  10. 深度学习【23】图像风格化总结