React Native封装tencentx5 Sdk的Webview

参考资料：
react-native-webview-tencentx5
手把手教你一步步集成腾讯 X5 内核（Tencent TBS X5）

之前基于react-native-webview封装的Canvas在比较老的android手机上没法导出图片canvas.toDataURL失效了，就想用react-native-webview-tencentx5去代替react-native-webview，但是react-native-webview-tencentx5不兼容[email protected].所以只能借鉴react-native-webview-tencentx5重新去封装一个webview。

1. 去TBS官网下载sdk
   腾讯浏览服务 - SDK 下载

2. 在android/app下创建libs然后把下载的sdk包放到文件夹里（把很长名字减短）
   

3. 用android studio打开，右键点击sdk包，Add As Library

4. 下载react-native-webview-tencentx5的代码，把android/src/main/java/indi/fan/webviewx5文件夹整个拷贝到自己写安卓原生组建的文件夹下（我的文件夹名字是webviewx）
   
5. 修改java文件引入的路径改成自己文件所在的路径

6. 将RNX5WebViewPackage.kt文件改成RNX5WebViewPackage.java

package com.xxxx.webviewx;

import com.facebook.react.ReactPackage;
import com.facebook.react.bridge.JavaScriptModule;
import com.facebook.react.bridge.NativeModule;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.uimanager.ViewManager;

import java.util.Arrays;
import java.util.Collections;
import java.util.List;

public class RNX5WebViewPackage implements ReactPackage {

    @Override
    public List createNativeModules(ReactApplicationContext reactContext) {
        return Arrays.asList(
                new RNX5WebViewModule(reactContext)
        );
    }

    public List> createJSModules() {
        return Collections.emptyList();
    }

    @Override
    public List createViewManagers(ReactApplicationContext reactContext) {
        return Arrays.asList(
                new RNX5WebViewManager()
        );
    }
}

7. 修改events文件里的kt文件为java（以TopHttpErrorEvent为例）

package com.xxxx.webviewx.events;

import com.facebook.react.bridge.WritableMap;
import com.facebook.react.uimanager.events.Event;
import com.facebook.react.uimanager.events.RCTEventEmitter;

public class TopHttpErrorEvent extends Event {
    public static final String EVENT_NAME = "topHttpError";
    public int viewId;
    public WritableMap mEventData;

    public TopHttpErrorEvent(int viewId, WritableMap mEventData) {
        super(viewId);
        this.viewId = viewId;
        this.mEventData = mEventData;
    }

    public String getEventName() {
        return EVENT_NAME;
    }

    public boolean canCoalesce() {
        return false;
    }

    public short getCoalescingKey() {
        return 0;
    }

    public void dispatch(RCTEventEmitter rctEventEmitter) {
        rctEventEmitter.receiveEvent(this.viewId, this.EVENT_NAME, mEventData);
    }
}

8. 引入到MainApplication.java里