React-native橋接Android如何實現,具體步驟又是什麼?

亚连
發布: 2018-06-11 16:29:46
原創
2181 人瀏覽過

本篇文章主要介紹了React-native橋接Android原生開發詳解,現在分享給大家,也給大家做個參考。

在開發RN的漫漫長河中,早晚有那麼一天要接觸到安卓的原生開發,筆者來介紹一下其中的酸甜苦辣.對於一個不懂android的小白來說,剛開始有點難,不過都是萬事開頭難.語言是想通的,原理也是大徑若一.

#開發過程中是要集成高德的導航功能,沒有找到好的輪子的,只要寫原生程式碼,然後在用JS去調用原生的導航模組.

#首先註冊模組

其意義在與將類別註冊到RN中,才能用JS去呼叫

public class AnExampleReactPackage implements ReactPackage { @Override public List createViewManagers(ReactApplicationContext reactContext) { return Collections.emptyList(); } @Override public List createNativeModules(ReactApplicationContext reactContext) { List 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 getPackages() { return Arrays.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以及文檔輕鬆解決的不值一提了.

上面是我整理給大家的,希望今後會對大家有幫助。

相關文章:

如何使用babel安裝設定教學

#在vue-cli中如何設定babel設定檔

使用node.js實作抖音自動搶紅包功能

以上是React-native橋接Android如何實現,具體步驟又是什麼?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!