业务场景:webapp点击图片保存到相册
使用的h5api：
plus.gallery(系统相册)http://www.html5plus.org/doc/zh_cn/gallery.html，plus.nativeObj.Bitmaphttp://www.html5plus.org/doc/zh_cn/nativeobj.html#plus.nativeObj.Bitmap
思路：点击保存到相册要调用保存到相册的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 < e; i++) n += t.charAt(Math.floor(Math.random() * a))
return n
}
export default imageDown
网友评论