[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

范例下载

范例程序代码：下载地址