假設已經執(zhí)行過reaact-native init AwesomeProject喉钢,生成了AwesomeProject
打開AwesomeProject文件夾贺拣,看到如下目錄結構:
用Android Studio打開AwesomeProject/android文件夾芽世,
1)運行項目
通過數(shù)據線連接好android手機,點擊上圖葵蒂,三角箭頭運行項目担敌,
可能的報錯:
如果項目報:No target device found,
則需改app/build.gradle,修改version為Android SDK Manager里有的版本
2)編寫RN頁面
1、RN js調用java方法
RN js ——> (調用) ReactContextBaseJavaModule———>(注冊到)ReactPackage ———>(注冊到) ReactApplication
2辞槐、頁面跳轉—>原生嵌套RN
java代碼:
public class DemoTwo extends ReactActivity {
private ReactRootView mReactRootView;
private ReactInstanceManager mReactInstanceManager;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.demo_two);
mReactRootView = (ReactRootView) findViewById(R.id.react_root);
mReactInstanceManager = ReactInstanceManager.builder()
.setApplication(getApplication())
.setBundleAssetName("index.android.bundle")
.setJSMainModuleName("index.android")
.addPackage(new MainReactPackage())
.setUseDeveloperSupport(BuildConfig.DEBUG)
.setInitialLifecycleState(LifecycleState.RESUMED)
.build();
mReactRootView.startReactApplication(mReactInstanceManager, "HelloWorld", null);
}
}
原生頁面嵌入:
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
android:id="@+id/react_root"
android:layout_width="match_parent"
android:layout_height="match_parent" />
3掷漱、頁面跳轉—>原生跳轉RN
原生鏈接點擊,跳轉RN榄檬,CNodeListActivity實現(xiàn)了ReactActivity接口
@Click(R.id.ll_publish_house)
public void houseRelease() {
Intent intent = new Intent(getActivity(), CNodeListActivity.class);
startActivity(intent);
}
4卜范、頁面跳轉—>RN跳轉原生
調用ReactContextBaseJavaModule的方法