2016-05-09 18 views
3

Ich brauche einige Tasten, die zur gleichen Zeit gedrückt werden können, aber derzeit, wenn Sie eine drücken, es "reklamiert" Reaktionsfähigkeit und die anderen können nicht mehr gedrückt werden. Wie mache ich das?Mehrere Geste Responder gleichzeitig

Antwort

1

Verstanden. Sie müssen ReactNativeEventEmitter verwenden, um direkt auf Berührungsereignisse zu hören und das Gesture Responder-Material vollständig zu umgehen. Unten ist eine Decorator-Klasse, die onTouchStart, onTouchEnd und onTouchMove in der umschlossenen Klasse aufruft, wenn diese Berührungsereignisse empfangen werden.

'use strict'; 

import React, {Component} from 'react-native'; 
import ReactNativeEventEmitter from 'ReactNativeEventEmitter'; 
import NodeHandle from 'NodeHandle'; 

export const multitouchable = BaseComponent => { 
    return class extends Component { 

     constructor(props, context) { 
      super(props, context); 

      this.comp = null; 
      this.compId = null; 
     } 

     componentDidMount() { 
      if(this.comp && this.compId){ 
       this.comp.onTouchStart && ReactNativeEventEmitter.putListener(this.compId, 'onTouchStart', e => this.comp.onTouchStart(e)); 
       this.comp.onTouchEnd && ReactNativeEventEmitter.putListener(this.compId, 'onTouchEnd', e => this.comp.onTouchEnd(e)); 
       this.comp.onTouchMove && ReactNativeEventEmitter.putListener(this.compId, 'onTouchMove', e => this.comp.onTouchMove(e)); 
      } 
     } 

     componentWillUnmount() { 
      if(this.comp && this.compId){ 
       this.comp.onTouchStart && ReactNativeEventEmitter.deleteListener(this.compId, 'onTouchStart'); 
       this.comp.onTouchEnd && ReactNativeEventEmitter.deleteListener(this.compId, 'onTouchEnd'); 
       this.comp.onTouchMove && ReactNativeEventEmitter.deleteListener(this.compId, 'onTouchMove'); 
      } 
     } 

     render() { 
      return (
       <BaseComponent {...this.props} {...this.state} 
        ref={c => { 
         this.comp = c; 
         const handle = React.findNodeHandle(c); 
         if(handle) 
          this.compId = NodeHandle.getRootNodeID(handle); 
        }} 
       /> 
      ); 
     } 
    }; 
} 
+2

Dies hat mir definitiv geholfen, aber funktioniert es für Sie für die neueste Version von reagieren native? (0.27) Sieht so aus, als ob NodeHandle nicht mehr existiert, es wurde durch findNodeHandle ersetzt, aber das liefert Integer anstelle von Objekt, das als erster Parameter für die ReactNativeEventEmitter.putListener-Methode erwartet wird. Sie können jedoch ein Objekt mit dem Schlüssel _rootNodeID erstellen und dieses an putListener übergeben. Dann hat es für mich funktioniert. – OndrejRohon

Verwandte Themen