mui-app开发05：调用相机功能

关于相机调用的API文档参见HTML5+ API Reference (html5plus.org)中的camera模板，本文设计的所有API的接口帮助文档均参见上述连接，这里只介绍API的应用，接口的帮助请查看具体帮助手册。

目录

1 配置相机权限

 2. 编写拍照代码

2.1 获取相机并拍照

2.2 在真机上找到图片

3. 拍照问题处理

---

1 配置相机权限

 2. 编写拍照代码

2.1 获取相机并拍照

在mui.plusReady()函数中，添加如下代码：

                // 拍照
				var paizhaoNode = document.getElementById('GalleryPaiZhao');
				paizhaoNode.addEventListener('tap', function(){
					
					// 如果不指定参数，则默认使用主摄像头
					// https://www.html5plus.org/doc/zh_cn/camera.html
					var cmr = plus.camera.getCamera();
					var fmt = cmr.supportedImageFormats[0];
					var res = cmr.supportedImageResolutions[0];
					console.log('分辨率：'+res);
					
					cmr.captureImage(
						function(rs){
							var path = "file://"+plus.io.convertLocalFileSystemURL(eval(JSON.stringify(rs)));
							// mui.toast('图片路径：'+path,{ duration:'long', type:'div' }); 
							mui.confirm('图片路径：'+path);						
						},
						function(e){
							
							alert(e.message+'拍照失败');
						},
						{resolution:res, format:fmt}
					);
				});

效果展示：

2.2 在真机上找到图片

在真机测试时，弹出的路径为：

以红米note9Pro为例，寻找该路径的方法为：

忽略file:///storage/emulated/0；然后按照剩余路径提示的目录，即可找到拍摄的图片。

3. 拍照问题处理

在测试的时候，出现了以下错误：

 

主要原因是：相机权限是独占权限，只能为一个应用所使用；如果摄像头已井被其他应用打开，将会报上面的错误。