[Cordova] Plugin里使用iOS Framework

[Cordova] Plugin里使用iOS Framework

前言

开发Cordova Plugin的时候，在Native Code里使用第三方Library，除了可以加速项目的时程、也避免了重复发明轮子的窘境。本篇文章介绍如何在Cordova的Plugin里使用iOS Framework，主要为自己留个纪录，也希望能帮助到有需要的开发人员。

• 参考数据：

  

建立

iOS中的第三方Library，除了可以从网络上取得之外，也可以依照下列文章的步骤，建立一个自己的iOS Framework：「MyFramework.framework」。后续步骤，会拿这个MyFramework.framework做为第三方Library来使用。

• 参考数据：[iOS] 建立与使用Framework

接着要动手撰写Cordova Plugin来使用iOS Framework，开发人员可以依照下列文章的步骤，建立一个自己的Cordova Plugin：「clk-cordova-sample」。后续步骤，会拿这个clk-cordova-sample做为Plugin主体来使用。

• 参考数据：[Cordova] Plugin开发入门

使用

完成上列两个步骤之后，开发人员会拥有Cordova Plugin：「clk-cordova-sample」、以及iOS Framework：「MyFramework.framework」。接着将MyFramework.framework放到clk-cordova-sample的src\iOS文件夹里，并且修改clk-cordova-sample的plugin.xml，定义Cordova编译的时候，将MyFramework.framework加入到平台项目的文件夹来进行编译。

• 加入MyFramework.framework

  <framework src="src/ios/MyFramework.framework" custom="true" />
  

• 完整plugin.xml

  <?xml version="1.0" encoding="UTF-8"?>
  
  <plugin xmlns="http://apache.org/cordova/ns/plugins/1.0"
          id="clk-cordova-sample"
          version="1.0.0">
  
    <!-- metadata -->
    <name>CLK Cordova Sample</name>
    <description>CLK Cordova Sample的说明</description>
    <license>Apache 2.0</license>
  
    <!-- javascript -->
    <js-module name="NotificationService" src="www/clk.cordova.sample.NotificationService.js" >
      <clobbers target="clk.cordova.sample.NotificationService" />
    </js-module>
  
    <!-- ios -->
    <platform name="ios">
      <!-- config -->
      <config-file target="config.xml" parent="/*">
        <feature name="NotificationService">
          <param name="ios-package" value="CLKNotificationService"/>
        </feature>
      </config-file>
      <!-- source -->
      <header-file src="src/ios/CLKNotificationService.h" />
      <source-file src="src/ios/CLKNotificationService.m" />
      <framework   src="src/ios/MyFramework.framework" custom="true" />
    </platform>
  
  </plugin>
  

完成上列步骤后，接着动手修改clk-cordova-sample里CLKNotificationService.m，来使用MyFramework.framework里面所提供的Class。

• CLKNotificationService.m

  #import <MyFramework/MyFramework.h>
  #import "CLKNotificationService.h"
  
  @implementation CLKNotificationService
  
  // methods
  - (void)show:(CDVInvokedUrlCommand*)command
  {
      // test
      MyClass* x = [[MyClass alloc] init];
      NSString* message = [NSString stringWithFormat:@"%@%@", @"Hi ", [x getMessage]];         
  
      // execute
      [[[UIAlertView alloc] initWithTitle:nil message:message delegate:nil cancelButtonTitle:@"OK" otherButtonTitles:nil] show];
  }
  
  @end
  

接着，因为在iOS 8.0之后，iOS项目才支持Framework类型的函式库，所以要定义clk-cordova-sample里范例APP的目标iOS版本为8.0以上。

• 目标iOS版本

  

最后，执行clk-cordova-sample里的范例APP。就可以在执行画面上，看到一个Alert窗口显示从Library取得的讯息内容，这也就完成了Cordova Plugin使用iOS Framework的相关开发步骤。

• 显示回传讯息

  

Workaround

相对于Windows、Android等平台，iOS平台上APP的建置需要比较多的耐心与经验。建议开发人员在开发iOS平台Cordova APP的时候，先使用Visual Studio完成Cordova项目的开发工作，再选择Ripple来「执行」Cordova项目，用以在项目根目录下的platforms\ios文件夹里生成完整的XCode专案。后续拿这个XCode项目到MAC上去编译及执行，可以比较顺利建置iOS平台上的Cordova APP。

• 建置Cordova专案

  

• 生成XCode专案

  

将XCode项目到MAC上去编译及执行，还会遇到一些设定需要调整。首先就是先到XCode的项目属性页面，把Framework的参考加入到项目里。(如果将Framework项目Build Settings页签的Mach-O Type属性调整为「Static Library」可以省略此步骤 - 感谢同事小董提供方案)

• Before

  

• After

  

接着，还需要去调整XCode的项目属性页面，将Framework Search Paths属性调整为.framework档案所在的正确路径。 (上一个步骤，手动将Framework的参考加入到XCode项目里时，会自动带入Framework的正确路径，所以只要移除错误路径即可。)

• Before

  

• After

  

完成上列步骤后进行编译，理论上就可以完成iOS平台上Cordova APP的建置工作。(God bless you)

• Succeeded

  

范例下载

范例程序代码：下载地址