html5+实现plus.io进行拍照和图片等获取

ID:16206 / 打印

html5+官网地址

使用Hbuilder开发工具开发:实现可对Android机进行控制和获取资源
说明:IO模块管理本地文件系统,用于对文件系统的目录浏览、文件的读取、文件的写入等操作。通过plus.io可获取文件系统管理对象

获取目录:常量:

  • 应用私有资源目录,对应常量plus.io.PRIVATE_WWW,仅应用自身可读
  • 应用私有文档目录,对应常量plus.io.PRIVATE_DOC,仅应用自身可读写
  • 应用公共文档目录,对应常量plus.io.PUBLIC_DOCUMENTS,多应用时都可读写,常用于保存应用间共享文件
  • 应用公共下载目录,对应常量plus.io.PUBLIC_DOWNLOADS,多应用时都可读写,常用于保存下载文件

以下有四个demo

 <button @click.stop="videoCapture" class="delBtn">录像</button>  <button @click.stop="captureImage" class="delBtn">拍照</button>  <button @click.stop="getImage" class="delBtn">获取图片</button>  <button @click.stop="getImageUrl" class="delBtn">获取图片目录</button> 
 //打开摄像头进行录像 videoCapture(){                     this.cmr = plus.camera.getCamera();                     var res = this.cmr.supportedVideoResolutions[0];                     var fmt = this.cmr.supportedVideoFormats[0];                     console.log("Resolution: "+res+", Format: "+fmt);                     this.cmr.startVideoCapture( function( path ){                             alert( "Capture video success: " + path );                           },                         function( error ) {                             alert( "Capture video failed: " + error.message );                         },                         {resolution:res,format:fmt}                     );                     // 拍摄10s后自动完成                      setTimeout( this.stopCapture, 10000 );             }, 
 //停止摄像头录像             stopCapture(){                 console.log("stopCapture");                 this.cmr.stopVideoCapture()   //设备现在不支持,需要手动调用关闭摄像头             }, 
 //打开摄像头进行拍照             captureImage(){                 var cmr = plus.camera.getCamera();                     var res = cmr.supportedImageResolutions[0];                     var fmt = cmr.supportedImageFormats[0];                     console.log("Resolution: "+res+", Format: "+fmt);                     cmr.captureImage( function( path ){                         //path   拍照成功获取到路径                             console.log(path)                         },                         function( error ) {   //取消拍照的函数                             console.log(error)                         },                         {resolution:res,format:fmt}                     )             }, 
 //根据路径获取图片参数             getImage(){                                   plus.io.getImageInfo({                      src: "/storage/emulated/0/Android/data/io.dcloud.HBuilder/apps/HBuilder/doc/1652421993337.jpg",                      success: function(data){                           console.log(JSON.stringify(data));                       },                       fail: function(err){                           console.log(JSON.stringify(err));                       }                  })             }, 
 //获取根目录找到图片             getImageUrl(){                 console.log(this)                 let that = this                 console.log(that)                  // 应用私有文档目录常量                 plus.io.requestFileSystem( plus.io.PRIVATE_DOC , function(fs){                         // fs.root是根目录操作对象DirectoryEntry                         // 创建读取目录信息对象                          var directoryReader = fs.root.createReader();                         console.log(directoryReader)                         directoryReader.readEntries( function( entries ){                             console.log( entries.length)                             var reg = /.(png|jpg|gif|jpeg|webp)$/;                             entries.forEach( item =>{                                 console.log(item.name)                                 if(reg.test(item.name)) {                                     console.log(item.name)                                     console.log(that.imageList)                                     let name = '/storage/emulated/0/Android/data/io.dcloud.HBuilder/apps/HBuilder/doc/'+item.name                                     that.imageList.push(name)                                     console.log(that.imageList)                                 }                             })                             console.log(that.imageList)                         }, function ( e ) {                             alert( "Read entries failed: " + e.message );                         } );                     } );             } 
上一篇: 短视频滑动播放在 H5 下的实现方式
下一篇: HTML5之高度塌陷问题的解决

作者:admin @ 24资源网   2024-11-01

本站所有软件、源码、文章均有网友提供,如有侵权联系308410122@qq.com

与本文相关文章

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。