ReactNative 集成 腾讯TBS 进行 文件查看

     近期，在项目中，需要用到腾讯的TBS来进行文件预览功能，由于SDK中给的demo是android原生，我们想要在ReactNative中使用，则需要进行一些工作，现在整理出来。

一.ReactNative 调用原生

1.创建 一个activity 来继承ReactContextBaseJavaModule类

public class RNActivity extends ReactContextBaseJavaModule

具体代码如下：

public class RNActivity extends ReactContextBaseJavaModule{
    private ReactApplicationContext mContext;
    public RNActivity(ReactApplicationContext reactContext) {
        super(reactContext);
        mContext=reactContext;
    }
    @Override
    public String getName() {
        return "RNActivity";
    }

    @ReactMethod
    public void show(String filePath){//ReactNative调用的是这个show方法，filePath为传的值
        //Toast.makeText(mContext, "RNActivity", Toast.LENGTH_SHORT).show();//测试是否调用了此方法
        Activity currentActivity = getCurrentActivity();
        //String filePath = "/storage/emulated/0/test.docx";
        if(null!=currentActivity){
            //Class aimActivity = Class.forName(name);
            FileDisplayActivity.show(currentActivity, filePath);//调用fileDisplayActivity的show方法
            //Intent intent = new Intent(currentActivity,UrlActivity.class);//这一行是跳转到UrlActivity这个//页面
            //currentActivity.startActivity(intent);
        }
    }

 2.创建一个类，实现ReactPackage接口

代码如下：

public class RNPackage implements ReactPackage {
    @Override
    public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {
        List<NativeModule> modules = new ArrayList<>();
        modules.add(new RNActivity(reactContext));
        return modules;
    }

    @Override
    public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {
        return Collections.emptyList();
    }
}

3.在MainApplication中进行如下添加

protected List<ReactPackage> getPackages() {
  return Arrays.<ReactPackage>asList(
      new MainReactPackage(),
      new RNPackage() //添加此行
  );
}

@Override
public void onCreate() {
  super.onCreate();
  SoLoader.init(this, /* native exopackage */ false);

  //TBS  增加这句话
  QbSdk.initX5Environment(this,null);//初始化x5内核
  QbSdk.setDownloadWithoutWifi(true);//让应用在没有WiFi的情况下，也能加载x5内核
  ExceptionHandler.getInstance().initConfig(this);

}

 4.在APP下新建 lib包，并添加官网SDK中的jar包

和

5.AndroidManifest.xml 的配置

添加权限

<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.READ_PHONE_STATE" />

6.在app下的build.gradle 的dependencies

dependencies {
    compile fileTree(include: ['*.jar'], dir: 'libs')
    compile 'com.android.support:appcompat-v7:25.3.1'
    compile 'com.facebook.react:react-native:+'
    // From node_modules
    androidTestCompile('com.android.support.test.espresso:espresso-core:2.2.2', {
        exclude group: 'com.android.support', module: 'support-annotations'
    })
    testCompile 'junit:junit:4.12'
    compile files('libs/tbs_sdk_thirdapp_v4.3.0.1020_43633_sharewithdownload_withoutGame_obfs_20190111_105200.jar')
    compile 'com.android.support:recyclerview-v7:25.3.1'
    compile 'pub.devrel:easypermissions:0.4.3'
    compile 'com.squareup.okio:okio:1.11.0'
    compile 'com.squareup.okhttp3:okhttp:3.5.0'
    compile 'com.squareup.retrofit2:retrofit:2.1.0'
    compile 'com.squareup.retrofit2:converter-gson:2.1.0'
}

7.具体的用TBS实现文件查看功能

public class FileDisplayActivity extends 
AppCompatActivity  //这是import android.support.v7.app.AppCompatActivity;里面的implements EasyPermissions.PermissionCallbacks //这是应用权限的处理

具体demo的代码