參考
前言
單純的我自以為角寸,兩條命令就可以成功安裝并吃上這道菜:
$ npm i -S react-native-navigation
$ react-native link
結(jié)果:失敼猿辍死相!報(bào)錯(cuò)一大堆!
配置
這下咬像,我們只能手動(dòng)配置了
首先算撮,當(dāng)然是安裝最新版本的react-native-navigation
:
$ npm i -S react-native-navigation@latest
然后,我們編輯項(xiàng)目下的android/settings.gradle
文件(添加如下內(nèi)容):
include ':react-native-navigation'
project(':react-native-navigation').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-navigation/android/app/')
接著繼續(xù)編輯android/app/build.gradle
:
android {
compileSdkVersion 25
buildToolsVersion "25.0.1"
...
}
dependencies {
compile fileTree(dir: "libs", include: ["*.jar"])
compile "com.android.support:appcompat-v7:23.0.1"
compile "com.facebook.react:react-native:+"
compile project(':react-native-navigation')
}
提示:主要更改android編譯版本號(hào)县昂,以及在
dependencies
中添加compile project(':react-native-navigation')
這些配置修改好了肮柜,我們接下來就主要修改兩個(gè)java程序咯
源碼
首先是MainActivity.java
文件:
- 注釋掉原先的
MainActivity
類 - 導(dǎo)入包:
import com.reactnativenavigation.controllers.SplashActivity;
- 重寫
MainActivity
類:
(看起來大概這樣:)
package com.project;
import com.facebook.react.ReactActivity;
import com.reactnativenavigation.controllers.SplashActivity;
public class MainActivity extends SplashActivity {}
接著是重頭戲:MainApplication.java
這里也是,直接注釋掉原先的MainApplication
方法倒彰,然后添加官方提供的代碼:
import com.reactnativenavigation.NavigationApplication;
public class MainApplication extends NavigationApplication {
@Override
public boolean isDebug() {
// Make sure you are using BuildConfig from your own application
return BuildConfig.DEBUG;
}
protected List<ReactPackage> getPackages() {
// Add additional packages you require here
// No need to add RnnPackage and MainReactPackage
return Arrays.<ReactPackage>asList(
new RCTCameraPackage(),
new VectorIconsPackage()
);
}
@Override
public List<ReactPackage> createAdditionalReactPackages() {
return getPackages();
}
}
注意看
getPackages
方法审洞,把之前的類的數(shù)據(jù)寫進(jìn)去,除了MainReactPackage