Uh oh!
There was an error while loading.Please reload this page.
- Notifications
You must be signed in to change notification settings - Fork1
📳 Low Latency Haptic Feedback with Worklet Support for React Native
License
oblador/react-native-nitro-haptics
Folders and files
Name | Name | Last commit message | Last commit date | |
---|---|---|---|---|
Repository files navigation
- Low latency for timing interaction and feedback perfectly, thanks to extremely fastNitro Modules
- Worklet support to ensure instant feedback even if JS thread is blocked
- Built forNew Architecture from the start
- Drop-in replacement for
expo-haptics
for ease of adoption
You need to install both Nitro Modules core package and Nitro Haptics:
npm install react-native-nitro-modules react-native-nitro-haptics# Don't forget to update CocoaPods and recompile app:cd ios&& pod install
SeeApple Human Interface Guidelines for best practices and references.
import{Haptics}from'react-native-nitro-haptics';<Buttontitle="Press me"onPress={()=>Haptics.impact('medium')}/>;
Assuming your app has been correctly configured with Reanimated, Nitro Haptics can be called directly from the UI thread by usingNitro Modules Boxing:
import{Gesture,GestureDetector}from'react-native-gesture-handler';import{Haptics}from'react-native-nitro-haptics';import{NitroModules}from'react-native-nitro-modules';constboxed=NitroModules.box(Haptics);<GestureDetectorgesture={Gesture.Tap().onBegin(()=>{'worklet';boxed.unbox().impact('medium');})}/>;
Impact haptics provide a physical metaphor you can use to complement a visual experience. For example, people might feel a tap when a view snaps into place or a thud when two heavy objects collide.
style
argument maps toUIImpactFeedbackGenerator.FeedbackStyle
, seeHIG for visualization.
Notification haptics provide feedback about the outcome of a task or action, such as depositing a check or unlocking a vehicle.
type
argument maps toUINotificationFeedbackGenerator.FeedbackType
, seeHIG for visualization.
Selection haptics provide feedback while the values of a UI element are changing, seeHIG for visualization.
Haptics.performAndroidHaptics(type: 'confirm' | 'reject' | 'gesture-start' | 'gesture-end' | 'toggle-on' | 'toggle-off' | 'clock-tick' | 'context-click' | 'drag-start' | 'keyboard-tap' | 'keyboard-press' | 'keyboard-release' | 'long-press' | 'virtual-key' | 'virtual-key-release' | 'no-haptics' | 'segment-tick' | 'segment-frequent-tick' | 'text-handle-move')
Android equivalent to provide haptic feedback for some built in actions, such as long presses, but you may wish to provide feedback for your own widget, seeHapticFeedbackConstants
for uses.
MIT
About
📳 Low Latency Haptic Feedback with Worklet Support for React Native
Topics
Resources
License
Uh oh!
There was an error while loading.Please reload this page.
Stars
Watchers
Forks
Sponsor this project
Uh oh!
There was an error while loading.Please reload this page.
Uh oh!
There was an error while loading.Please reload this page.