美文网首页cordova 点点滴滴iOS技术专题
Xcode7.3 配置PhoneGap 和Cordova a

Xcode7.3 配置PhoneGap 和Cordova a

作者: Raybon_lee | 来源:发表于2015-08-14 16:30 被阅读2768次

提醒:

最近有朋友反馈说PhoneGap 打不开,这个是有新的API更新了,比以前更NB了,所以我也没做这一块,没怎么关注:
最新的Cordova App 教程请先参考官网哦,目前工作任务有点紧张,暂时先不怎么更新了,需要的朋友请点击我哦


本来进入公司想着只是负责一些维护更新呢,我是做iOS的,公司缺少移动端开发人员,没办法就负责iOS、安卓端的平台了,但是好景不长,有点累人,公司决定APP往H5发展,因为有很多不同的APP,对于我这个懒人,不知道怎么去面对了,不顾我一向是向上的,开始决定花费一天时间稍作研究,具体的等日后再说,好了,开始具体来说环境配置


H5测试demo下载地址:PhoneGap iOS测试demo下载地址

(一)、 环境所需要的东西,我们来做一些整理

最新的Cordova App 安装教程官网
进入到下载地址后是这个界面 在这里我选择了2.9.1版本下载
  1. 下面我们先安装一下node.js 下载好的一个.pkg 文件,双击安装,和正常Mac 安装应用程序一样,
    安装完成之后我暂时不管位置了,处理接下来的操作
  2. 下面是解压我们下载好的PhoneGap 2.9.1 ,解压好之后我们可以看到如下的几个文件,看到了吧,需要那个平台就在对应的平台的Lib添加一下就好
这个是解压之后的文件

3.我们要用到一下结构的bin下的目录,箭头勾选的那个是Lib下的实例工程,可以双击打开,运行,我们先不做介绍,介绍bin下的主要操作,
打开我们的的终端控制器:

我的是在下载里面

有些不使用终端的也可以找到对应的bin 目录直接拖进来就行了,前提是前面要先输入一下cd+空格+文件路径

  • 接下来我们进入到bin 目录下进行如下操作
    继续输入./create /Users/plee/Desktop/Demo001 com.shunx.test HelloWorld
    • 其中Demo001 是我们创建的文件夹名字
    • HelloWorld 是我们使用创建的工程名字,回车后就会出现一个文件夹,在桌面可以看到
创建之后可看到

终端的话我们继续输入cd
回到我们之前的界面
接下来使用命令cd /Users/plee/Desktop/Demo001/cordova
按下我们的键盘的Enter
接着输入 ./build
然后回车即可
等待10秒左右即可看到一个提示** BUILD SUCCEDD **的字样
接下来就可以使用我们的Xcode直接打开HelloWorld.xcodeproj文件
打开后的目录如下多了一个WWW,的文件

打开的工程目录如图

运行结果可以选择真机,也可以使用模拟器

模拟器运行结果

以上就是我们常说的用HTML5 开发APP的配置环境

  • 那么接下来我们还要看什么呢?
    工程中的www这个文件夹不可不看
    我们知道HTML加载页面要包含以下几个东西:
    HTML + CSS+JavaScript
    CSS: 代表样式,其实就是我们看到的一些基础配置,颜色,字体之类的显示效果,这下简单多了吧
    HTML: 一种标签语言,可以和JS进行交互使用

重要的一部需要我们来完成

- (BOOL)application:(UIApplication*)application didFinishLaunchingWithOptions:(NSDictionary*)launchOptions
{
    CGRect screenBounds = [[UIScreen mainScreen] bounds];

#if __has_feature(objc_arc)
        self.window = [[UIWindow alloc] initWithFrame:screenBounds];
#else
        self.window = [[[UIWindow alloc] initWithFrame:screenBounds] autorelease];
#endif
    self.window.autoresizesSubviews = YES;

#if __has_feature(objc_arc)
        self.viewController = [[MainViewController alloc] init];
#else
        self.viewController = [[[MainViewController alloc] init] autorelease];
#endif
    self.viewController.useSplashScreen = YES;

    // Set your app's start page by setting the <content src='foo.html' /> tag in config.xml.
    // If necessary, uncomment the line below to override it.
这个地方换成我们需要加载的页面就可以了,
    self.viewController.startPage = @"reg.html";

    // NOTE: To customize the view's frame size (which defaults to full screen), override
//针对加载页面的大小可以自己手动设置页面大小,具体的还需要APP细致调节以下
    // [self.viewController viewWillAppear:] in your view controller.

    self.window.rootViewController = self.viewController;
    [self.window makeKeyAndVisible];

    return YES;
}


以上就是我们对于一个PhoneGap 开发iOS APP的环境配置,具体的一些使用会在后面继续加入,如有高手见解,可以留言,本人也是第一次尝试,不代表任何观点,只是给需要的程序员提供一个入口

相关文章

网友评论

  • 葡萄糖君:我在www有两个HTML,index1.html和index2.html,我在原生端有A、B页面,
    现在我想在A页面加载index1,在B页面加载index2,该怎么指定加载的HTML。
    self.wwwFolderName = @"www";
    self.startPage = @"index2.html";
    根本没办法指定,依然加载index1,求指导啊
    Raybon_lee:@葡萄糖君 这个startPage 你明白什么叫做开始加载选项么,你的index2.html 加载要通过index1.html 里面的一些操作加载,而不是同时加载两个界面
  • 你正哥来了:现在PhoneGap 2.9.1 没有了吧,怎么创建xcode 的PhoneGap 的工程呀?
    Raybon_lee:@你正哥来了 我在看,官网好像修改了一些东西,我这个是去年弄的,我看下最新的流程是什么,更新一下
    你正哥来了:@Raybon_lee 嗯 ,怎么创建呀?教一下我OK?
    Raybon_lee:@你正哥来了 没有了😓,我看下
  • 66bb870f5a49: config.xml里设置<content src="index.html" />一样的。但是我加载的都是HTML界面,js没效果。我新手,求解答。
    Raybon_lee:@66bb870f5a49 你试一下直接在入口添加索引地址呢,JS的话,你在使用的function内写一个alert调用一下,看下是否执行,路径加载是否正确
  • 0f9d9cf5209c:楼主,最后一步“重要的一步需要我们来完成”,这部分代码在哪呢? 我没找到,求指点,谢谢!
    Raybon_lee:@0f9d9cf5209c 我不是贴上代码了么,在工程的入口文件写入你要加载的HTML文件就好
    0f9d9cf5209c:我找到了,谢谢你的文章!

本文标题:Xcode7.3 配置PhoneGap 和Cordova a

本文链接:https://www.haomeiwen.com/subject/bzcwqttx.html