当前位置: 移动技术网 > IT编程>开发语言>JavaScript > React-native桥接Android原生开发详解

React-native桥接Android原生开发详解

2018年01月26日  | 移动技术网IT编程  | 我要评论

在开发rn的漫漫长河中,早晚有那么一天要接触到安卓的原生开发,笔者来介绍一下其中的酸甜苦辣.对于一个不懂android的小白来说,刚开始有点难,不过都是万事开头难.语言是想通的,原理也是大径若一.

开发过程中是要集成高德的导航功能,没有找到好的轮子的,只要写原生代码,然后在用js去调用原生的导航模块.

首先注册模块

其意义在与将类注册到rn中,才能用js去调用

public class anexamplereactpackage implements reactpackage {
  @override
  public list<viewmanager> createviewmanagers(reactapplicationcontext reactcontext) {
    return collections.emptylist();
  }
  @override
  public list<nativemodule> createnativemodules(reactapplicationcontext reactcontext) {
    list<nativemodule> modules = new arraylist<>();

    modules.add(new naviactivity(reactcontext));
    return modules;
  }
}

其中modules.add(new naviactivity(reactcontext));意义就是添加一个安卓原生的activity模块

这个模块可以定义方案,rn可以直接调用(方法上必须声明了@reactmethod才可以)

@reactmethod
  public void showfengmap(string mapid){
    activity currentactivity = getcurrentactivity();
    intent intent = new intent(currentactivity, 页面名.class);
    currentactivity.startactivity(intent);
  }

笔者其中的到吗是跳转到其他页面,这里也可以做一些其他的操作.例如直接去分享

声明

在安卓程序的app内的mainapplication内,

@override
  protected list<reactpackage> getpackages() {
   return arrays.<reactpackage>aslist(
     new mainreactpackage(),
      new anexamplereactpackage()
   );
  }

加入刚刚注册过的包名

js调用原生代码

import { nativemodules } from 'react-native';

export default nativemodules.naviactivity;

笔者这里写了一个untils/commonandroiduntils.js,在需要用的页面直接引入这个js文件

commonandroiduntils.show();

实现跳转.

集成高德导航

对于一个小白直接去在android studio内集成高德地图刚开始还是有点难度的.不过理解之后感觉还好.简单些一下遇到的问题,提醒自己,帮助他人

直接拖入的.jar语音包不能引入

解决办法是右键.jar包,有将.jar引入的选项点击,等待同步即可.

其余的都是些小问题,根据demo以及文档轻松解决的不值一提了.

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持移动技术网。

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网