[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

範例下載

範例程序代碼：下載地址