Android TV - TVEventHandler doesn't recognize D-Pad (arrow) event's #20924
Description
- Review the documentation: https://facebook.github.io/react-native
- Search for existing issues: https://github.com/facebook/react-native/issues
- Use the latest React Native release: https://github.com/facebook/react-native/releases
Environment
React Native Environment Info:
System:
OS: Linux 4.15 Ubuntu 18.04.1 LTS (Bionic Beaver)
CPU: x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
Memory: 2.07 GB / 15.42 GB
Shell: 4.4.19 - /bin/bash
Binaries:
Node: 8.9.0 - ~/.nvm/versions/node/v8.9.0/bin/node
npm: 5.5.1 - ~/.nvm/versions/node/v8.9.0/bin/npm
SDKs:
Android SDK:
Build Tools: 23.0.1, 23.0.2, 25.0.1, 25.0.2, 25.0.3, 26.0.2, 27.0.3, 28.0.1
API Levels: 21, 22, 23, 24, 25, 26, 27
npmPackages:
react: 16.4.1 => 16.4.1
react-native: latest => 0.56.0
npmGlobalPackages:
create-react-native-app: 1.0.0
react-native-cli: 2.0.1
Tested on Android Studio, TV emulator and two physical android TV boxes. All devices with android 8.0 and the same result of testing.
Description
According to official documentation https://facebook.github.io/react-native/docs/building-for-apple-tv
it's possible to intercept D-Pad events like:
(evt && evt.eventType === 'left')
but it seems to not work. The only events I can intercept are: focus, blur, select and playPause.
Code
import React, { Component } from 'react';
import { View, Text, TouchableHighlight, Button, Image } from 'react-native';
var TVEventHandler = require('TVEventHandler');
export default class MainScreenContainer extends Component {
enableTVEventHandler() {
this.tvEventHandler = new TVEventHandler();
this.tvEventHandler.enable(this, function(cmp, evt) {
if (evt) {
console.log(evt);
}
});
}
componentDidMount() {
this.enableTVEventHandler();
}
consoleHello = () => {
console.log('Hello');
};
render() {
return (
<View style={{ flex: 1 }}>
<Button hasTVPreferredFocus onPress={this.consoleHello} title="Hello1" />
<TouchableHighlight touchableHandleActivePressIn onPressIn={this.consoleHello} onPress={this.consoleHello}>
<Text> Touch Here </Text>
</TouchableHighlight>
<Button onPress={this.consoleHello} title="Hello3" />
</View>
);
}
}
Three simple focusable elements to navigate between. I tried to get Up, Down events while navigating between buttons/touchable component. No results. Only blur, select, focus, playPause.
Anyone can help me ?
Update:
Today I receive new bluetooth remote for testing that contains more buttons.
Situation is the same (arrow actions still don't recognized) but there are 2 more events that get recognized by TVEventHandler (rewind and fastForward).
