Projekt-Präsentation: Intelligenter Wecker mit React Native für leichten Schlaf

---
title: "Intelligenter Wecker: Schlafphasenerkennung mit React Native"
excerpt: "Erfahren Sie, wie Sie einen intelligenten Wecker entwickeln, der Beschleunigungssensor-Daten nutzt, um Ihre Schlafzyklen zu verfolgen und Sie im optimalen Moment zu wecken."
---

Schon einmal aus dem Schlaf gerissen worden und fühlten sich benommen und desorientiert? Dieses Gefühl, bekannt als Schlafträgheit, ist oft das Ergebnis davon, während einer Tiefschlafphase geweckt zu werden. Was wäre, wenn Ihr Wecker intelligent auf den optimalen Moment warten könnte, um Sie zu wecken? Das ist die Idee hinter dem „Intelligenten Wecker" – einer mobilen App, die den Beschleunigungssensor Ihres Telefons nutzt, um Schlafzyklen zu schätzen und Sie während Ihrer leichtesten Schlafphase zu wecken.

In diesem Projekt showcase werden wir durch die Erstellung einer mobilen App führen, die genau das tut. Wir werden die Wissenschaft hinter der Schlafverfolgung mit Bewegungssensoren, die Herausforderungen bei der Interpretation von Beschleunigungssensor-Daten und die schrittweise Implementierung mit React Native erkunden. Dieses Projekt ist eine fantastische Kombination aus mobiler Entwicklung, Datenwissenschaft und Gesundheitstechnologie und bietet einen praktischen Einblick in die Nutzung der Power in unseren Taschen zur Verbesserung unseres Wohlbefindens.

**Voraussetzungen:**
* Vertrautheit mit React Native und JavaScript (ES6+).
* Ein physisches Gerät zum Testen (Simulatoren haben keine Beschleunigungssensoren).
* Node.js und eine React Native Entwicklungsumgebung eingerichtet.

## Das Problem verstehen

Traditionelle Wecker sind einfach: Sie klingeln zu einer festgelegten Zeit, unabhängig von Ihrem Schlafzustand. Unser Schlaf ist jedoch zyklisch und bewegt sich zwischen Leicht-, Tief- und REM-Phasen. Aufwachen aus einer leichten Schlafphase fühlt sich viel natürlicher an und lässt Sie sich erfrischter fühlen.

Die Herausforderung besteht darin, diese Schlafphasen ohne die fortschrittliche Ausrüstung eines Schlaflabors zu bestimmen. Hier kommt der Beschleunigungssensor ins Spiel. Indem Sie Ihr Telefon auf Ihr Bett legen, kann es Ihre Bewegungen throughout the night erfassen. Die Kernidee ist, dass wir uns während leichterer Schlafphasen mehr bewegen und während des Tiefschlafs relativ still sind.

Obwohl nicht so präzise wie klinische Methoden wie Polysomnographie, ist die beschleunigungsbasierte Verfolgung eine zuverlässige Methode zur Schätzung von Schlafmustern für Verbraucheranwendungen. Unser Ansatz wird sein, diese Bewegungsdaten zu erfassen, sie zu verarbeiten, um Perioden niedriger und hoher Aktivität zu identifizieren, und diese Informationen zu nutzen, um den Wecker zum richtigen Zeitpunkt auszulösen.

## Voraussetzungen

Bevor wir mit dem Programmieren beginnen, bereiten wir unsere Umgebung vor.

- **React Native Projekt:**
  Wenn Sie kein Projekt haben, erstellen Sie eines mit Expo:
  ```bash
  npx create-expo-app SmartAlarm
  cd SmartAlarm

// src/components/SleepTracker.js
import React, { useState, useEffect } from 'react';
import { View, Text, StyleSheet } from 'react-native';
import { Accelerometer } from 'expo-sensors';

const SleepTracker = () => {
  const [data, setData] = useState({ x: 0, y: 0, z: 0 });
  const [subscription, setSubscription] = useState(null);

  const _subscribe = () => {
    setSubscription(
      Accelerometer.addListener(accelerometerData => {
        setData(accelerometerData);
      })
    );
    // Setzen Sie das Aktualisierungsintervall für den Beschleunigungssensor
    Accelerometer.setUpdateInterval(1000); // 1 Sekunde
  };

  const _unsubscribe = () => {
    subscription && subscription.remove();
    setSubscription(null);
  };

  useEffect(() => {
    _subscribe();
    return () => _unsubscribe();
  }, []);

  const { x, y, z } = data;
  return (
    <View style={styles.container}>
      <Text style={styles.text}>Beschleunigungssensor:</Text>
      <Text style={styles.text}>x: {Math.round(x)} y: {Math.round(y)} z: {Math.round(z)}</Text>
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
  text: {
    fontSize: 18,
  },
});

export default SleepTracker;

// src/components/SleepTracker.js (Aktualisiert)
import React, { useState, useEffect } from 'react';
import { View, Text, StyleSheet, Button } from 'react-native';
import { Accelerometer } from 'expo-sensors';

const SleepTracker = () => {
  const [movementData, setMovementData] = useState([]);
  const [isTracking, setIsTracking] = useState(false);
  const [subscription, setSubscription] = useState(null);

  const startTracking = () => {
    setIsTracking(true);
    setSubscription(
      Accelerometer.addListener(({ x, y, z }) => {
        // Stärke der Bewegung berechnen
        const magnitude = Math.sqrt(x ** 2 + y ** 2 + z ** 2);
        // Wir interessieren uns für die Änderung von der Schwerkraft (1)
        const movement = Math.abs(magnitude - 1);
        setMovementData(prevData => [...prevData, { movement, timestamp: new Date() }]);
      })
    );
    Accelerometer.setUpdateInterval(2000); // 2 Sekunden
  };

  const stopTracking = () => {
    setIsTracking(false);
    subscription && subscription.remove();
    setSubscription(null);
    // Hier würden Sie typischerweise die movementData verarbeiten
    console.log('Endgültige Bewegungsdaten:', movementData);
  };

  useEffect(() => {
    return () => {
      subscription && subscription.remove();
    };
  }, [subscription]);

  return (
    <View style={styles.container}>
      <Text style={styles.text}>
        {isTracking ? 'Verfolge Schlaf...' : 'Bereit zur Verfolgung'}
      </Text>
      <Button title={isTracking ? "Verfolgung beenden" : "Verfolgung starten"} onPress={isTracking ? stopTracking : startTracking} />
    </View>
  );
};

// Styles bleiben gleich
const styles = StyleSheet.create({
    container: {
      flex: 1,
      justifyContent: 'center',
      alignItems: 'center',
    },
    text: {
      fontSize: 18,
      marginBottom: 20,
    },
  });

export default SleepTracker;

// src/components/SmartAlarm.js
import React, { useState, useEffect } from 'react';
import { View, Text, Button, Alert } from 'react-native';
import { Accelerometer } from 'expo-sensors';

const AUFWACH_FENSTER_MINUTEN = 30;
const BEWEGUNGS_SCHWELLENWERT = 0.1; // Dies erfordert Anpassung

const SmartAlarm = () => {
  const [targetAlarmTime, setTargetAlarmTime] = useState(null);
  const [inWakeUpWindow, setInWakeUpWindow] = useState(false);
  const [subscription, setSubscription] = useState(null);

  useEffect(() => {
    // Prüfe jede Sekunde, ob wir im Aufwachfenster sind
    const interval = setInterval(() => {
      if (targetAlarmTime) {
        const now = new Date();
        const windowStart = new Date(targetAlarmTime.getTime() - AUFWACH_FENSTER_MINUTEN * 60000);
        if (now >= windowStart && now <= targetAlarmTime) {
          if (!inWakeUpWindow) {
            console.log("Aufwachfenster betreten. Beginne mit der Überwachung auf Bewegungen.");
            setInWakeUpWindow(true);
            startMonitoring();
          }
        } else if (now > targetAlarmTime) {
            console.log("Zielweckzeit überschritten. Wecker wird ausgelöst.");
            fireAlarm();
        }
      }
    }, 1000);

    return () => clearInterval(interval);
  }, [targetAlarmTime, inWakeUpWindow]);

  const setAlarm = () => {
    const targetTime = new Date();
    targetTime.setMinutes(targetTime.getMinutes() + 1); // Für Demo, Wecker 1 Minute von jetzt setzen
    setTargetAlarmTime(targetTime);
    Alert.alert("Wecker gestellt", `Suche nach Leichtschlaf zwischen ${new Date(targetTime.getTime() - AUFWACH_FENSTER_MINUTEN * 60000).toLocaleTimeString()} und ${targetTime.toLocaleTimeString()}`);
  };

  const startMonitoring = () => {
    setSubscription(
      Accelerometer.addListener(({ x, y, z }) => {
        const magnitude = Math.sqrt(x ** 2 + y ** 2 + z ** 2);
        const movement = Math.abs(magnitude - 1);

        if (movement > BEWEGUNGS_SCHWELLENWERT) {
          console.log(`Bewegung erkannt (${movement.toFixed(2)}). Intelligenter Wecker wird ausgelöst!`);
          fireAlarm();
        }
      })
    );
    Accelerometer.setUpdateInterval(2000);
  };

  const fireAlarm = () => {
    stopMonitoring();
    Alert.alert("Guten Morgen!", "Haben Sie in einer Leichtschlafphase geweckt.");
    setTargetAlarmTime(null);
    setInWakeUpWindow(false);
  };

  const stopMonitoring = () => {
    subscription && subscription.remove();
    setSubscription(null);
  };

  return (
    <View>
      <Button title="Intelligenten Wecker auf 1 Minute von jetzt setzen" onPress={setAlarm} />
      {targetAlarmTime && <Text>Wecker gestellt für: {targetAlarmTime.toLocaleTimeString()}</Text>}
    </View>
  );
};

export default SmartAlarm;