zoukankan      html  css  js  c++  java
  • H5+app点击图片保存到相册

     

    2019.09.25 17:53:29字数 573阅读 2,647

    业务场景: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

  • 相关阅读:
    删除了原有的offset之后再次启动会报错park Streaming from Kafka has error numRecords must not ...
    sparkStreaming消费kafka-1.0.1方式:direct方式(存储offset到Hbase)
    sparkStreaming消费kafka-1.0.1方式:direct方式(存储offset到zookeeper)
    进程的管理(五)-进程的实现
    进程管理(四)-进程的状态以及转换
    进程管理(三)-进程的层次
    numpy库的认识以及数组的创建
    进程管理(二)-进程的终止
    进程管理(一)-进程的概念以及进程的创建
    python爬取b站排行榜
  • 原文地址:https://www.cnblogs.com/bamboopanders/p/13495215.html
Copyright © 2011-2022 走看看