Comment implémenter le pontage React-native Android et quelles sont les étapes spécifiques ?

Cet article présente principalement l'explication détaillée du développement natif Android de pontage React-native. Maintenant, je le partage avec vous et le donne comme référence.

Dans le long voyage de développement de RN, il faudra tôt ou tard entrer en contact avec le développement natif d'Android. L'auteur présentera les hauts et les bas. Pour un novice qui ne comprend pas Android, cela. C'est un peu difficile au début. Mais tout est difficile au début. Le langage doit être compris, et le principe est le même

Pendant le processus de développement, nous. Il faut intégrer la fonction de navigation d'Amap, mais nous n'en avons pas trouvé une bonne. Pour la roue, écrivez simplement le code natif, puis utilisez JS pour appeler le module de navigation natif

Inscrivez-vous d'abord. le module

Le sens est d'enregistrer la classe sur RN , vous pouvez utiliser JS pour appeler

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;
  }
}

où modules.add(new NaviActivity(reactContext)); est d'ajouter un module d'activité natif Android

Ce module peut définir la solution, RN Il peut être appelé directement (@ReactMethod doit être déclaré sur la méthode)

@ReactMethod
  public void showFengMap(String mapID){
    Activity currentActivity = getCurrentActivity();
    Intent intent = new Intent(currentActivity, 页面名.class);
    currentActivity.startActivity(intent);
  }

Ce que veut l'auteur à faire est de passer à d'autres pages. Vous pouvez également effectuer d'autres opérations ici Par exemple, partager directement

Déclaration

Dans l'application principale de l'application Android,

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

ajouter le nom du package qui vient d'être enregistré

JS appelle le code natif

import { NativeModules } from 'react-native';

export default NativeModules.NaviActivity;

L'auteur a écrit un Untils/CommonAndroidUntils.js ici , et introduisez directement ce fichier js dans la page qui doit être utilisé

CommonAndroidUntils.show();

pour réaliser le transfert de saut.

Intégration de la navigation Amap

Pour un novice, c'est un peu difficile d'intégrer directement Amap map dans android studio au début Mais après l'avoir compris, ça fait du bien. Décrivez brièvement les problèmes rencontrés, rappelez-vous et aidez les autres

<.>Le package vocal .jar glissé directement ne peut pas être importé

La solution consiste à cliquer avec le bouton droit sur le package .jar, à cliquer sur l'option pour importer .jar et à attendre la synchronisation

<.>Le reste sont des problèmes mineurs qui peuvent être facilement résolus sur la base de la démo et de la documentation.

Ce qui précède, c'est moi, je l'ai compilé pour tout le monde, j'espère qu'il sera utile à tout le monde à l'avenir.

Articles associés :

Comment utiliser le didacticiel d'installation et de configuration de Babel

Comment configurer le fichier de configuration Babel dans vue-cli

Utilisez node.js pour implémenter la fonction de saisie automatique des enveloppes rouges de Douyin

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!