cordova项目备忘 [ lion1ou ]

iOS 技巧

iOS 运行调试方式

iOS 开发与 Android 开发有所不同，由于苹果的限制，它不能像 Android 开发那样直接通过命令行命令实现真机调试。

iOS 版本的 cordova 项目编译步骤：添加 iOS 平台=》添加所需插件=》通过cordova build ios命令生成.xcodeproj 文件=》双击打开该文件=》通过 Xcode 实现真机调试

72f96cbagw1f6fgatmsvnj215o0k0jx8

缩减标题栏，修复界面的高度。

将通过命令行生成的.xcodeproject 文件直接打开运行时，会发现页面内容会显示到手机的通知栏。
只需要在 Staging 目录下 Classes 目录下的 MainViewController.m 下重写方法如下：

-(void)viewWillAppear:(BOOL)animated
{
    if([[[UIDevice currentDevice]systemVersion ] floatValue]>=7)
    {
        CGRect viewBounds=[self.webView  bounds];
        viewBounds.origin.y=20;
        viewBounds.size.height=viewBounds.size.height-20;
        self.webView.frame=viewBounds;
        self.modalPresentationStyle=UIModalPresentationOverCurrentContext; //解决上浮的问题
    }
    [super viewWillDisappear:animated];
}
-(void)viewWillDisappear:(BOOL)animated
{
    if([[[UIDevice currentDevice]systemVersion ] floatValue]>=7)
    {
        CGRect viewBounds=[self.webView  bounds];
        viewBounds.origin.y=20;
        viewBounds.size.height=viewBounds.size.height+20;
        self.webView.frame=viewBounds;
        self.modalPresentationStyle=UIModalPresentationOverCurrentContext; //解决相机的问题
    }
    [super viewWillDisappear:animated];
}

禁止上下滑动出现灰色背景

使用 Cordova 进行跨平台应用开发时，发现在 iOS 平台下，如果页面处于最顶端时，用户用手指往下拖动，会露出灰色空背景。同样页面在最底部的时候，继续向上拖动，下方也会露出空背景。

要禁止这个拖动效果，可在 config.xml 中进行如下设置：

<preference name="WebViewBounce" value="false" />
<preference name="DisallowOverscroll" value="true" />

设置 iOS 下默认语言为中文

比如在打开键盘输入时，调用相机插件时，调用相册时，都会出现英文现象。

006tKfTcgw1f6vrt0t7thj30nl0ac763

使用 Xcode 打开工程，将在 plist 文件里面 Localization native development region 设置为 China 即可。

006tKfTcgw1f6vrw81nswj315k0hodo9

出现 submit()方法无效

在 post 请求时，可能出现 submit()方法无效的情况，需要在 config.xml 中添加

<allow-navigation href="*" />

通过给按钮添加震动提高用户使用感受

<div class="button vibrate"></div>

$(".vibrate").bind("tap", function () {
  //需要引入phonegap的js
  if (navigator.notification)
    setTimeout(function () {
      navigator.notification.vibrate(20);
    }, 0);
});

android 技巧

捕捉 android 返回按键【需要 cordova 支持】

document.addEventListener("deviceready", onDeviceReady, false);

function onDeviceReady() {
  // 注册回退按钮事件监听器
  document.addEventListener("backbutton", onBackKeyDown, false);
  //其他页面初始化完成后的事件
}

function onBackKeyDown() {
  //这里写上你要处理的事情
}

使用命令行打包签名 apk

打包 apk

cordova bulid android              # 用于测试的打包方式，生成已签名apk
cordova build --release android    # 生成没有签名的apk

第一个命令生成的是一个 Cordova-debug.apk，很明显是用来进行本地开发测试使用的，注意这个 apk 是有签名的，所以能被安装在手机上，但是这个不能用来上架。因为只有在绝对同样的环境下进行打包，才能保证这个 apk 的签名相同，意味着你这台机器必须始终保持正常并且系统和打包工具等不作修改。这明显是不合理的。所以，我们必须采用生产的方式打包，就是第二个命令，这个命令生成的是一个无签名的 apk，他无法安装在手机上，必须进行签名。

生成签名文件

keytool -genkey -v -keystore demo.keystore -alias demo.keystore -keyalg RSA -validity 20000

# keytool是工具名称；
# -genkey意味着执行的是生成数字证书操作；
# -v表示将生成证书的详细信息打印出来；
# -keystore demo.keystore 表示证书的文件名；
# -alias demo.keystore 表示证书的别名；
# -keyalg RSA 生成密钥文件所采用的算法；
# -validity 20000 该数字证书的有效期，单位是天；

输入后会让你输入密码，并回答一些关于你公司和地区的问题，回答完后截屏记录，防止忘记。

签名 apk

jarsigner -verbose -keystore /yourpath/demo.keystore -signedjar /yourpath/demo_signed.apk  /yourpath/demo.apk  /yourpath/demo.keystore

# jarsigner是工具名称，
# -verbose表示将签名过程中的详细信息打印出来；
# /yourpath/  （根据自己的情况配置）相对于当前命令行所在文件夹的位置，可将下列文件放在同一目录下;
# -keystore   /yourpath/demo.keystore   刚刚生成的签名文件；
# -signedjar  /yourpath/demo_signed.apk  签名后的apk名称
# /yourpath/demo.apk  需要签名的apk
# /yourpath/demo.keystore 证书的别名

查看 apk 的签名

查看签名是否成功，可将签名后的文件，后缀名 apk 的改为 zip，解压。在该目录下，输入如下命令：

keytool -printcert -file META-INF/CERT.RSA
# META-INF/TEST.RSA   根据自己的情况配置

输入命令行后，会出现类似下图信息

72f96cbagw1f6d81otra6j214203ymz4

资源备忘

参考

如何创建、配置、开发第一个 ios 应用

iOS 技巧

iOS 运行调试方式

缩减标题栏，修复界面的高度。

禁止上下滑动出现灰色背景

设置 iOS 下默认语言为中文

出现 submit()方法无效

通过给按钮添加震动提高用户使用感受

android 技巧

捕捉 android 返回按键【需要 cordova 支持】

使用命令行打包签名 apk

资源备忘

cordova 文档

ionic

相关博客集

cordova 入门

功能实现

常用插件

参考