<!DOCTYPE html>
<html>
<head>
<title>Camera 插件</title>
<script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
<script type="text/javascript" charset="utf-8">
var pictureSource;//图片来源
var destinationType;//设置返回值的格式
//等待Phonegap链接设备
document.addEventListener("deviceready",onDeviceReady,false);
//Phonegap准备就绪,能够使用!
function onDeviceReady() {
pictureSource=navigator.camera.PictureSourceType;
destinationType=navigator.camera.DestinationType;
}
//当成功得到一张照片的Base64编码数据后被调用
function onPhotoDataSuccess(imageData) {
//取消注释以查看Base64编码的图像数据
//console.log(imageData);
//获取图像句柄
var smallImage = document.getElementById('smallImage');
//取消隐藏的图像元素
smallImage.style.display = 'block';
//显示拍摄的照片
//使用内嵌CSS规则来缩放图片
smallImage.src = "data:image/jpeg;base64," + imageData;
}
//当成功获得一张照片的URI后被调用
function onPhotoURISuccess(imageURI) {
//取消注释以查看图片文件的URI
//console.log(imageURI);
//获取图片句柄
var largeImage = document.getElementById('largeImage');
//取消隐藏的图像元素
largeImage.style.display = 'block';
//显示拍摄的照片
//使用内嵌CSS规则来缩放图片
largeImage.src = imageURI;
}
//“Capture Photo”按钮点击事件触发函数
function capturePhoto(){
//使用设备上的摄像头拍照,并得到Base64编码字符串格式的图像
navigator.camera.getPicture(onPhotoDataSuccess, onFail, {quality: 50 });
}
//“Capture Editable Photo”按钮点击事件触发函数
function capturePhotoEdit() {
//使用设备上的摄像头拍照,并得到Base64编码字符串格式的可编辑图像
navigator.camera.getPicture(onPhotoDataSuccess,onFail,{quality:20,allowEdit: true});
}
//“From Photo Library”/“From Photo Album”按钮点击事件触发函数
function getPhoto(source) {
//从设定的来源处获取图像文件URI
navigator.camera.getPicture(onPhotoURISuccess, onFail,{quality: 50,
destinationType: destinationType.FILE_URI,sourceType: source });
}
//当有错误发生时触发此函数
function onFail(mesage) {
alert('Failed because: ' + message);
}
</script>
</head>
<body>
<button onclick="capturePhoto();">Capture Photo</button> <br>
<button onclick="capturePhotoEdit();">Capture Editable Photo</button> <br>
<button onclick="getPhoto(pictureSource.PHOTOLIBRARY);">From Photo Library</button><br>
<button onclick="getPhoto(pictureSource.SAVEDPHOTOALBUM);">From Photo Album</button><br>
<img style="display:none;width:60px;height:60px;" id="smallImage" src="" />
<img style="display:none;" id="largeImage" src="" />
</body>
</html>
KeyMob致力于广告主和开发者均可以经过简单的操做轻松实现对多家广告平台的搭配使用。并能辅助开发者过市场审核,服务也很好。优势小而精,专作广告服务,对各个广告平台进行精选,集成方便快捷。
javascript