如何在React Native中为iOS和Android设备实现闹钟/提醒功能

Hey there! Let's figure out how to build that alarm/reminder app you want—with manual stop and snooze features—since the two libraries you tried didn't work out. Here are some reliable approaches to get this done in React Native:

This library is specifically built for alarm-style notifications, supports both Android and iOS, and natively handles snooze/stop actions without relying on the device calendar. It’s actively maintained, so you’ll avoid the broken issues you ran into with the first library.

Setup & Example Code #

First, install the package:

npm install react-native-alarm-notification --save
# or
yarn add react-native-alarm-notification

Then, configure the basic options and set up your alarm:

import RNAlarmNotification from 'react-native-alarm-notification';

// Define your alarm configuration (customize as needed)
const alarmConfig = {
  channelId: 'app-alarm-channel',
  channelName: 'App Alarms',
  channelDescription: 'Notifications for app alarms',
  title: 'Meeting with customer',
  message: 'Time to meet your customer!',
  vibrate: true,
  vibration: 1000,
  playSound: true,
  soundName: 'default', // Use custom sound by adding file to native projects
  hasButton: true,
  buttonText: 'Stop',
  snoozeText: 'Snooze',
  snoozeInterval: 5, // Snooze for 5 minutes
};

// Set an alarm (example: 10 minutes from now)
const scheduleAlarm = () => {
  const fireTime = new Date(Date.now() + 10 * 60 * 1000).toISOString();
  RNAlarmNotification.setAlarm(fireTime, alarmConfig)
    .then(result => console.log('Alarm scheduled:', result))
    .catch(err => console.log('Failed to schedule alarm:', err));
};

// Listen for user actions (Stop/Snooze)
RNAlarmNotification.getInitialNotification().then(notification => {
  if (notification) {
    switch(notification.action) {
      case 'stop':
        console.log('User stopped the alarm');
        // Add your stop logic here (e.g., clear any pending alarms)
        break;
      case 'snooze':
        console.log('User snoozed the alarm');
        // Optionally re-schedule the alarm with the snooze interval
        break;
    }
  }
});

Key Setup Notes #

• Android: Add required permissions to AndroidManifest.xml (like POST_NOTIFICATIONS and RECEIVE_BOOT_COMPLETED to retain alarms after reboot) and set up the notification channel.
• iOS: Request notification permissions in your app, and enable background modes for notifications if needed.

If you need more flexibility than a library offers, you can create custom native modules to handle alarms directly:

• Android: Use AlarmManager to schedule alarms, BroadcastReceiver to trigger notifications, and add notification actions for Stop/Snooze.
• iOS: Use UNUserNotificationCenter to create notification requests with time triggers, define custom actions for Stop/Snooze, and handle those actions in your native code.

This approach gives you full control over every aspect of the alarm behavior, but it requires writing native Kotlin/Swift code.

• Permissions: Always double-check that you’ve requested and been granted the necessary notifications/background permissions on both platforms.
• Background Restrictions: Some Android manufacturers (like Xiaomi, Samsung) have strict background limits. You’ll need to guide users to add your app to their "protected apps" list to ensure alarms trigger even when the app is closed.
• Time Zones: Use UTC time when scheduling alarms to avoid issues with daylight saving or time zone changes.

内容的提问来源于stack exchange，提问作者Jose Pablo Flores