源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

js实现界面向原生界面发消息并跳转功能

  • 时间:2020-07-18 07:37 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:js实现界面向原生界面发消息并跳转功能
本文实例为大家分享了js界面向原生界面发消息并跳转的具体代码,供大家参考,具体内容如下 [b]步骤一 [/b] 在idea中,打开rn项目下的./Android/app,这个过程需要一点儿时间,可能还需要下载gradle的依赖什么的。 [b]步骤二 [/b]跟做原生app没差,我们新建一个TestActivity,简单起见,仅实现如下:
public class TestActivity extends AppCompatActivity {

  private Button mBtGoBack;

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_test);
    mBtGoBack = (Button) findViewById(R.id.bt_go_back);
    mBtGoBack.setOnClickListener(new View.OnClickListener() {
      @Override
      public void onClick(View view) {
        finish();
      }
    });

  }
}

[b]步骤三[/b] 写一个类ExampleInterface extends ReactContextBaseJavaModule,在该类中接收消息。 具体代码:
public class ExampleInterface extends ReactContextBaseJavaModule {

  private ReactApplicationContext mRApplicationContext;

  public ExampleInterface(ReactApplicationContext reactContext) {
    super(reactContext);
    mRApplicationContext = reactContext;
  }

  //RN使用这个名称来调用原生模块的其他函数
  @Override
  public String getName() {
    return "ExampleInterface";
  }
  //必须写@ReactMethod,将其注册为能够被React调用的函数
  @ReactMethod
  public void HandlerMessage(String aMessage){
    Log.d("lt","====receive message from RN==="+aMessage);
     //这部分实现简单的跳转
    Intent intent = new Intent(mRApplicationContext,TestActivity.class);
    intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
    mRApplicationContext.startActivity(intent); 
  }

}

[b]步骤四[/b] 实现一个包管理器,并将接收消息的类ExampleInterface,注册进去。 代码如下:
public class AnExampleReactPackage implements ReactPackage {

  @Override
  public List<NativeModule> createNativeModules(ReactApplicationContext reactApplicationContext) {
    List<NativeModule> modules = new ArrayList<>();
    modules.add(new ExampleInterface(reactApplicationContext));
    return modules;
  }

  @Override
  public List<Class<? extends JavaScriptModule>> createJSModules() {
    return Collections.emptyList();
  }

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

[b]步骤五 [/b] 在MainApplication中添加包管理类AnExampleReactPackage;
 @Override
  protected List<ReactPackage> getPackages() {
   return Arrays.<ReactPackage>asList(
     new MainReactPackage(),
     new AnExampleReactPackage()
   );
  }

[b]步骤六 [/b]在js界面,发送消息;
buttonPress:function(){
  NativeModules.ExampleInterface.HandlerMessage('test');
  }
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程素材网。
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部