2017-02-15 12 views
3

REACT-NATIVEを使用してAndroidアプリを構築しています。 React-Nativeコードからアンドロイドの活動に電話したいと思います。(アンドロイドスタジオで開いたときに反応し、ネイティブで作成された)私は4クラスファイルReact-NativeコードからAndroidのアクティビティを呼び出す

  • MainActivity.javaを持って

    を(私はボタンをクリックしたときに、私はネイティブコードを反応させるには、それはアンドロイドアクティビティを呼び出す必要がありますと言います)

  • (反応ネイティブで作成された)MainApplication.java
  • Login.java(Androidの活動ファイル)
  • Example.java(Androidの活動ファイル)

が流れ、次の達成したい: - >リアクト - ネイティブJS -

Login.java> Example.java

私はすでに、次のリンクを介して行ってきましたが、理解することができませんでし

https://stackoverflow.com/a/32825290/4849554

同様の質問がここに

React Native Android: Showing an Activity from Java

答えて

10

尋ねAndroidのアクティビティを開始するには、カスタムネイティブモジュールを作成する必要があります。 1つはActivityStarterと呼ばれます。次のようにそれは、JavaScriptから使用されることがあります。

import { ..., NativeModules, ... } from 'react-native'; 

export default class DemoComponent extends Component { 
    render() { 
     return (
     <View> 
      <Button 
       onPress={() => NativeModules.ActivityStarter.navigateToExample()} 
       title='Start example activity' 
      /> 
     </View> 
     ); 
    } 
} 

ActivityStarterNativeModule呼ばリアクトネイティブのJavaインタフェースを実装するだけでJavaクラスです。このインタフェースの力仕事はまだ1が通常どちらか拡張1または​​こと、BaseJavaModuleによって行われます。

class ActivityStarterModule extends ReactContextBaseJavaModule { 

    ActivityStarterModule(ReactApplicationContext reactContext) { 
     super(reactContext); 
    } 

    @Override 
    public String getName() { 
     return "ActivityStarter"; 
    } 

    @ReactMethod 
    void navigateToExample() { 
     ReactApplicationContext context = getReactApplicationContext(); 
     Intent intent = new Intent(context, ExampleActivity.class); 
     context.startActivity(intent); 
    } 
} 

このクラスの名前は重要ではありません。 JavaScriptに公開されるActivityStarterのモジュール名は、getName()メソッドから取得されます。

react-native initによって生成されるデフォルトのアプリケーションには、React Nativeを初期化するMainApplicationクラスが含まれています。

@Override 
protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 

    mReactRootView = new ReactRootView(this); 
    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); 

    setContentView(mReactRootView); 
} 

を:あなたは、既存のアプリケーションにネイティブリアクト追加する場合は、次のように、this pageonCreateあなたはActivity年代をオーバーライドしてい

@Override 
protected List<ReactPackage> getPackages() { 
    return Arrays.<ReactPackage>asList(
      new MainReactPackage() 
    ); 
} 

:他のものの中には、そのgetPackagesメソッドをオーバーライドするReactNativeHostを拡張します注。どのアプローチを使用するかにかかわらず、カスタムモジュールを公開するカスタムパッケージを追加する必要があります。それは次のようになります。

@Override 
protected List<ReactPackage> getPackages() { 
    return Arrays.<ReactPackage>asList(
      new ActivityStarterReactPackage(), // This is it! 
      new MainReactPackage() 
    ); 
} 

それともReactInstanceManager.builder()addPackage(new ActivityStartecReactPackage())を行うことができます。

class ActivityStarterReactPackage implements ReactPackage { 
    @Override 
    public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) { 
     List<NativeModule> modules = new ArrayList<>(); 
     modules.add(new ActivityStarterModule(reactContext)); 
     return modules; 
    } 

    // UPDATE: This method was deprecated in 0.47 
    // @Override 
    // public List<Class<? extends JavaScriptModule>> createJSModules() { 
    //  return Collections.emptyList(); 
    // } 

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

は最後に、私たちの新しいパッケージが含まれるようにMainApplicationを更新します。

完全なself-contained example hereが見つかります。


UPDATE

createJSModulesバージョン0.47でReactPackage界面から除去し、そして試料のコメントアウトされています。なんらかの理由で古いバージョンのRNが付いている場合は、それでも必要になります。

関連する問題