純手打，本人新手，有錯誤歡迎指導(dǎo)，轉(zhuǎn)載注明。
使用場景：視頻。使用方法，直接在render里用組建的方式使用原生頁面。
render() {
????????<NativeView? ?src={src}>
}
開始，RN調(diào)用原生界面。官方說明：
官方介紹了一個封裝ImageView組建的教程，使用的SimpleViewManager或者ViewManager。看了官方的還是腦殼疼?？赡苁腔A(chǔ)不夠吧。
實際操作：
1.創(chuàng)建Package類實現(xiàn)ReactPackage，然后在MainApplication-->createAdditionalReactPackages里面注冊一下。
Package類里面有兩個方法，createNativeModules/createViewManagers。這兩個是看個人需求，如果是創(chuàng)建原生的Modules的話返回第一個，如果是創(chuàng)建了原生的ViewManager的話返回第二個。返回空的話可以寫return Collections.emptyList();
public class AAAAAPackage mplements ReactPackage {
????@Override
? ? public List?createNativeModules(ReactApplicationContext reactContext) {
????????????return? Arrays.asList(
????????????????????new AAAAAManagerModule(reactContext)
? ? ? ? ? ? );
? ? }
????@Override
? ? public List?createViewManagers(ReactApplicationContext reactContext) {
????????????return Arrays.asList(
????????????????????new AAAAAAViewManager()
????????????);
? ? }
}
2.創(chuàng)建ViewManager.
實現(xiàn)getName，createViewInstance這兩個方法，第一個是能夠在JS端拿到name，第二個是返回NativeView。
public class AAAAAViewManager extends ViewGroupManager {
? ? ?protected static final String REACT_CLASS ="AAAAView";
????@Override
? ? ?public String getName() {? return REACT_CLASS;? }
?????@Override?
? ? ?protected Button createViewInstance(ThemedReactContext reactContext) {? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?this.mContext = reactContext;?
? ? ? ? ? ? ?NativeView?nv =new NativeView(reactContext);
?????????????return nv;?
? ? ? ?}
}
const NativeView = requireNativeComponent('AAAAView', className);
JS端就可以直接調(diào)用NativeView。
3.傳遞參數(shù)，調(diào)用原生方法。
1.RN給原生發(fā)送參數(shù)：
? ? RN:------->
const NativeView = requireNativeComponent('AAAAView', className);
-----------------略略略-----------------------
render() {
????????<NativeView? ?src={src}>
}
給原生發(fā)送了一個src,原生接收使用ReactProp這個標(biāo)注
@ReactProp(name ="src")
public void setSource(RNPLVideoPlayer view, @Nullable ReadableMap source) {
}
2.RN調(diào)用原生方法：
RN端
start = () => {
????UIManager.dispatchViewManagerCommand(
????????this.getVideoPlayerHandler(),
? ? ????????UIManager.getViewManagerConfig('RNPLVideoPlayer').Commands.start,
? ? ????????null,
? );
};
原生端：
@Override?
?public Map<String, Integer> getCommandsMap() {
? ? ? ? return MapBuilder.of("onclick", ONCLICK);
?}
@Override
public void receiveCommand(RNPLVideoPlayer view, int commandId, @Nullable ReadableArray args) {
? ? switch(commandId){
????????????case ONCLICK: {? doOnClick(view);? ? ?break;? }
????????????default:? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?????????????????????throw new IllegalArgumentException(String.format( "Unsupported commandId: %d", commandId ));
? ? }
}
3.原生發(fā)送信息給RN：
context.getJSModule(RCTEventEmitter.class).receiveEvent(
????????getId(),
? ? ? ? "somethings",
? ? ? ? event);
context是安卓上下文。
event一般是map類型，WritableMap event = Arguments.createMap();
THEN：在ViewManager.java里面注冊Map getExportedCustomDirectEventTypeConstants這個方法。然后把上邊事件里面的somethings注冊一個name。這里用的onStatusChange，就是RN端的方法。
@Override
public Map getExportedCustomDirectEventTypeConstants() {
? ? Map map = MapBuilder.of();
? ? map.put("somethings", MapBuilder.of("registrationName", "onStatusChange"));
? ? return map;
}
