如何在原生工程中引入Cordova工程-for iOS 【轉】

weixin_34119545發表於2017-08-29

http://blog.csdn.net/e20914053/article/details/50170487

如今混合開發方興未艾,有的專案可能一開始是原生開發的,後期需要加入混合開發,如將Cordova工程引進到原生工程中。那麼該如何操作呢?下面就來描述一下步驟。

1、首先我們來建立一個Cordova工程,取名MyCordova。在建立Cordova工程之前,需要先安裝Cordova,具體安裝方法網上很多,在此不累述。

 

[plain] view plain copy
 
  1. cordova create MyCordova  

進入MyCordova工程目錄,其結構如下:

 


2、接下來新增iOS平臺,新增命令如下:

 

[html] view plain copy
 
  1. cordova platform add ios  

該命令需要在MyCordova工程根目錄下執行。執行成功後,我們進入MyCordova工程下的platforms目錄下,我們發現它增加了一個名為ios的檔案目錄。

 



3、回到MyCordova工程根目錄,執行剛才新增的ios工程。

 

[plain] view plain copy
 
  1. cordova run ios  


執行效果如下:

 

4、通過xcode建立一個原生工程MyApp。如果原生工程已經存在,可以忽略此步驟。

5、將MyCordova工程中iOS下的CordovaLib資料夾和www資料夾拷貝到MyApp工程目錄下。

MyCordova目錄:

MyApp目錄:

6、參看上圖。刪除CordovaLib下面的build資料夾,此資料夾是在執行cordova run ios命令過程中產生的,如果你沒有執行過該命令就不會產生這個資料夾。然後通過xcode的Add files to “MyApp” ...將CordovaLib.xcodeproj檔案和www資料夾新增到MyApp工程中。注意,在新增www資料夾時要勾選Create folder references。如下:

7、將MyCordova工程根目錄下的config.xml也新增到MyApp工程中。至此,所需的檔案拷貝新增工作已經完成,其檔案結構如下:

下面開始對對MyApp工程進行配置工作。

8、選擇MyApp工程的Build Settings->Other Linker Flags, 設定-Objc -all_load


9、選擇MyApp工程的Build Phases->Target Dependencies新增CordovaLib


10、選擇MyApp工程的Build Phases->Link Binary With Librarys新增libCordova.a、 MobileCoreServices.framework、AssetsLibrary.framework相關框架。

到此MyApp工程已經順利匯入MyCordova工程了,點選Product->Build編譯通過。下面再來建立並彈出Cordova頁面。

11、建立一個檢視控制器CordovaViewController。

其中CordovaViewController.h檔案內容如下:

 

[objc] view plain copy
 
  1. #import <Cordova/CDVViewController.h>  
  2. #import <Cordova/CDVCommandDelegateImpl.h>  
  3. #import <Cordova/CDVCommandQueue.h>  
  4.   
  5. @interface CordovaViewController : CDVViewController  
  6.   
  7. @end  
  8.   
  9. @interface CordovaCommandDelegate : CDVCommandDelegateImpl  
  10. @end  
  11.   
  12. @interface CordovaCommandQueue : CDVCommandQueue  
  13. @end  

CordovaViewController.m檔案內容如下:

 

 

[objc] view plain copy
 
  1. #import "CordovaViewController.h"  
  2.   
  3. @implementation CordovaViewController  
  4.   
  5. - (id)initWithNibName:(NSString*)nibNameOrNil bundle:(NSBundle*)nibBundleOrNil  
  6. {  
  7.     self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];  
  8.     if (self) {  
  9.         // Uncomment to override the CDVCommandDelegateImpl used  
  10.         // _commandDelegate = [[MainCommandDelegate alloc] initWithViewController:self];  
  11.         // Uncomment to override the CDVCommandQueue used  
  12.         // _commandQueue = [[MainCommandQueue alloc] initWithViewController:self];  
  13.     }  
  14.     return self;  
  15. }  
  16.   
  17. - (id)init  
  18. {  
  19.     self = [super init];  
  20.     if (self) {  
  21.         // Uncomment to override the CDVCommandDelegateImpl used  
  22.         // _commandDelegate = [[MainCommandDelegate alloc] initWithViewController:self];  
  23.         // Uncomment to override the CDVCommandQueue used  
  24.         // _commandQueue = [[MainCommandQueue alloc] initWithViewController:self];  
  25.     }  
  26.     return self;  
  27. }  
  28.   
  29. - (void)didReceiveMemoryWarning  
  30. {  
  31.     [super didReceiveMemoryWarning];  
  32. }  
  33.   
  34. #pragma mark View lifecycle  
  35.   
  36. - (void)viewWillAppear:(BOOL)animated  
  37. {  
  38.       
  39.     [super viewWillAppear:animated];  
  40. }  
  41.   
  42. - (void)viewDidLoad  
  43. {  
  44.     [super viewDidLoad];  
  45. }  
  46.   
  47. - (void)viewDidUnload  
  48. {  
  49.     [super viewDidUnload];  
  50. }  
  51.   
  52. #pragma mark UIWebDelegate implementation  
  53.   
  54. - (void)webViewDidFinishLoad:(UIWebView*)theWebView  
  55. {  
  56.     theWebView.backgroundColor = [UIColor blackColor];  
  57.       
  58.     return [super webViewDidFinishLoad:theWebView];  
  59. }  
  60.   
  61.   
  62. @end  
  63.   
  64. @implementation CordovaCommandDelegate  
  65.   
  66.   
  67. #pragma mark CDVCommandDelegate implementation  
  68.   
  69. - (id)getCommandInstance:(NSString*)className  
  70. {  
  71.     return [super getCommandInstance:className];  
  72. }  
  73.   
  74. - (NSString*)pathForResource:(NSString*)resourcepath  
  75. {  
  76.     return [super pathForResource:resourcepath];  
  77. }  
  78.   
  79. @end  
  80.   
  81. @implementation CordovaCommandQueue  
  82.   
  83. - (BOOL)execute:(CDVInvokedUrlCommand*)command  
  84. {  
  85.     return [super execute:command];  
  86. }  
  87.   
  88. @end  


12、為MyApp工程中的“進入Cordova”UIButton繫結事件方法,來彈出CordovaViewController檢視控制器。執行效果如下:(左邊為原生檢視控制器,右邊為彈出的CordovaViewController檢視控制器)

 

                        

是不是跟在MyCordova工程中通過cordova run ios命令執行出來的效果一樣呢!

ok,至此原生工程匯入Cordova工程的方法步驟全部結束。


相關文章