React Native Android SMS Listener 项目教程

1. 项目的目录结构及介绍

React Native Android SMS Listener 项目的目录结构如下：

react-native-android-sms-listener/
├── android/
│   ├── app/
│   │   ├── build.gradle
│   │   ├── src/
│   │   │   └── main/
│   │   │       ├── java/
│   │   │       │   └── com/
│   │   │       │       └── your-app-name/
│   │   │       │           ├── MainApplication.java
│   │   │       │           ├── SmsListenerModule.java
│   │   │       │           └── SmsListenerPackage.java
│   │   │       └── res/
│   ├── build.gradle
│   └── settings.gradle
├── ios/
├── src/
│   └── App.js
├── .gitignore
├── package.json
└── README.md

目录结构介绍

• android/：包含 Android 平台相关的代码和配置文件。
  • app/：Android 应用的主要目录。
    • build.gradle：Android 应用的构建配置文件。
    • src/main/java/com/your-app-name/：包含 Java 源代码文件。
      • MainApplication.java：Android 应用的入口文件。
      • SmsListenerModule.java：用于监听 SMS 消息的 Native Module。
      • SmsListenerPackage.java：包含 Native Module 的 ReactPackage。
    • src/main/res/：包含 Android 应用的资源文件。
  • build.gradle：Android 项目的构建配置文件。
  • settings.gradle：Android 项目的设置文件。
• ios/：包含 iOS 平台相关的代码和配置文件（本项目主要针对 Android）。
• src/：包含 React Native 应用的 JavaScript 源代码。
  • App.js：React Native 应用的入口文件。
• .gitignore：Git 忽略文件配置。
• package.json：项目的依赖和脚本配置文件。
• README.md：项目的说明文档。

2. 项目的启动文件介绍

MainApplication.java

MainApplication.java 是 Android 应用的入口文件，负责初始化和注册 React Native 模块。以下是关键代码片段：

package com.your-app-name;

import android.app.Application;
import com.facebook.react.ReactApplication;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.react.shell.MainReactPackage;
import com.facebook.soloader.SoLoader;
import java.util.Arrays;
import java.util.List;

public class MainApplication extends Application implements ReactApplication {

  private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
    @Override
    public boolean getUseDeveloperSupport() {
      return BuildConfig.DEBUG;
    }

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

    @Override
    protected String getJSMainModuleName() {
      return "index";
    }
  };

  @Override
  public ReactNativeHost getReactNativeHost() {
    return mReactNativeHost;
  }

  @Override
  public void onCreate() {
    super.onCreate();
    SoLoader.init(this, /* native exopackage */ false);
  }
}

App.js

App.js 是 React Native 应用的入口文件，负责应用的界面和逻辑。以下是关键代码片段：

import React, { useEffect } from 'react';
import { SafeAreaView, Text, View } from 'react-native';
import { NativeEventEmitter, NativeModules } from 'react-native';

const { SmsListenerModule } = NativeModules;
const eventEmitter = new NativeEventEmitter(SmsListenerModule);

const App = () => {
  useEffect(() => {
    SmsListenerModule.startListeningToSMS();

    const subscription