Visual Studio开发Cordova应用示例
作者：Grey
原文地址：http://www.cnblogs.com/greyzeng/p/5455728.html
本文的GIF动画均使用ScreenToGif进行录制。
Cordova是什么？
http://cordova.apache.org/docs/en/latest/guide/overview/index.html
实例说明
- HelloWorld
- 拍照
开发环境
- Visual Studio Community 2015
- Java SE Development Kit 8u91
- Android SDK
- Visual Studio Emulator for Android (微软的Android模拟器，良好的Visual Studio支持，非必需，可以用真机代替)
HelloWorld
在Visual Studio Community 2015中，选择：文件–>新建–>项目–>模板–>JavaScript–>Apache Cordova Apps–>空白应用(Apache Cordova)–>名称命名为：HelloCordova–>确定
运行程序(Android)：
打开Visual Studio Emulator for Android
选择一个Android模拟器，如：VS Emulator 5" KitKat(4.4) XXHDPI Phone
启动这个模拟器, 然后点击运行：
运行结果
运行程序(Windows Phone)
Windows Phone：选择Windows Phone(Universal), 选择一个模拟器，如：Mobile Emulator 10.0.10586.0 WVGA 4 inch 1GB, 点击运行：
运行结果
拍照
拍照功能需要额外下载插件，Visual Studio Community 2015提供了非常方便的插件下载安装机制, 在HelloCordova这个项目中，点击
config.xml这个文件，
选择：插件–>核心–>Camera–>并点击添加按钮，即可把插件加到当前项目中。
代码清单
/HelloCordova/www/index.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
<link rel="stylesheet" type="text/css" href="css/index.css">
<title>HelloCordova</title>
</head>
<body>
<div>
<h1 style="color:white">Take Photo</h1>
</div>
<div>
<input id="btnTakePhoto" type="button" value="Take Photo" />
</div>
<div id="divPic"></div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="scripts/platformOverrides.js"></script>
<script type="text/javascript" src="scripts/index.js"></script>
</body>
</html>
/HelloCordova/www/scripts/index.js
(function () {
"use strict";
document.addEventListener( 'deviceready', onDeviceReady.bind( this ), false );
function onDeviceReady() {
document.addEventListener( 'pause', onPause.bind( this ), false );
document.addEventListener( 'resume', onResume.bind( this ), false );
document.getElementById('btnTakePhoto').onclick = function () {
navigator.camera.getPicture(function (imageURI) {
var pic = document.getElementById('divPic');
pic.innerHTML = "<img src= '" + imageURI + "'/>";
}, null, null);
};
};
function onPause() {
// TODO:
};
function onResume() {
// TODO:
};
} )();
运行结果（Android）：
运行结果（Windows Phone）：
Visual Studio开发Cordova应用示例的更多相关文章
- SharePoint 2013 工作流之Visual Studio开发示例篇
SharePoint 2013引用了WF4.0 Foundation,支持使用Designer和Visio进行设计,但是功能受限,而Visual Studio可以开发功能更加丰富的工作流,下面我们简单 ...
- 微软为Visual Studio开发助手拓展C++支持
近日,微软宣布了一项 Visual Studio“开发助手”(Developer Assistant)插件的重大更新,其现已支持“基于 C++ 的情境感知 web 解决方案”.开发助手能够嵌入 Vis ...
- visual studio 开发linux程序
VisualGDB支持Linux的原理是,通过ssh连接到Linux系统上通过ssh给linux下达命令 . (类似visualgdb的有windgb ,这2个都是商业软件.) Visual GDB ...
- 解决无法连接到visual studio开发服务器的问题
今天vs抽风,调试网站出现下图那样: 然后我开始百度搜索 "无法连接到visual studio开发服务器" 出现很多文章: 打开一篇问题,看了里面的内容, 那个解决办法也不是最好 ...
- Visual Studio 开发（二）：VS 2017配置FFmpeg开发环境
在上篇文章Visual Studio 开发(一):安装配置Visual Studio Code 中,我们讲了一下如何配置VS CODE,来编写和调试C的代码.如果你已经使用VS Code回顾和复习好C ...
- visual studio开发工具的C#主流控件属性一览表
visual studio开发工具的C#主流控件属性一览表 详细的介绍了各控制属性的详细中文介绍 C#控件及常用设计整理 1.窗体 1.常用属性 (1)Name属性:用来获取或设置窗体的名称,在应用程 ...
- 使用Visual Studio开发跨平台的iOS应用程序
[原文发表地址]Developing cross-platform iOS application using Visual Studio [原文发表时间]2015/6/4 C ++是一种流行的高级编 ...
- 使用Visual Studio开发Python
Python优秀的集成开发环境有PyCharm,Visual Studio Code等,当然你仍然可以使用Visual Studio进行开发.如果你熟悉Visual Studio,使用Visual S ...
- Visual Studio开发首选！DevExtreme v19.1.6全新来袭
DevExtreme Complete Subscription是性能最优的 HTML5,CSS 和 JavaScript 移动.Web开发框架,可以直接在Visual Studio集成开发环境,构建 ...
随机推荐
- DataTable汇总
一.排序 1 获取DataTable的默认视图 2 对视图设置排序表达式 3 用排序后的视图导出的新DataTable替换就DataTable (Asc升序可省略,多列排序用"," ...
- 【CefSharp】 禁用右键菜单 与 控制弹出窗口的方式(限版本39.0.0.1)
这周没什么时间,一开始就在忙一些CefSharp的事情,Win10的研究就放了下来,CefSharp的资料挺少的,但好在是开源的,可以我们便宜的折腾.因为两个的内容都不多,我就合成一篇文章啦. 这还里 ...
- 公共代码参考（Volley）
Volley 是google提供的一个网络库,相对于自己写httpclient确实方便很多,本文参考部分网上例子整理如下,以作备忘: 定义一个缓存类: public class BitmapCache ...
- Java IO5：字符流
字符流 字节流提供了处理任何类型输入/输出操作的功能(因为对于计算机而言,一切都是0和1,只需把数据以字节形式表示就够了),但它们不可以直接操作Unicode字符,因为上一篇文章写了,一个Unicod ...
- Ubuntu Desktop基本办公环境搭建
Ubuntu Desktop基本办公环境搭建 一如前面所强调的, linux系统是面向开发人员友好的,而对office办公人员并不友好 . 如果是重度的office办公需求人员,不建议使用linux ...
- js DOM优化相关探索
我在这尝试两个方面:-->DOM与js -->DOM与浏览器 (最近在秒味视频上学到不少,哈哈哈) 一.DOM与js 1.js与dom的交互问题 频繁的与dom交互,是一件浪费时间与金钱的 ...
- [备忘]删除SQL Server中无登录名的用户
这个问题通常会在还原虚拟主机的备份SQL文件后发生,原先在虚拟主机上的用户会被还原到本地,但是本地没有权限对其进行操作. SELECT N'ALTER AUTHORIZATION ON SCHEMA: ...
- How to install java and eclipse on linux
First of all, download from the website of java. I download 'jdk-8u102-linux-i586.tar.gz' unzip it t ...
- MVVM架构~knockoutjs系列之验证信息自定义输出~续
返回目录 上一讲中,我以一个实际中的例子说明了knockoutjs的自定义验证功能,在使用过程中,出现了一个问题,当然了不是问题,只是一种需求,上一讲中自定义验证的表现是:当页面加载后,自动显示有问题 ...
- Redis 监控
redis 监控有 redis-live 和 redis-stat Redis-Live是一个用来监控redis实例,分析查询语句并且有web界面的监控工具,使用python编写. redis-sta ...