引言

微软开启新战略--移动为先,云为先.作为开发者,首先感受到的变化就是VS2015预览版增加了对各种跨平台框架的支持,极大方便了我们的开发.其中号称原生性能的Xamarin要收费,挺贵的,一般人还真玩不起来.话说什么时候微软把Xamarin收购然后直接免费,那简直画面太美了.不过可能性极小就是了,毕竟Win10才是微软的宝贝.还好,我们还有Cordova可以玩的,只要你懂Html和JS都可以开发APP了.下面,我就简单说说.

Cordova 命令行

在VS2015之前,做Cordova 开发要配置各种各样的东西,创建项目编译项目都要通过命令行来实现,做起来还是挺麻烦的.网上有比较详细的资料,我就直接放资源了.

跨平台框架Cordova 命令行简介（CLI）里面有详细介绍,按照里面的步骤来,轻松得到一个HelloWord.

Android SDK开发包国内下载地址 如果嫌官方下载慢,可以到这个网站去看看.

Visual Studio Tools for Apache Cordova

安装VS2015要选择跨平台开发的Apache Cordova,估计是我人品不好,在安装了几次都卡死在下载Android SDK中.如果不幸和我一样的,试多几次吧,估计得翻墙.

Visual Studio Tools for Apache Cordova 入门 MSDN文章,内容不算详细,但是更新得勤快,内容比上个月增加了不少.

用VS2015开发安卓APP

首先新建项目,在其他语言的JavaScript中可以找到Apache Cordova项目,然后就可以着手开发APP了.我采用的是Jq Mobile+ASP.NET Web API的方式,先放上资料.

jQuery Mobile 教程 W3C网站的资料,大而全,基本满足需求.

phonegap100   资料丰富的网站,里面有各种教程,继续深造的好地方.

在项目中可以看到Index.html,它就是APP展示页面的全部了,我们的开发也几乎在上面.看代码

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <meta charset="utf-8" />

    <title>我的APP</title>

    <!-- BlankCordovaApp10 引用 -->

    <link href="css/index.css" rel="stylesheet" />

    <!-- Cordova 引用，它在生成应用程序时添加到其中。 -->

    <script src="cordova.js"></script>

    <script src="scripts/platformOverrides.js"></script>

    <script src="scripts/index.js"></script>

    <meta name="format-detection" content="telephone=no" />

    <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->

    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height" />

    <link rel="stylesheet" type="text/css" href="scripts/jqmobile/jquery.mobile-1.4.2.min.css" />

    <script src="scripts/jqmobile/jquery-1.11.1.min.js"></script>

    <script src="scripts/jqmobile/jquery.mobile-1.4.2.min.js"></script>

    <!--<script src="scripts/jqmobile/jquery.rest.min.js"></script>-->

</head>

<body>

    <div data-role="page" id="page">

        <div data-role="header">

            <h1>首页</h1>

        </div>

        <div data-role="content">

            <div>

                <form id="searchform">

                    <div data-role="fieldcontain">

                        <label for="search">请输入部门:</label>

                        <input type="search" name="search" id="search">

                        <input type="button" id="btn" value="查询" />

                    </div>

                </form>

            </div>

            <div data-role="content">

                <ul data-role="listview" id="searchresult"></ul>

            </div>

        </div>

        <div data-role="footer">

            <h4>页脚</h4>

        </div>

    </div>

    <script>

        $("#btn").click(

             function () {

                 var text = $("#search").val();

                 var apiServer = "http://localhost:42368/api/values";

                 //$.mobile.loading('show');

                 var html = '';

                 $.get(apiServer + "?deptname=" + text, null,

                             function (res) {

                                 if (res != null) {

                                     if (res != null && res.length > 0) {

                                         for (var i = 0; i < res.length; i++) {

                                             html = html + '<li>' + res[i] + '</li>';

                                         }

                                     }

                                     $("#searchresult").html(html);

                                     $("#searchresult").listview();

                                     $("#searchresult").listview("refresh");

                                 } 

                             }, "json")

                         .fail(function () {

                         });

             }

            );

    </script>

</body>

</html>

简单起见,上面只定义了一个Page,也只有一个功能,通过输入的部门名获取部门里面的人员并显示在下面.

如何打包成APK,VS2015貌似没有提供地方可以直接打包.但是,我们可以在项目所在目录的platforms\android\cordova找到build.bat,执行之后就可以在platforms\android\ant-build找到生成APK了.如果没有生成APK,那就是因为没有配置环境变量,请参考 跨平台框架Cordova 命令行简介（CLI）配置环境变量.

小结

本文简单演示了一个查询APP的开发.话说,现在流行的是Cordova+Ionic+Angularjs这种组合了,听说是因为Jqmobile被人嫌弃慢.有空还得继续学习学习...

【Cordova】Cordova开发的更多相关文章

  1. [Cordova] Plugin开发架构

    [Cordova] Plugin开发架构 问题情景 开发Cordova Plugin的时候,侦错Native Code是一件让人困扰的事情,因为Cordova所提供的错误讯息并没有那么的完整.常常需要 ...

  2. Visual Studio 2015 和 Apache Cordova 跨平台开发入门(一)

    基于 Windows 10 的 Visual Studio 2015 跨平台的应用开发主要分为基于Visual Studio 安装 Xamarin 扩展的跨Android.iOS 和 Windows的 ...

  3. 高性能Cordova App开发学习笔记

    高性能Cordova App开发学习笔记 文件结构 添加插件 构建准备 各个www的作用,prepare命令会将hello\www的内容会拷贝到platform下的wwww目录,知道该改哪里了吧?如果 ...

  4. [Cordova] Plugin开发入门

    [Cordova] Plugin开发入门 Overview Cordova的设计概念,是在APP上透过Web控件来呈现Web页面,让Web开发人员可以操作熟悉的语言.工具来开发APP.使用Web页面来 ...

  5. Cordova/Ionic开发的Android APP启用Chrome Inspect调试的方法

    Cordova/Ionic开发的Android APP,需要启用WebView的调试模式,才可以在Chrome浏览器中输入chrome://Inspect,然后使用大家熟悉的开发者工具进行调试.不启用 ...

  6. cordova + Vue 开发 APP 上手指南

    什么是 cordova cordova 是由 Apache 基金会支持的,使用 HTML5 + CSS3 + JS 来构建多平台 APP 程序的开发框架.其支持调用手机系统(Android.IOS.W ...

  7. cordova / Ionic 开发问题汇总

    cordova / Ionic 开发问题汇总 1. 导入工程的"The import android cannot be resolved"错误解决方法 2. MainActivi ...

  8. Visual Studio 2015 和 Apache Cordova 跨平台开发入门

    原文:Visual Studio 2015 和 Apache Cordova 跨平台开发入门(一) 基于 Windows 10 的 Visual Studio 2015 跨平台的应用开发主要分为基于V ...

  9. 在 Windows 10 上搭建 Cordova 跨平台开发 Android 环境

    目录 安装 Cordova 安装 Java 和 Android 环境 创建 Cordova 应用程序 构建和运行 Cordova Cordova 简介:Cordova 原名 PhoneGap,是一个开 ...

  10. [转]nodejs之cordova 跨平台开发

    本文转自:https://blog.csdn.net/bubuxindong/article/details/53787392 cordova原名phonegap,虽然adobe收购了phonegap ...

随机推荐

  1. 江卓尔与比特币增发，谣言or先知-千氪

    最近,很多圈内人都在讨论比特币是否应该增发,但等等,比特币真的会增发吗?到底是真有增发计划还是某些人别有用心地在散布谣言? 那么消息是从哪里出来的?北京时间 2 月 10 日晚,莱比特矿池创始人江卓尔 ...

  2. 2.3 使用ARDUINO控制MC20进行GPRS的TCP通讯

    需要准备的硬件 MC20开发板 1个 https://item.taobao.com/item.htm?id=562661881042 GSM/GPRS天线 1根 https://item.taoba ...

  3. docker-compose no such image

    是由于docker-compose旧缓存的问题,执行docker-compose down即可,再重新up

  4. Python编程-模块和包

    一.模块 1.什么是模块? 一个模块就是一个包含了python定义和声明的文件,文件名就是模块名字加上.py的后缀. 2.为何要使用模块? 如果你退出python解释器然后重新进入,那么你之前定义的函 ...

  5. 主攻ASP.NET MVC4.0之重生:ASP.NET MVC Web API

    UserController代码: using GignSoft.Models; using System; using System.Collections.Generic; using Syste ...

  6. tree 命令【转】

    本文转载自:http://www.jb51.net/LINUXjishu/283874.html linux下怎么用tree命令以树形结构显示文件目录结构?tree命令可以以树形结构显示文件目录结构, ...

  7. Java Interface接口

    Java 中接口概念 接口可以理解为一种特殊的 类,由 全局常量 和 公共的抽象方法 所组成. 类是一种具体实现体,而接口定义了某一批类所需要遵循的规范,接口不关心这些类的内部数据, 也不关心这些类里 ...

  8. Java 内部类、静态类内部类

    问: 什么是内部类? 答: 内部类(Inner Class)就是在一个类的内部再定义一个类,与之对应包含内部类的类被称为外部类. 问: 为什么要将一个类定义在另外一个类内部呢? 答: 内部类主要作用如 ...

  9. maven setting.xml 存放位置导致deply失败，显示没有权限401错误

    settings.xml存在于两个地方: 1.安装的地方:$M2_HOME/conf/settings.xml 2.用户的目录:${user.home}/.m2/settings.xml 我只在mav ...

  10. Mybatis入门2-动态代理实现CRUD

    MyBatis动态代理生成DAO的步骤: 1) 编写数据管理的接口XxxMapper 2) 编写该接口对应的Mapper.xml a) namespace必须与Mapper接口全名一致 b) stat ...