iOS.ReactNative-3-about-viewmanager-uimanager-and-bridgemodule

RCTViewManager and RCTUIManager

1. RCTViewManager

1.1 RCTViewManager 实现了接口RCTBridgeModule

 @interface RCTViewManager : NSObject <RCTBridgeModule>

1.2 宏RCT_EXPORT_VIEW_PROPERTY

from file RCTViewManager.m

 RCT_EXPORT_VIEW_PROPERTY(accessibilityLabel, NSString)

以上宏展开为:

 // RCT_EXPORT_VIEW_PROPERTY(accessibilityLabel, NSString)
 + (NSString *)getPropConfigView_accessibilityLabel { return @"NSString"; }
 - (void)set_accessibilityLabel:(id)json forView:(UIView *)view withDefaultView:(UIView *)defaultView
 { if ((json && !RCTSetProperty(view, @"accessibilityLabel", @selector(NSString:), json))
       || (!json && !RCTCopyProperty(view, defaultView, @"accessibilityLabel")))
   {
     do {
       if (RCTLogLevelError >= RCTLogLevelMustFix) {
         do {
           BOOL pass = ((__objc_no) != );
           if ( && !pass){
               [[NSAssertionHandler currentHandler] handleFailureInFunction:@(__func__)
                                                                       file:@("/Users/XiaoKL/react-native/AwesomeProject/node_modules/react-native/React/Views/RCTViewManager.m")
                                                                 lineNumber:
                                                                description:@"%@ does not have setter for `%s` property", [view class], "accessibilityLabel"];
           }
           _RCTAssertFormat(pass, "/Users/XiaoKL/react-native/AwesomeProject/node_modules/react-native/React/Views/RCTViewManager.m",
                            , __func__,
                            @"%@ does not have setter for `%s` property",
                            [view class], "accessibilityLabel");
         } while ();
       }
     _RCTLogFormat(RCTLogLevelError, "/Users/XiaoKL/react-native/AwesomeProject/node_modules/react-native/React/Views/RCTViewManager.m", , @"%@ does not have setter for `%s` property",
                   [view class], "accessibilityLabel");
     } while ();
   }
 }

3. RCTBridgeModule接口

 /**
  * Provides the interface needed to register a bridge module.
  */
 @protocol RCTBridgeModule <NSObject>

RCTBridgeModule: 定义注册一个“bridge module”所需要的接口。

bridge module: 实现接口RCTBridgeModule的类被称为“bridge module”, 这些模块可以被注册到 RCTBridge 中。

3.1 RCTBridgeModule.h中提供的宏定义

宏	宏定义以及描述
RCT_EXPORT_MODULE(js_name)	#define RCT_EXPORT_MODULE(js_name) \ RCT_EXTERN void RCTRegisterModule(Class); \ + (NSString *)moduleName { return @#js_name; } \ + (void)load { RCTRegisterModule([self class]); }
RCT_EXPORT_METHOD(method)	#define RCT_EXPORT_METHOD(method) \ RCT_REMAP_METHOD(, method)
RCT_REMAP_METHOD(js_name, method)	#define RCT_REMAP_METHOD(js_name, method) \ RCT_EXTERN_REMAP_METHOD(js_name, method) \ - (void)method
RCT_EXTERN_MODULE(objc_name, objc_supername)	#define RCT_EXTERN_MODULE(objc_name, objc_supername) \ RCT_EXTERN_REMAP_MODULE(, objc_name, objc_supername)
RCT_EXTERN_REMAP_MODULE(js_name, objc_name, objc_supername)	#define RCT_EXTERN_REMAP_MODULE(js_name, objc_name, objc_supername) \ objc_name : objc_supername \ @end \ @interface objc_name (RCTExternModule) <RCTBridgeModule> \ @end \ @implementation objc_name (RCTExternModule) \ RCT_EXPORT_MODULE(js_name)
RCT_EXTERN_METHOD(method)	#define RCT_EXTERN_METHOD(method) \ RCT_EXTERN_REMAP_METHOD(, method)
RCT_EXTERN_REMAP_METHOD(js_name, method)	#define RCT_EXTERN_REMAP_METHOD(js_name, method) \ + (NSArray *)RCT_CONCAT(__rct_export__, RCT_CONCAT(js_name, RCT_CONCAT(__LINE__, __COUNTER__))) { \ return @[@#js_name, @#method]; \ } \

A): RCT_EXPORT_MODULE(js_name): 将BridgeModule注册到bridge中。该宏依赖函数:

RCTRegisterModule(), 下面看一下该函数的实现: (RCTBridge.m)

 void RCTRegisterModule(Class moduleClass)
 {
   static dispatch_once_t onceToken;
   dispatch_once(&onceToken, ^{
     RCTModuleClasses = [[NSMutableArray alloc] init];
   });

   RCTAssert([moduleClass conformsToProtocol:@protocol(RCTBridgeModule)], // 1
             @"%@ does not conform to the RCTBridgeModule protocol",
             NSStringFromClass(moduleClass));

   // Register module
   [RCTModuleClasses addObject:moduleClass];
 }

RCTRegisterModule()仅仅是将Class对象添加到了一个数组类型的静态变量RCTModuleClasses中.

1: “bridge module” 必须实现接口 RCTBridgeModule 。

RCT_EXPORT_MODULE(js_name)

"The optional js_name argument will be used as the JS module name. If omitted, the JS module name will

match the Objective-C class name. "

B): RCT_EXPORT_METHOD(method) 宏　　

Wrap the parameter line of your method implementation with this macro to

expose it to JS.

用宏 RCT_EXPORT_METHOD() 来处理要导出到JS中的接口:

 RCT_EXPORT_METHOD(createTimer:(NSNumber *)callbackID
                   duration:(NSTimeInterval)jsDuration
                   jsSchedulingTime:(NSDate *)jsSchedulingTime
                   repeats:(BOOL)repeats)

以上宏 RCT_EXPORT_METHOD()展开为:

 + (NSArray *)__rct_export__1720 { return @[@"", @"createTimer:(NSNumber *)callbackID duration:(NSTimeInterval)jsDuration jsSchedulingTime:(NSDate *)jsSchedulingTime repeats:(BOOL)repeats"]; } 
- (void)createTimer:(NSNumber *)callbackID duration:(NSTimeInterval)jsDuration jsSchedulingTime:(NSDate *)jsSchedulingTime repeats:(BOOL)repeats

导入到JS的接口为: "NativeModules.ModuleName.createTimer(number)", 只有Selector第一个:以前的部分。

TODO: JavaScript Promise  Javascript.Promise

C): RCT_REMAP_METHOD(js_name, method) 宏

该宏和RCT_EXPORT_METHOD(method)类似, 只不过通过该宏可以指定导入到JS的接口名称。

D): 宏 RCT_EXTERN_MODULE 和 RCT_EXTERN_REMAP_MODULE

RCT_EXTERN_MODULE(objc_name, objc_supername)

RCT_EXTERN_REMAP_MODULE(js_name, objc_name, objc_supername)

"Use this macro in a private Objective-C implementation file to automatically register an

external module with the bridge when it loads."  'private Object-C implementation'是指Objective-C中的类别(category)。

 /* MyModuleExport.m:
  *
  *   #import "RCTBridgeModule.h"
  *
  *   @interface RCT_EXTERN_MODULE(MyModule, NSObject)
  *
  *   RCT_EXTERN_METHOD(doSomething:(NSString *)string withFoo:(NSInteger)a bar:(NSInteger)b)
  *
  *   @end
  *
  * This will now expose MyModule and the method to JavaScript via
  * `NativeModules.MyModule.doSomething`
  */
 #define RCT_EXTERN_MODULE(objc_name, objc_supername) \
   RCT_EXTERN_REMAP_MODULE(, objc_name, objc_supername)

 /**
  * Like RCT_EXTERN_MODULE, but allows setting a custom JavaScript name.
  */
 #define RCT_EXTERN_REMAP_MODULE(js_name, objc_name, objc_supername) \
   objc_name : objc_supername \
   @end \
   @interface objc_name (RCTExternModule) <RCTBridgeModule> \
   @end \
   @implementation objc_name (RCTExternModule) \
   RCT_EXPORT_MODULE(js_name)

E: 宏RCT_EXTERN_METHOD 和 RCT_EXTERN_REMAP_METHOD

略

3.2 RCTBridgeModule的接口方法

RCTBridgeModule提供的接口用来注册"Bridge Module" 模块。

3.3 实现RCTBridgeModule接口的类

实现接口RCTBridgeModule的类都是 "Bridge Module" 模块类，这些类的实例称为"Bridge Module"。

3.4 "Bridge Module" 初始化

RCTBatchedBridge类的方法initModules 对Native "Bridge Module" 进行了初始化。

---

Reference

1. React-Native Source Code