react-native与原生界面相互跳转

一、添加MyIntentModule类,并继承ReactContextBaseJavaModule实现其方法和构造函数。在该类中添加方法,注意:方法头要加@ReactMethod

public class MyIntentModule extends ReactContextBaseJavaModule {
 
    public MyIntentModule(ReactApplicationContext reactContext) {
        super(reactContext);
    }
 
    @Override
    public String getName() {
        return "IntentMoudle";
    }
    //注意:记住getName方法中的命名名称,JS中调用需要
 
    @ReactMethod
    public void startActivityFromJS(String name, String params){
        try{
            Activity currentActivity = getCurrentActivity();
            if(null!=currentActivity){
                Class toActivity = Class.forName(name);
                Intent intent = new Intent(currentActivity,toActivity);
                intent.putExtra("params", params);
                currentActivity.startActivity(intent);
            }
        }catch(Exception e){
            throw new JSApplicationIllegalArgumentException(
                    "不能打开Activity : "+e.getMessage());
        }
    }
 
    @ReactMethod
    public void dataToJS(Callback successBack, Callback errorBack){
        try{
            Activity currentActivity = getCurrentActivity();
            String result = currentActivity.getIntent().getStringExtra("data");
            if (TextUtils.isEmpty(result)){
                result = "没有数据";
            }
            successBack.invoke(result);
        }catch (Exception e){
            errorBack.invoke(e.getMessage());
        }
    }
//注意:startActivityFromJS、dataToJS方法添加RN注解(@ReactMethod),否则该方法将不被添加到RN中
}
二、添加MyReactPackage类,实现ReactPackage接口里的方法暴露给RN调用,在重写方法createNativeModules里注册上一步添加的模块:
public class MyReactPackage implements ReactPackage {
    @Override
    public List<nativemodule> createNativeModules(ReactApplicationContext reactContext) {
        return Arrays.<nativemodule>asList(new MyIntentModule(reactContext));
    }
    @Override
    public List<viewmanager> createViewManagers(ReactApplicationContext reactContext) {
        return Collections.emptyList();
    }
}
三、接着在MainApplication中的getPackages方法中注册到ReactPackage中:
@Override
protected List<reactpackage> getPackages() {
  return Arrays.<reactpackage>asList(
      new MainReactPackage(),
          new MyReactPackage()
  );
}
四、RN跳转安卓
import {
    NativeModules,
    TouchableNativeFeedback,
    ToastAndroid
}from 'react-native'
 
_onPressButton() {
        NativeModules
            .IntentMoudle
            .startActivityFromJS("com.myreactdemo.MyActivity",null);
    }
    render() {
    return (
      <View>
        <TouchableNativeFeedback onPress={this._onPressButton}>
          <Text>跳转到原生页面</Text>
        TouchableNativeFeedback>
      <View>
    );
  }
五、安卓跳转RN
1、显式调用---直接调用Activity的Class类
例,Activity1调用Activity2
Intent intent = new Intent(currentActivity.this , MainActivity.class);
startActivity(intent);
2、隐式调用
Activity1隐式调用Activity2时需要在AndroidManifest.xml文件中配置Activity2的action和category,具体添加下面的代码到Activity2的定义中
<intent-filter>
<action android:name="myaction2"/>
<category android:name="android.intent.category.DEFAULT"/>
<category android:name="mycategory" />
</intent-filter>
接着同样使用intent来启动Activity,代码如下:
Intent intent = new Intent("myaction2");
startActivity(intent);
这样就可以启动Activity2

注:在使用intent隐式调用Activity时会遇到多个Activity的intent-filter中的action和category相同时,这时android会先弹出一个选择界面的窗口,显式要启动的Activity列表,根据用户的选择来启动Activity,如Activity2和Activity3的action和category相同

<Activity android:name=".Activity2">
<intent-filter>
<action android:name="myaction2"/>
<category android:name="android.intent.category.DEFAULT"/>
<category android:name="myCategory" />
</intent-filter>
</Activity>
<Activity android:name=".Activity3">
<intent-filter>
<action android:name="myaction2"/>
<category android:name="android.intent.category.DEFAULT"/>
<category android:name="myCategory" />
</intent-filter>
</Activity>

启动Activity代码如下:
Intent intent = new("action2");
intent.addCategory("myCategory");
startActivity(intent);

这时就会弹出Acvity的选择窗口,选择启动activity2还是activity3
posted @ 2018-05-27 21:28  寒夜美美  阅读(3414)  评论(0编辑  收藏  举报