iOS HybirdApp入门基于PhoneGap

2015-06-04 本文已影响1097人 Figo_OU

首先打开命令行敲上$ sudo npm install -g phonegap然后回车
(推荐)输入密码后,PhoneGap就会自动安装.
也可以到http://phonegap.com/install/ 这里来下载最新的PhoneGap2.9.1(虽然我下载后也搞不懂,运行过程序后没发觉有明显变化)
然后我们就可以来新建项目了

新建项目也有两种方法,第一种是按照官网上的

$ phonegap create myFirstHybird
$ cd myFirstHybird
$ phonegap run ios

敲完命令以后就可以发现myFirstHybird目录下有这些文件了,可以看到platforms目录下有ios然后有个helloWord的工程,双击运行就ok了.

目录
运行的程序
这种方法有个不好的地方就是你的工程名永远都是helloWord

下面来介绍第二种方法
1.首先要安装cordova sudo npm install -g cordova
2.在想要新建项目的文件夹中打开命令行,敲入cordova create theSecond com.ozx theSecondPro theSecond文件夹名,com.ozx:Bundle Identifier theSecondPro:工程名
3.按回车以后,就回自动生成文件,但是没有ios代码,platforms还是空的，现在我们来为它添加ios平台代码，在终端输入：cordova platform add ios , 打开工程就有
项目
4.运行,运行效果与方法一相同
那么如何修改js中的代码呢,我们现在开始来探讨.

点开Staging文件夹,对index.html进行修改

<!DOCTYPE HTML>
<html>
    <head>
        <title>PhoneGap</title>
        <script type="text/javascript" charset="utf-8" src=\'#\'" /span>
            </script>
            <script type="text/javascript" charset="utf-8" src=\'#\'" /span>
            </script>
        
        <script type="text/javascript" charset="UTF-8">
            
            function loadURL(url) {
                var iFrame;
                iFrame = document.createElement("iframe");
                iFrame.setAttribute("src", url);
                iFrame.setAttribute("style", "display:none;");
                iFrame.setAttribute("height", "0px");
                iFrame.setAttribute("width", "0px");
                iFrame.setAttribute("frameborder", "0");
                document.body.appendChild(iFrame);
                iFrame.parentNode.removeChild(iFrame);
                iFrame = null;
            }
        function check() {
            loadURL("youdao:abc");
        }

        </script>
    </head>
    <body>
        <br/>
        <br/>
        <br/>
        <input type="button" value="add" onclick="check();" />
    </body>
</html>

在CDVViewController.m文件中找到- (BOOL)webView:(UIWebView*)theWebView shouldStartLoadWithRequest:(NSURLRequest*)request navigationType:(UIWebViewNavigationType)navigationType
在其中添加

if ([[url scheme] isEqualToString:@"youdao"]) {
        UIAlertView * alertView = [[UIAlertView alloc] initWithTitle:@"test" message:[url absoluteString] delegate:nil cancelButtonTitle:@"OK" otherButtonTitles:nil] ;
        [alertView show];
        return NO;
    }

那么这样native(oc)就可以处理js上发送过来的请求了.
而native如何注入js代码呢

- (IBAction)add:(id)sender {
    NSString * js = @" var p = document.createElement('p'); p.innerText = 'new Line';document.body.appendChild(p);";
    [self.webView stringByEvaluatingJavaScriptFromString:js];
}

这样就可以在webview中显示新添加的内容了.

iOS HybirdApp入门基于PhoneGap

猜你喜欢

热点阅读

iOS HybirdApp入门 基于PhoneGap

猜你喜欢

热点阅读

iOS HybirdApp入门基于PhoneGap