在已有 Xcode 项目中 加入Cordova框架

转自:http://www.jianshu.com/p/656838ae92bc

我们知道,在UIKit中的UIWebView虽然已经提供了很多功能了,比如JavaScript和Objc之间的通信。但是考虑到一个问题,如果在Hybrid App中,如何才能实现JavaScript调用本地的一些硬件设备,如摄像头、音频、还有本地存储呢?首先想到的就是规定一些协议,在UIWebViewDelegate 中去接收JavaScript发来的消息并且由Objc代码去控制本地的数据库访问,控制摄像头和音频等等。但是诸如如何在WebView上显示本地摄像头视频,实现起来还是比较困难的。那么问题来了,如何实现这些协议,并且有广泛的适用性,让广大的开发者去使用这一套框架?

下面主要介绍一个开源的框架: Cordova,它的前身是PhoneGap,被Apache收购之后就改成Cordova了.

关于Cordova: 官方网站

Apache Cordova is an open-source mobile development framework. It allows you to use standard web technologies such as HTML5, CSS3, and JavaScript for cross-platform development, avoiding each mobile platforms‘ native development language. Applications execute within wrappers targeted to each platform, and rely on standards-compliant API bindings to access each device‘s sensors, data, and network status.

大意: Cordova 是一个开源的移动开发框架。它可以让你使用标准的WEB技术比如HTML5,CSS3还有JavaScript来进行跨平台的开发,避开了每个移动平台的不同的开发语言。

Use Apache Cordova if you are: a mobile developer interested in mixing native application components with aWebView(special browser window) that can access device-level APIs, or if you want to develop a plugin interface between native and WebView components.

大意: 如果你对把一个能访问设备级 API 的 WebView 集成到 Native 应用中,或者你想要开发一个接口插件实现 navtive 和 WebView 组件之间的交互,都可以使用 Apache Cordova。

在启用Cordova的WebView中,可以为应用提供了完整的用户接口。在某些平台中也可以作为一个嵌入在本地native应用的组件。同时,我们可以自行开发插件.

使用Cordova的方式分2种:

1.Cross-platform(CLI) workflow : CLI是一个High-Level的工具,可以允许你在多个平台上只建立一次工程。

2.Platform-centered workflow : 以Native为中心,使用WebView的形式嵌入。

那么如何在Mac OS 下使用 Cordova 呢 ?

1. 首先安装一个Node.js

https://nodejs.org/en/download/

2.  打开终端输入如下命令

$  sudo npm install –g cordova

安装 cordova

3. 然后就可以开始建立cordova项目了,如下:

$  cd Desktop/

$  cordova create Demo xidx Stevin_Y

上面第一个参数是project名,第二个是App id,第三个是文件夹名

建立完成之后我们可以加入iOS项目

$  cd Stevin_Y/

$  cordova platform add ios

4.显示已经安装的平台项目以及可安装的平台

 $  cordova  platform ls   

5.build iOS项目

 $  cordova build ios

6 . 使用 Xcode 打开项目,并且运行,效果如下:

以上的步骤描述了如何使用Cordova建立一个简单的项目,接下来我们来看看如何在已有的Native项目中加入Cordova。

如何集成Cordova组件以WebView形式集成到Native应用中去:

可以参考这个网址给的步骤,但是有些地方是不对的。

http://cordova.apache.org/docs/en/4.0.0/guide_platforms_ios_webview.md.html

下面是我加入工程的顺序~

1.加入我们已经存在名为Demo项目,目录结构如下:

2.拷贝Cordova相关文件到Demo目录下,拷贝后目录结构如下

3.将CordovaLib.xcodeproj添加到Demo工程中,右键选择Add Files To Demo

4.添加www目录到工程中,记得是勾选Create folder references

5.按步骤三添加config.xml到工程中,目录结构如下

6.选择工程的Build Settings->Other Links, 设置-Objc -all_load

7.选择Build Phases->New Run Script Phase,将新增New Run Script Phase命名为copy www directory

8.Build Phases->Target Dependencies添加CordovaLib

9.Link Binary With Librarys添加libCordova.a, MobileCoreServices,AssetsLibrary

9.接下来你就可以正常使用Cordova了,注意other linkers一定要设置,否则会提示类似的错误

-[__NSCFConstantString JSONObject]: unrecognized selector sent to instance

10. 然后什么都不用动,command + R 就可以看到效果了,如图:

事实上CDVViewController 中的HTML文件配置地址都是可以自己定义的,只是默认的就是www文件夹,所以我们什么都不用改就可以运行了。

我们可以在载入之前插入如下代码,指定文件夹和开始页HTML文件:

self.wwwFolderName = @"myfolder";

self.startPage = @"mypage.html"

时间: 2024-10-28 10:55:37

在已有 Xcode 项目中 加入Cordova框架的相关文章

Xcode项目中使用PDF 格式的矢量图作为图片资源

从xcode6开始, Xcode项目中可使用PDF 格式的矢量图(1X)作为图片资源. Xcode 会自动使用矢量图等比适配,而不需要再导入 @2x.@3x 多张切图.这样不仅省去了PNG图片还减少了图片资源众多管理,命名的麻烦. 使用方法: 把PDF格式的矢量图形添加到Xcode的素材管理分类 - Asset Catalog里, 调用图片集合名字即可 1.在Xcode里打开Images.xcassets. 2.创建一个新的图片集合 - New Image Set. 3.在属性检查器 - Att

[转]在iOS项目中使用CorePlot框架

转载地址:http://blog.csdn.net/llfjfz/article/details/7849190#comments Core Plot是OS X和IOS下的一个开源图形库,它提供数据的可视化处理,就是画曲线图.柱状图和饼图等等.如何在项目中使用Core Plot的静态库呢?以下是几个步骤: 首先先去Google Code下载Core Plot图形库,网址 http://code.google.com/p/core-plot/ .目前该网址提供了CorePlot_1.0.zip下载

项目中使用技术框架的最重要目的是什么?

最近在着手项目改造,突然想到一个问题,我们为什么要用框架,框架的最重要目的是什么? 如果在框架使用之前,在进行框架搭建时,我可能会想: 要使用最合适的技术架构,解决业务问题 减少开发人员的代码开发量. 让开发人员更加专注于业务流程. 但是在项目运行到一定阶段,我们会发现: 在项目运行到一定时期,技术架构可能在一定程度上不再满足最新的业务问题,但是我们还是要使用框架而不是去自由开发自己的代码. 在某些功能模块中,可能会有很多种代码编写方式,真是比用框架写更少的代码. 再回过头来考虑为什么使用框架时

在Maven项目中关于SSM框架中邮箱验证登陆

1.你如果要在maven项目中进行邮箱邮箱验证,你首先要先到pom.xml文件中配置mail.jar,activation.jar包 <dependency> <groupId>javax.mail</groupId> <artifactId>mail</artifactId> <version>1.4</version> </dependency> <dependency> <groupId

项目中选择css框架的苦恼

优点 a) 提高开发效率. b) 规范名称定义,便于维护. c) 规范项目开发流程 d)css代码更清晰.简单.html代码更合理. e) 大规模项目中可以减少用户下载 弊端 a) 学习成本提高.你需要了解整个框架,需要阅读框架的文档. b)css框架对于一个小项目等页面来说很臃肿.框架中可能有大部分你用不到的代码. c)可能会无法帮助你的技术提高.太依赖框架,以至于很难排除bug.包括框架中本身就带的bug. d) 选择自己需要的框架与开发框架都很痛苦.写到后面发现越来越不灵活,越来越臃肿.

软件开发工程师(JAVA)中级考试大纲-----四(四)Log4J的原理及配置;Log4J常用的API;在项目中应用日志框架Log4J关键类和接口介绍;Java properties配置文件log

log4j Log4j是Apache的一个开放源代码项目,通过使用Log4j,我们可以控制日志信息输送的目的地是控制台.文件.GUI组件,甚至是套接口服务器.NT的事件记录器.UNIX Syslog守护进程等:我们也可以控制每一条日志的输出格式:通过定义每一条日志信息的级别,我们能够更加细致地控制日志的生成过程.最令人感兴趣的就是,这些可以通过一个配置文件来灵活地进行配置,而不需要修改应用的代码. 1定义 log4j--log for java(java的日志) 在强调可重用组件开发的今天,除了

项目中引用ThinkPHP框架

ThinkPHP是一个宽度.兼容且简单的国产的轻量级框架,具有优良的性能,并且非常注重易用性. 那么,我们该如何将ThinkPHP引入自己的项目中,使得自己的项目可以使用这款优良的框架呢? 首先介绍下ThinkPHP框架的目录结构: Common:框架的核心函数库 Conf:框架的核心配置文件目录 Lang:语言包 Library:框架的核心资源库目录 ThinkPHP.php:核心入口文件 所以,如果我们想要引用ThinkPHP的框架,非常简单,首先创建一个入口文件index.php,然后在这

php项目中商店mvc框架总结(1)

1.代码结构的划分: 目前的目录结构: /站点根目录 /application/应用程序目录 Model/模型目录 View/视图目录 Back/后台 front/ test/测试平台 Controller/控制器目录 Back/后台 front/前台 test/测试平台 /framework/框架目录 MySQLDB.class.php 数据库操作类DAO Model.class.php 基础模型类 /index.php入口文件 2.请求首页 2.1请求首页参数实例(请求localhost/i

maven web项目中整合ssm框架(连接Mysql数据库)

前面说完怎么样创建maven web项目,这篇继续向web项目中整合进ssm(spring+springmvc+mybatis)的框架. 先发个目录图片,让萌新们知道下面提到的文件是创建在什么地方. 1.web.xml文件 修改如下: <?xml version="1.0" encoding="UTF-8"?> <web-app version="3.0" xmlns="http://java.sun.com/xml/