This module is no longer needed thanks to react-native-tvos/react-native-tvos#295
TvOS remote controller module for react native. Including "tap","long press","swipe" and "pan" gesture.
react-native-tvos-controller demo video
npm install --save react-native-tvos-controller
react-native link react-native-tvos-controller
You need rnpm
(npm install -g rnpm
)
rnpm link react-native-tvos-controller
If Automatically link can't work, you should link the module manually. Manually Link Tutorial
-
Add the following to your Project: node_modules/react-native-tvos-controller/ios/RNtvoscontroller.xcodeproj
-
Add the following to Link Binary With Libraries: libRNtvoscontroller.a
-
Add the following to your Header Search Paths: $(SRCROOT)/../node_modules/react-native-tvos-controller/ios/RNtvoscontroller
import reactNativeTvosController from "react-native-tvos-controller"
reactNativeTvosController.connect()
Connect the remote controller of apple TV.
reactNativeTvosController.enablePanGesture();
You will receive the specific moving offset tracing data if you enable the pan gesture. You can't receive the swipe event anymore.
You can receive the swipe event and other gestures when it was enabled simultaneously recognizing reactNativeTvosController.enableRecognizeSimultaneously()
reactNativeTvosController.disablePanGesture();
You won't receive the specific moving offset tracing data if you disable the pan gesture. You can continue receiving the swipe event.
reactNativeTvosController.enableRecognizeSimultaneously();
Events from all recognizers are sending simultaneously.
reactNativeTvosController.disableRecognizeSimultaneously();
Disable. Events will be send from the first recognized gesture recognizer.
Subscribe the native events of Apple TV's remote controller.
var tapSubscription = reactNativeTvosController.subscribe('TAP',
(e) => {
console.log("tapped");
console.log(JSON.stringify(e));
/*
e.type : "PlayPause" || "Menu" || "Select" || "UpArrow" || "DownArrow" || "LeftArrow" || "RightArrow"
e.code : 0 || 1 || 2 || 3 || 4 || 5 || 6
*/
});
tapSubscription(); //Cancel Subscription
var swipeSubscription = reactNativeTvosController.subscribe('SWIPE',
(e) => {
console.log("swiped");
console.log(JSON.stringify(e));
/*
e.direction : "Right" || "Down" || "Left" || "Up"
e.code : 0 || 1 || 2 || 3
*/
});
swipeSubscription(); //Cancel Subscription
var longPressSubscription = reactNativeTvosController.subscribe('LONGPRESS',
(e) => {
console.log("longPressed");
console.log(JSON.stringify(e));
/*
e.state : "Began" || "Ended"
e.code : 0 || 1
*/
});
longPressSubscription(); //Cancel Subscription
var panSubscription = reactNativeTvosController.subscribe('PAN',
(e) => {
console.log("panned");
console.log(JSON.stringify(e));
/*
e.state : "Began" || "Changed" || "Ended"
e.x : (x offset)
e.y : (y offset)
e.velocityX : number
e.velocityY : number
*/
});
panSubscription(); //Cancel Subscription