Cordova - 使用Cordova开发iOS应用实战5（获取手机里照片，并编辑）
|
1
|
cordova plugin add cordova-plugin-camera |
可以看到camera相机插件已经成功添加了：
我们可以选择是从“照片库（时刻）”中读取图片，或者从“相簿”中读取图片。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
|
<!DOCTYPE html><html> <head> <title>Capture Photo</title> <meta http-equiv="Content-type" content="text/html; charset=utf-8"> <script type="text/javascript" charset="utf-8" src="cordova.js"></script> <script type="text/javascript" charset="utf-8"> var pictureSource; var destinationType; document.addEventListener("deviceready",onDeviceReady,false); //Cordova加载完成会触发 function onDeviceReady() { pictureSource=navigator.camera.PictureSourceType; destinationType=navigator.camera.DestinationType; } //获取照片 function getPhoto(source) { //quality : 图像的质量，范围是[0,100] navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50, destinationType: destinationType.FILE_URI, sourceType: source }); } //获取照片成功 function onPhotoURISuccess(imageURI) { //打印出照片路径 console.log(imageURI); var largeImage = document.getElementById('largeImage'); largeImage.style.display = 'block'; largeImage.src = imageURI; } //获取照片是吧 function onFail(message) { alert('获取失败: ' + message); } </script> </head> <body style="padding-top:50px"> <button style="font-size:23px;" onclick="getPhoto(pictureSource.PHOTOLIBRARY);"> 从“相簿”中获取照片 </button> <br> <img style="display:none;" id="largeImage" src="" /> </body></html> |
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
|
<!DOCTYPE html><html> <head> <title>Capture Photo</title> <meta http-equiv="Content-type" content="text/html; charset=utf-8"> <script type="text/javascript" charset="utf-8" src="cordova.js"></script> <script type="text/javascript" charset="utf-8"> var pictureSource; var destinationType; document.addEventListener("deviceready",onDeviceReady,false); //Cordova加载完成会触发 function onDeviceReady() { pictureSource=navigator.camera.PictureSourceType; destinationType=navigator.camera.DestinationType; } //获取照片 function getPhoto(source) { //quality : 图像的质量，范围是[0,100] navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50, destinationType: destinationType.FILE_URI, sourceType: source }); } //获取照片成功 function onPhotoURISuccess(imageURI) { //打印出照片路径 console.log(imageURI); var largeImage = document.getElementById('largeImage'); largeImage.style.display = 'block'; largeImage.src = imageURI; } //获取照片是吧 function onFail(message) { alert('获取失败: ' + message); } </script> </head> <body style="padding-top:50px"> <button style="font-size:23px;" onclick="getPhoto(pictureSource.SAVEDPHOTOALBUM);"> 从“时刻”中获取照片 </button> <br> <img style="display:none;" id="largeImage" src="" /> </body></html> |
原文出自：www.hangge.com 转载请保留原文链接：http://www.hangge.com/blog/cache/detail_1148.html
Cordova - 使用Cordova开发iOS应用实战5（获取手机里照片，并编辑）的更多相关文章
- Cordova - 使用Cordova开发iOS应用实战3（添加Cordova控制台插件）
Cordova - 使用Cordova开发iOS应用实战3(添加Cordova控制台插件) 前文介绍了通过 Safari 的 Web检查器,可以看到控制台输出的信息.但有时这样调试代码不太方便,如果在 ...
- Cordova - 使用Cordova开发iOS应用实战2（生命周期、使用Safari调试）
Cordova - 使用Cordova开发iOS应用实战2(生命周期.使用Safari调试) 前文我们创建了一个简单的Cordova项目,结构如下: 1,Cordova生命周期事件 (1)device ...
- Cordova - 使用Cordova开发iOS应用实战1（配置、开发第一个应用）
Cordova - 使用Cordova开发iOS应用实战1(配置.开发第一个应用) 现在比较流行使用 html5 开发移动应用,毕竟只要写一套html页面就可以适配各种移动设备,大大节省了跨平台应用的 ...
- Cordova - 使用Cordova开发iOS应用实战4（调用摄像头拍照，并编辑）
使用Cordova可以很方便的通过js代码来使用设备摄像头拍照,只需把camera插件添加进来即可. 一,添加camera插件 首先我们要在“终端”中进入工程所在的目录,然后运行如下命令: 1 cor ...
- Swift开发iOS项目实战视频教程（一）---iOS真简单
本课主要介绍iOS项目的创建.第一个iOS项目的开发.UILabel.UIButton的使用. 假设你看完此视频还认为iOS非常难,请你来找我! 本教程摒弃枯燥的语法和知识解说,全是有趣有料的项目实战 ...
- Swift开发iOS项目实战视频教程（二）---图片与动画
本课主要介绍UIImageview.NSTimer的使用.并介绍了一种动画实现方式. 本教程摒弃枯燥的语法和知识解说.全是有趣有料的项目实战! 视频优酷链接:v.youku.com/v_show/id ...
- vs2013update4 vs-mda-remote cordova真机测试ios
1.升级vs2013到update4 2.下载安装vs_langpack-enu英语语言包 3.下载安装vs2013mda目前版本0.3.1 如果开发andorid,需要android sdk,ant ...
- VS2015 Cordova Ionic移动开发（五）
一.创建侧边菜单和导航项目 1.使用VS创建一个Ionic空项目,同时创建一个Ionic SideMenu和Ionic Tabs项目.将SideMenu和Tabs项目里的templates和js文件合 ...
- VS2015 Cordova Ionic移动开发（四）
一.布局 Ionic模板提供了一个侧边栏菜单示例项目和标签选项卡示例项目.本案例将两个布局进行结合,简单介绍下Ionic的布局.Ionic采用自定义标签和标准Html标签相结合.相对于全部使用div方 ...
随机推荐
- 关于Android四大组件的学习总结
Activity Android应用的用户界面是由Activity类管理的.和其他组件一样,Activity会用一系列生命周期回调函数通知当前的状态. 生命周期 Activity的四种状态 1.运行状 ...
- Java字符串中常见的10个问题
下面是Java中10个最常见的关于字符串的问题. 怎样比较字符串?使用==还是equals() 简单的说,“==”用于判断引用是否相等,equals()用于判断值是否相等.除非你要比较两个字符串是否是 ...
- java中实现定时功能
网上资料: 我们可以使用Timer和TimerTask类在java中实现定时任务,详细说明如下: 1.基础知识java.util.Timer一种线程设施,用于安排以后在后台线程中执行的任务.可安排任务 ...
- C# 和 C++ 数据类型对照表
又要用C#调用C++写好的api函数,为了方便,将网上的数据类型做个整理,方便以后查找,以后遇到需要的在进行查找 C++ C# WORD ushort DWORD ui ...
- spring定时器（一）
使用的是spring的quartz功能,需导入com.springsource.org.quartz.jar包. 此定时器无法重置定时时间,需要的话可查看:spring定时器(二) spring的be ...
- Tomcat源码分析之—组件启动实现分析
Tomcat由多个组件组成,那么Tomcat是怎么对他们的生命周期进行管理的么,这里将从Tomcat源码去分析其生命周期的实现: Bootstrape类为Tomcat的入口,所有的组件够通过实现Lif ...
- 烂泥：mysql修改本地主机连接
本文由秀依林枫提供友情赞助,首发于烂泥行天下. 在mysql数据库安装完毕后,为了能远程连接管理mysql数据库.我们一般是在mysql服务器上通过update命令来更新user表中的host记录的. ...
- Linux 开机自启动脚本详解
以kibana为例 以下为skibana名称的脚本内容 #!/bin/bash #chkconfig: 2345 80 90 #description:kibana kibana=" ...
- Eclipse 无线调试（利用ADB工具）
首先:1.你的手机必髯要有ROOT权限才可以安装ADB工具:2.手机开启WLAN(WIFI): (1)安装ADB工具: (2)添加环境变量PATHA;(我的是ADB路径是:D:\adt-bundle- ...
- eclipse 设置书签标记（标签-Bookmark
在代码的左边灰色区右键单击,有个“Add Bookmark”,点击后输入书签名,会出现一个蓝色的书签标记 在这个书签标记上右键单击,有个“Remove Bookmark”,点击删除标签 菜单:wind ...