javascript原生移动云编程10 - 如何调用相机并上传下载图片视频

来源：互联网发布：淘宝助理上传宝贝慢编辑：程序博客网时间：2024/05/18 03:58

用javascript在码实云平台上，可以在云里编写原生的移动应用。移动应用经常需要用手机拍照或摄像，并且把照片视频上传到云存储里。由于码实平台提供了全面的云服务，多媒体的上传下载就变得非常容易。这个应用实例用到了码实平台的云数据库，因此建议你先熟悉下前面那个如何使用云数据库的教程。

码实平台里，多媒体数据是数据BO的一种字段类型，在数据BO编辑工具里称为“附件”(Attachment)。附件里可以记录多张照片或其他多媒体文件，附件字段本质上是记录了一组多媒体文件在云存储里的存取id数组。本实例包括了两个页面，构成和前面的数据教程完全一样。由于大部分代码相同，这里指讲解新的代码。

页面1的完整代码请到web工具的开源部分查看，其中显示播放照片列表代码如下，关键部分是用码实平台SDK的Mash5.UI.createAttachmentView显示附件。

 // Render单条数据UIcreateRow : function (feed) {        var context = this.getContext();var row = Ti.UI.createTableViewRow({width : '100%',height : Ti.UI.SIZE,selectionStyle : 0,});var view = Ti.UI.createView({width : Ti.UI.FILL,height : Ti.UI.SIZE,top : '10dip',left : '10dip',right : '10dip',backgroundColor : '#629138',borderRadius : dipToPx(10),layout: 'vertical'});row.add(view);// 显示附件字段，BO的第二个字段var attachments = (feed.bo.Fields[1].Value && feed.bo.Fields[1].Value instanceof Array) ?

if (attachments.length > 0) {            // 调用SDK中的方法Mash5.UI.createAttachmentView, 点击可下载图片var attachmentView = Mash5.UI.createAttachmentView(context, {attachments : attachments,width : Ti.UI.SIZE,isEditable : false,});attachmentView.getView().left = '3dip';attachmentView.getView().bottom = '5dip';            view.add(attachmentView.getView());}        // 再显示第一个字段，做为图片的说明view.add(Ti.UI.createLabel({bottom : '5dip',color : '#fff',text : feed.bo.Fields[0].Value,left : '10dip',font : {fontSize : '16dip'},}));return row;}

页面2的完整代码请到web工具的开源部分查看，这个页面也是和云数据操作的那个教程雷同。其中引入了相机上传照片的操作，分别定义在如下的两个函数里。Mash5.Tenant.File.uploadFromCamera提供了调用相机拍照并且上传照片的完整功能。而在createParameters里面，我们使用的码实平台SDK提供的Mash5.UI.createProgressDialog来显示标配的照片上传进度条。

startCamera: function(attachView) {        var parameters = this.createParameters(attachView);        Mash5.Tenant.File.uploadFromCamera({            context: this.getContext(),            onprogresschanged: parameters.onprogresschanged,            setCancelListener: parameters.setCancelListener        }, parameters.onload);    },createParameters: function(attachView) {        var progressDialog = Mash5.UI.createProgressDialog();        progressDialog.setProgress(0, '正在上传...');        return {            onprogresschanged: function(progress) {                progressDialog.show();                progressDialog.setProgress(progress, '正在上传...');            }.bind(this),            setCancelListener: function(listener) {                progressDialog.setCancelListener(listener);            },            onload: function(r) {                progressDialog.hide();                setTimeout(function() {                    progressDialog.hide();                }, 600);                if (r.success) {                    var attachment = r.fileInfo;                    if (attachView && attachment) {attachView.clear();attachView.addAttachment(attachment);}                } else {                    alert(r.message);                }            }.bind(this)        };    },

0 0