CODEWITHSUNDEEP
javascriptandroidreact-native
Mohamed Ahmed
Mohamed Ahmed

Reputation: 223

TVEventHandler not found for Android TV

I am trying to build an application for android tv and I wanted to use the remote movements. I first checked if there was a package which could help me with this but I could not find one.

Then I moved on to the official documentation listed here

I am trying to use this code:

var TVEventHandler = require('TVEventHandler');

class Game2048 extends React.Component {
  _tvEventHandler: any;

  _enableTVEventHandler() {
    this._tvEventHandler = new TVEventHandler();
    this._tvEventHandler.enable(this, function(cmp, evt) {
      if (evt && evt.eventType === 'right') {
        cmp.setState({board: cmp.state.board.move(2)});
      } else if(evt && evt.eventType === 'up') {
        cmp.setState({board: cmp.state.board.move(1)});
      } else if(evt && evt.eventType === 'left') {
        cmp.setState({board: cmp.state.board.move(0)});
      } else if(evt && evt.eventType === 'down') {
        cmp.setState({board: cmp.state.board.move(3)});
      } else if(evt && evt.eventType === 'playPause') {
        cmp.restartGame();
      }
    });
  }

  _disableTVEventHandler() {
    if (this._tvEventHandler) {
      this._tvEventHandler.disable();
      delete this._tvEventHandler;
    }
  }

  componentDidMount() {
    this._enableTVEventHandler();
  }

  componentWillUnmount() {
    this._disableTVEventHandler();
  }

But the var TVEventHandler = require('TVEventHandler'); says no module was found called TVEventHandler. And I tried to import it manually from react-native/Libraries/Components/AppleTV and that gives me an error stating that the component may not have been exported error. I am not sure what I am doing wrong here. I did everything the Doc asks

Upvotes: 3

Views: 3388

Answers (1)

Mohamed Ahmed
Mohamed Ahmed

Reputation: 223

Resolved the issue. Use this in your class Instead. And make sure to import the TVEventHandler from react-native:

_tvEventHandler: any;


_enableTVEventHandler() {
        var self = this;
        this._tvEventHandler = new TVEventHandler();
        this._tvEventHandler.enable(this, function (cmp, evt) {
            console.log("kcubsj"+evt.eventType)
            if (evt && evt.eventType === 'right') {
                console.log('right');
            } else if (evt && evt.eventType === 'up') {
                console.log('up');
            } else if (evt && evt.eventType === 'left') {
                console.log('left');
            } else if (evt && evt.eventType === 'down') {
                console.log('down');
            } else if (evt && evt.eventType === 'select') {
                //self.press();
            }
        });
    }

_disableTVEventHandler() {
        if (this._tvEventHandler) {
            this._tvEventHandler.disable();
            delete this._tvEventHandler;
        }
    }

 componentDidMount() {
        this._enableTVEventHandler();
    }

componentWillUnmount() {
        this._disableTVEventHandler();
    }

Original Answer

Upvotes: 2

Related Questions