⬡ Dev Tools/2026-06-24Advanced

Building a Breathing-Paced Haptic for a Meditation App with CoreHaptics

Canned expo-haptics buzzes can't produce the swell of a breath. Here is how to call CoreHaptics continuous events and parameter curves from an Expo native module to build a haptic synced to 4-7-8 breathing, with working Swift and TypeScript code.

Rork⁵⁷⁷CoreHapticsExpo²¹³Native ModuleIndie Dev³⁹

✦ Premium Article

When I shipped a small meditation and breathing app, built as an indie developer, the on-screen circle would expand and contract slowly, yet nothing reached the fingertips. People use this kind of app with their eyes closed, and I was guiding the breath with vision alone.

So I added expo-haptics and tried buzzing on the inhale and exhale cues. But Haptics.impactAsync() can only produce a single, instantaneous tap. What I wanted was a wave that swells over four seconds, pauses, and then fades over eight — something that rides along with the breath itself. No amount of stacking single taps gives you that continuous sensation.

The Taptic Engine in an iPhone is capable of far more nuance than that, and CoreHaptics is the API that unlocks it. Here we'll build a breath-synced haptic using CoreHaptics continuous events and parameter curves, then wrap it as an Expo native module so a React Native app (one generated with Rork) can call it — with the implementation code as we go.

Why expo-haptics alone never becomes a breath

expo-haptics exposes two broad families: the impact feedback of impactAsync(style) (light / medium / heavy) and the success/warning/error cues of notificationAsync(type). Both are designed to fire a single, very short, predefined pattern once.

A breathing wave needs something different in kind. What's missing comes down to three things:

Duration — a continuous vibration that lasts several uninterrupted seconds
A changing strength — the intensity rising and falling smoothly within those seconds
Phase control — being able to specify the inhale, hold, and exhale phases in seconds

expo-haptics offers none of these. Scheduling presets with setTimeout leaves silent gaps between them, so you get a dotted line instead of a wave. To let someone feel the breath in their fingertips, you have to design the vibration as a continuous event and move its strength along a curve over time. That is exactly what CoreHaptics does.

What you want	expo-haptics	CoreHaptics
A momentary tap	Great at it	Possible (transient event)
A multi-second continuous buzz	Not possible	Continuous event
Smoothly varying strength over time	Not possible	Parameter curve
Ease of adoption	A few lines	Needs a native module

So it isn't an either/or choice. The pragmatic path is to leave taps to expo-haptics and add only the breathing wave through CoreHaptics. That's the arrangement I settled on myself.

CoreHaptics continuous events and parameter curves

The key to expressing a breath with CoreHaptics is combining the continuous type of CHHapticEvent with CHHapticParameterCurve.

A continuous event lets you say "hold a vibration for this many seconds." A parameter curve then controls how the intensity moves over that span, described by control points. For the inhale, ramp from 0 up slowly; for the exhale, fall from the peak back down to 0. That curve is the breathing wave.

Both intensity and sharpness take values from 0.0 to 1.0. Lowering sharpness rounds off the edges, giving a soft, gentle buzz. In a meditation app, keeping sharpness around 0.3 removes the stabbing quality and lets the haptic blend into the breath.

Here is one cycle of 4-7-8 breathing — inhale 4s, hold 7s, exhale 8s — assembled in Swift.

import CoreHaptics
 
func makeBreathPattern(inhale: Double, hold: Double, exhale: Double) throws -> CHHapticPattern {
    let sharp = CHHapticEventParameter(parameterID: .hapticSharpness, value: 0.3)
 
    // Inhale: continuous event ramping strength 0 -> 0.8
    let inhaleEvent = CHHapticEvent(
        eventType: .hapticContinuous,
        parameters: [
            CHHapticEventParameter(parameterID: .hapticIntensity, value: 0.8),
            sharp
        ],
        relativeTime: 0,
        duration: inhale)
 
    let inhaleCurve = CHHapticParameterCurve(
        parameterID: .hapticIntensityControl,
        controlPoints: [
            .init(relativeTime: 0,      value: 0.0),
            .init(relativeTime: inhale, value: 1.0)
        ],
        relativeTime: 0)
 
    // Exhale: continuous event falling 0.8 -> 0, offset by the hold
    let exhaleStart = inhale + hold
    let exhaleEvent = CHHapticEvent(
        eventType: .hapticContinuous,
        parameters: [
            CHHapticEventParameter(parameterID: .hapticIntensity, value: 0.8),
            sharp
        ],
        relativeTime: exhaleStart,
        duration: exhale)
 
    let exhaleCurve = CHHapticParameterCurve(
        parameterID: .hapticIntensityControl,
        controlPoints: [
            .init(relativeTime: exhaleStart,          value: 1.0),
            .init(relativeTime: exhaleStart + exhale, value: 0.0)
        ],
        relativeTime: 0)
 
    // The 7s hold has no event at all -- silence is the "hold your breath" phase
    return try CHHapticPattern(
        events: [inhaleEvent, exhaleEvent],
        parameterCurves: [inhaleCurve, exhaleCurve])
}

The crucial move is placing no event during the hold. The silence itself becomes the experience of holding your breath. Wrap two continuous events — inhale and exhale — in intensity curves, and the outline of a breath appears under the fingertips.

✦

Thank you for reading this far.

Continue Reading

What follows includes implementation code, benchmarks, and practical content we hope you'll find useful. This site runs without ads — server and development costs are supported entirely by members like you. If it's been helpful, we'd be truly grateful for your support.

WHAT YOU'LL LEARN

✦You can design a continuous haptic whose strength rises and falls over several seconds using CoreHaptics parameter curves — something expo-haptics simply cannot do

✦You'll wrap CHHapticEngine in an Expo Modules API (Swift) module so React can call it by passing inhale/hold/exhale seconds

✦You'll handle the four traps every production app hits: engine auto-stop, foreground resume, unsupported hardware, and Low Power Mode

Secure payment via Stripe · Cancel anytime

✦

Unlock This Article

Get full access to the rest of this article. Buy once, read anytime. This site is ad-free — your support goes directly toward keeping it running.

Unlock all articles with Membership →

Exposing it as an Expo native module

CoreHaptics lives in Swift, so React Native can't call it directly. We wrap it in a thin native module with the Expo Modules API and hand a startBreathing function to JavaScript.

import ExpoModulesCore
import CoreHaptics
 
public class BreathHapticModule: Module {
    private var engine: CHHapticEngine?
 
    public func definition() -> ModuleDefinition {
        Name("BreathHaptic")
 
        Function("isSupported") { () -> Bool in
            CHHapticEngine.capabilitiesForHardware().supportsHaptics
        }
 
        AsyncFunction("startBreathing") { (inhale: Double, hold: Double, exhale: Double) in
            try self.ensureEngine()
            let pattern = try makeBreathPattern(inhale: inhale, hold: hold, exhale: exhale)
            let player = try self.engine?.makePlayer(with: pattern)
            try player?.start(atTime: CHHapticTimeImmediate)
        }
 
        Function("stop") {
            try? self.engine?.stop()
        }
    }
 
    private func ensureEngine() throws {
        guard CHHapticEngine.capabilitiesForHardware().supportsHaptics else { return }
        if engine == nil {
            engine = try CHHapticEngine()
        }
        try engine?.start()
    }
}

From TypeScript, this becomes a plain interface that only takes seconds.

import { requireNativeModule } from "expo-modules-core";
 
const BreathHaptic = requireNativeModule("BreathHaptic");
 
export function startBreathing(inhale = 4, hold = 7, exhale = 8) {
  if (!BreathHaptic.isSupported()) return false;
  BreathHaptic.startBreathing(inhale, hold, exhale);
  return true;
}
 
export function stopBreathing() {
  BreathHaptic.stop();
}

The biggest payoff of this design is that all of the native complexity collapses into a single line: startBreathing(4, 7, 8). When you want to add more breathing presets, the JavaScript side only changes the seconds.

The four traps every production app hits

Everything above was the happy path. On real devices, this is where you stumble. Here are the points that actually needed handling after I shipped to the App Store, in order.

1. The engine stops on its own

CHHapticEngine can be stopped by the OS under memory pressure or a media-services reset. Call startBreathing while it's stopped and nothing plays, silently. Register a stoppedHandler and a resetHandler so you rebuild when it stops and restart when it resets.

engine?.stoppedHandler = { reason in
    print("Haptic engine stopped: \(reason)")
}
engine?.resetHandler = { [weak self] in
    try? self?.engine?.start()   // play again after media services come back
}

2. It goes silent on foreground resume

When the app moves to the background, the engine stops. The first call after returning to the foreground tends to do nothing, so design startBreathing to call engine.start() again every time at the top. That is exactly why ensureEngine() above calls start() on every invocation — starting twice does no harm.

3. The device has no haptics

On devices without a Taptic Engine, and on iPad, supportsHaptics returns false. Doing nothing silently here reads as "broken." On unsupported devices I fall back to a light single expo-haptics tap, fired only at the boundary between inhale and exhale. You lose the wave, but the transitions still come through.

4. Low Power Mode dampens haptics

Low Power Mode weakens or suppresses haptic output by design. Since this is expected behavior, the practical way to cut down "the buzz is weak / missing" reports is to put a "Haptic feedback" toggle in settings along with a line noting it weakens under Low Power Mode. If haptics sit at the center of the experience, I'd recommend always keeping the visual breathing guide and designing haptics as a supplement.

Syncing the React animation to the phase

Finally, align the on-screen circle's animation with the haptic phase. When they drift apart, they actually disrupt the breath. Share the same second constants across haptics and visuals, and drive everything one cycle at a time.

import { useEffect, useRef } from "react";
import { Animated } from "react-native";
import { startBreathing, stopBreathing } from "./breathHaptic";
 
const INHALE = 4, HOLD = 7, EXHALE = 8;
 
export function useBreathCycle(active: boolean) {
  const scale = useRef(new Animated.Value(0.6)).current;
 
  useEffect(() => {
    if (!active) { stopBreathing(); return; }
 
    const runCycle = () => {
      startBreathing(INHALE, HOLD, EXHALE);  // haptic (inhale / exhale)
      Animated.sequence([
        Animated.timing(scale, { toValue: 1, duration: INHALE * 1000, useNativeDriver: true }),
        Animated.delay(HOLD * 1000),
        Animated.timing(scale, { toValue: 0.6, duration: EXHALE * 1000, useNativeDriver: true }),
      ]).start();
    };
 
    runCycle();
    const id = setInterval(runCycle, (INHALE + HOLD + EXHALE) * 1000);
    return () => { clearInterval(id); stopBreathing(); };
  }, [active]);
 
  return scale;
}

Keep the second constants in one place and have both the haptic and the visual read from them. Honoring that one small contract makes the swelling circle and the fingertip wave land together. The moment that alignment appears, the app turns into something that actually guides a breath. In meditation and sleep apps, the quality of that experience feeds straight into retention — that has been my own experience.

A next step

Start with a single screen that checks isSupported() and fire startBreathing(4, 7, 8) once on a real device. Once you feel the wave reach your fingertips, nudge sharpness by 0.1 at a time to find the softness that suits your own app best. That tactile tuning is, to me, the most enjoyable part of working with haptics.

Thank You for Reading

Rork Lab is ad-free, supported entirely by members like you. We publish practical guides daily with implementation code, benchmarks, and production-ready patterns. If you've found it useful, we'd love to have you on board.