选择视频或图片,只需要一个 UIMediaScanner 模板就可以实现,点击链接查看api

https://docs.apicloud.com/Client-API/UI-Layout/UIMediaScanner

textareaClick: [{
   text: '',
   img: [],
   realImg: [],
   realVideo: [],
   video: []
}],

        
        var app = new Vue({
el: "#app",
data: function() {
return {
textareaClick: [{
text: '',
img: [],
realImg: [],
realVideo: [],
video: []
}],
token: ''
}
},
methods: {
          upload_image: function(index) {
            //选择图片与视频
var this_obj = this;
var UIMediaScanner = api.require('UIMediaScanner');
UIMediaScanner.open({
type: 'all', //视频与图片,all(图片和视频)picture(图片)video(视频)
column: ,
classify: true,
max: ,
sort: {
key: 'time',
order: 'desc'
},
texts: {
stateText: '已选择*项',
cancelText: '取消',
finishText: '完成'
},
styles: {
bg: '#fff',
mark: {
icon: '',
position: 'bottom_left',
size:
},
nav: {
bg: '#eee',
stateColor: '#000',
stateSize: ,
cancelBg: 'rgba(0,0,0,0)',
cancelColor: '#000',
cancelSize: ,
finishBg: 'rgba(0,0,0,0)',
finishColor: '#000',
finishSize:
}
},
scrollToBottom: {
intervalTime: -
},
exchange: true,
rotation: true
}, function(ret) {
if (ret) {
if (ret.eventType == 'confirm') {
this_obj.compress_img(ret.list, index);
}
}
});
},
compress_img: function(img_arr, arr_index) {
            //压缩图片
var UIMediaScanner = api.require('UIMediaScanner');
var imageFilter = api.require("imageFilter");
var temp_path1 = img_arr.shift();
temp_path = temp_path1.path;
var filename = Math.random() + '.jpg';
var this_obj = this;
var target_w = ;
var type_play = temp_path1.suffix
if (api.systemType == "ios") {
UIMediaScanner.transPath({
path: temp_path
}, function(res, err) {
if (res.status) {
if (type_play == 'mp4') {
this_obj.textareaClick[arr_index].video.push(res.path);
} else {
imageFilter.getAttr({
path: res.path
}, function(ret, err) {
if (ret.status) {
if (ret.width < target_w) {
target_w = ret.width;
}
var original_w = ret.width;
var original_h = ret.height;
var scale = original_w / target_w;
var target_h = Math.round(original_h / scale);
imageFilter.compress({
img: res.path,
quality: ,
size: {
w: target_w,
h: target_h
},
save: {
album: false,
imgPath: api.cacheDir + '/upload/',
imgName: filename
}
}, function(ret, err) {
if (ret.status) {
this_obj.textareaClick[arr_index].img.push(api.cacheDir + '/upload/' + filename);
if (img_arr.length > ) {
this_obj.compress_img(img_arr, arr_index);
}
}
});
}
});
}
} else {
api.toast({
msg: err
});
}
})
} else {
if (type_play == 'mp4') {
this_obj.textareaClick[arr_index].video.push(temp_path);
} else {
imageFilter.getAttr({
path: temp_path
}, function(ret, err) {
if (ret.status) {
if (ret.width < target_w) {
target_w = ret.width;
}
var original_w = ret.width;
var original_h = ret.height;
var scale = original_w / target_w;
var target_h = Math.round(original_h / scale);
imageFilter.compress({
img: temp_path,
quality: ,
size: {
w: target_w,
h: target_h
},
save: {
album: false,
imgPath: api.cacheDir + '/upload/',
imgName: filename
}
}, function(ret, err) {
if (ret.status) {
this_obj.textareaClick[arr_index].img.push(api.cacheDir + '/upload/' + filename);
if (img_arr.length > ) {
this_obj.compress_img(img_arr, arr_index);
}
}
});
}
});
}
}
} }
})

 

console.log(this_obj.textareaClick)可以查看这个数组

apiCloud 选择图片,选择视频,压缩图片的更多相关文章

  1. thinphp5-image图片处理类库压缩图片

    使用tp5的thinkphp-image类库处理图片 使用方法手册都有,为了增加印象我自己记录一下 手册:https://www.kancloud.cn/manual/thinkphp5/177530 ...

  2. 前端预览图片和H5canvas压缩图片上传

    思路是将图片抽样显示在canvas上,然后用通过canvas.toDataURL方法得到base64字符串来实现压缩. 1.base64转二进制文件 /** * dataURL to blob, re ...

  3. 前端压缩图片,前端压缩图片后转换为base64.

    今天利用一上午研究了一下前端如何将5m左右的照片转换base64大小为 100k以内! 有两个链接:https://www.cnblogs.com/007sx/p/7583202.html :http ...

  4. iOS 使用AFN 进行单图和多图上传 摄像头/相册获取图片,压缩图片

    图片上传时必要将图片进行压缩,不然会上传失败 首先是同系统相册选择图片和视频.iOS系统自带有UIImagePickerController,可以选择或拍摄图片视频,但是最大的问题是只支持单选,由于项 ...

  5. EmguCV学习——视频与图片互转

    其实视频转图片在上篇文章中已经有些眉目了,其实就是按帧读取视频,然后把帧保存就ok.然后自己再加个进度条美化一下...这代码简单易懂,还是直接上代码吧. 视频转图片 /// <summary&g ...

  6. C# Winform版批量压缩图片程序

    需求 上周,领导给我分配了一个需求:服务器上的图片文件非常大,每天要用掉两个G的大小的空间,要做一个自动压缩图片的工具处理这些大图片.领导的思路是这样的: 1)打开一个图片,看它的属性里面象素是多少, ...

  7. IOS 视频分解图片、图片合成视频

    在IOS视频处理中,视频分解图片和图片合成视频是IOS视频处理中经常遇到的问题,这篇博客就这两个部分对IOS视频图像的相互转换做一下分析. (1)视频分解图片 这里视频分解图片使用的是AVAssetI ...

  8. 【转】android如何浏览并选择图片 音频 视频

    转自:http://www.cnblogs.com/top5/archive/2012/03/06/2381986.html   这几天 在学习并开发android系统的图片浏览 音频 视频 的浏览 ...

  9. python使用zlib库压缩图片,使用ffmpeg压缩视频

    python压缩图片.视频 图片压缩使用zlib库 视频压缩使用工具ffmpeg # ffmpeg -i 1.mp4 -r 10 -pix_fmt yuv420p -vcodec libx264 -p ...

随机推荐

  1. 碎碎念android eMMC【转】

    本文转载自:https://blog.csdn.net/Fybon/article/details/44242549 一./dev/blockroot@:/dev/block #ls bootdevi ...

  2. Pig项目&Spring Boot&Spring Cloud学习

    1.Spring条件加载原理(@Conditional,@ConditionalOnXXX注解) https://fangjian0423.github.io/2017/05/16/springboo ...

  3. Shell 基础知识和总结

    调试脚本 检查脚本语法错误 bash -n /path/to/some_script 调试执行 bash -x /path/to/some_script shell里的变量 本地变量:只对当前shel ...

  4. R语言 apply,sapply,lapply,tapply,vapply, mapply的用法

    apply() apply(m,dimcode,f,fargs) m 是一个矩阵. dimcode是维度编号,取1则为对行应用函数,取2则为对列运用函数. f是函数 fargs是f的可选参数集 > ...

  5. (转) GAN论文整理

    本文转自:http://www.jianshu.com/p/2acb804dd811 GAN论文整理 作者 FinlayLiu 已关注 2016.11.09 13:21 字数 1551 阅读 1263 ...

  6. ORM之EF

    本文大部分内容截取自博客:  http://www.cnblogs.com/VolcanoCloud/p/4475119.html (一) 为什么用ORM 处理关系数据库时,我们依据由行和列组成的表, ...

  7. postgreSql——时区问题

    timestamptz.timestamp SELECT ts AT TIME ZONE 'UTC' FROM ( VALUES (timestamptz '2012-03-05 17:00:00+0 ...

  8. 转载]SAP囚徒 - 通过销售订单领用到成本中心,FI替代

    转载]SAP囚徒 - 通过销售订单领用到成本中心,FI替代   原文地址:SAP囚徒 - 通过销售订单领用到成本中心,FI替代实现不同成本中心记账科目不同作者:SAP囚徒 物品领用通常是库存管理的范畴 ...

  9. 51nod 1020 逆序排列

    http://www.51nod.com/onlineJudge/questionCode.html#!problemId=1020 题意: 思路: 一开始用了三重循环... 设f(n,k)表示n个数 ...

  10. maven springMVC SSM框架中 出现的406 (Not Acceptable)

    首先,需要清楚,http state 406代表什么意思: 406是HTTP协议状态码的一种,表示无法使用请求的特性来响应请求的网页.一般指客户端浏览器不接受所请求页面的MIME类型. 出现这样的错误 ...