最近把 Aurora-IMUI 的 UI 庫支持到 React Native 上，其中開發(fā)過程中走了一些彎路蝉衣，這里做個(gè)分享。
（Gif 錄制效果不太好巷蚪。病毡。。屁柏。）現(xiàn)已經(jīng)同時(shí)支持 iOS啦膜，Android 歡迎 PR。
如何在 React Native 中使用 OC 編寫的 UI 庫
如果你的原生代碼使用 OC 代碼來實(shí)現(xiàn)的那么參考這個(gè)教程就能滿足你的需求 iOS 原生UI組件淌喻。
如何把 Swift 編寫的 UI 庫以模塊的方式提供
如果你的類庫使用 Swift 來實(shí)現(xiàn)的僧家，如果你想把它以一種模塊方式提供給開發(fā)者，看完本篇教程你就懂了（下面內(nèi)容假設(shè)你已經(jīng)看過這篇文章 iOS 原生UI組件）似嗤。
- 要讓 OC 使用 Swift 中的類庫啸臀，需要
#import "youProjectName-Swift.h"這個(gè)頭文件，這樣就可以在 OC 中使用 Swift 定義的類庫了可以參考這篇文章烁落。 - 這里希望這個(gè)庫打包成模塊乘粒，這樣開發(fā)者使用起來會(huì)更加方便。
- 新建工程伤塌，用于編譯模塊如圖所示
由于 Swift 代碼只能打包成 Framework灯萍。所以需要把所有 Swift 代碼打包成 framework，每聪。好的試試把所有的代碼打包到 framework 里面旦棉。但是這樣會(huì)有問題齿风，程序運(yùn)行的時(shí)候應(yīng)用并沒有把這個(gè)模塊加載到模塊列表中。
看下 RCT_EXPORT_MODULE() 的代碼绑洛，實(shí)際代碼如下救斑。
RCT_EXTERN void RCTRegisterModule(Class);
+ (NSString *)moduleName { return @"";
}
+ (void)load {
RCTRegisterModule(self);
}
// RCTBridge.m
static NSMutableArray<Class> *RCTModuleClasses;
void RCTRegisterModule(Class);
void RCTRegisterModule(Class moduleClass)
{
static dispatch_once_t onceToken;
dispatch_once(&onceToken, ^{
RCTModuleClasses = [NSMutableArray new];
});
RCTAssert([moduleClass conformsToProtocol:@protocol(RCTBridgeModule)],
@"%@ does not conform to the RCTBridgeModule protocol",
moduleClass);
// Register module
[RCTModuleClasses addObject:moduleClass];
}
這段代碼的意思是 load 代碼的時(shí)候會(huì)把這個(gè)模塊類加載到 ReactNative 的全局 模塊隊(duì)列 RCTModuleClasses 中。
如果我們的模塊代碼在 framework 中那么就不能加到這里面去真屯，既然如此脸候，我們就可以在新建一個(gè) TARGET , 單獨(dú)編譯我們的模塊代碼（包含 RCT_EXPORT_MODULE() 代碼的類）如下圖所示。
這樣模塊類就能成功的加載到 ReactNative 中的模塊類列表了绑蔫。
這里只是列出主要的方法运沦， 過程中肯定會(huì)出現(xiàn)各種報(bào)錯(cuò)，這些自行 google 都好解決配深。
