在整个屏幕上获取触摸事件

时间:2016-08-23 10:45:29

标签: javascript react-native

我有一个消失的标题,我希望在屏幕上的任何位置单击一下即可返回视图。但是,如果我将整个<View>包裹在<TouchableX>组件中,则PanResponder将停止工作。这周围有黑客吗?

4 个答案:

答案 0 :(得分:4)

您无需使用Touchable组件进行扭曲。

将下一个道具添加到根View

onResponderGrant - 让View处理触摸

onStartShouldSetResponder - 让View处理启动

答案 1 :(得分:3)

要详细说明@Nicholas Chong的建议,以下是对我有用的示例。您可以通过道具在任何class MonitoringWorker(threading.Thread): def __int__(self, threads_hashtag: int = 1, threads_image: int = 4, threads_user: int = 1): self.threads_hashtag = threads_hashtag self.threads_image = threads_image self.threads_user = threads_user self.queue_hashtag = Queue() self.queue_image_meta_first = Queue() self.queue_image_meta_second = Queue() self.queue_image_meta_third = Queue() self.queue_user = Queue() super().__init__() def run(self): workers_hashtag = [HashtagWorker(self.queue_hashtag, self.queue_image_meta_first, i) for i in range(self.threads_hashtag)] # do stuff if __name__ == '__main__': m = MonitoringWorker() m.start() m.join() 上使用onTouchStartonTouchEnd处理程序:

View

More information

答案 2 :(得分:0)

这是使用onResponderGrant

的实施示例
import React, { Component } from 'react';
import {
  Platform,
  StyleSheet,
  Text,
  View,
  TouchableOpacity
} from 'react-native';

const instructions = Platform.select({
  ios: 'Press Cmd+R to reload,\n' +
    'Cmd+D or shake for dev menu',
  android: 'Double tap R on your keyboard to reload,\n' +
    'Shake or press menu button for dev menu',
});

export default class App extends Component<{}> {

  constructor() {
    super();
    this.startTouch = this.startTouch.bind(this);
    this.stopTouch = this.stopTouch.bind(this);
    this.onTouchE = this.onTouchE.bind(this);
  }

  startTouch() {
    console.debug("You start so don't stop!??");
  }

  stopTouch() {
    console.debug("Why you stop??");
  }

  onTouchE() {
    console.debug("Touchable Opacity is working!!");
  }

  render() {

    return (
      <View style={styles.container}
            onResponderGrant = { () => this.startTouch() }
            onResponderRelease = { () => this.stopTouch() }
            onStartShouldSetResponder = { (e) => {return true} }
            >
          <TouchableOpacity
            onPress = { () => this.onTouchE() }
          >
            <Text style={styles.welcome}>
              Welcome to React Native!
            </Text>
          </TouchableOpacity>
        <Text style={styles.instructions}>
          To get started, edit App.js
        </Text>
        <Text style={styles.instructions}>
          {instructions}
        </Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: 'cornflowerblue',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
  },
});

答案 3 :(得分:0)

onResponderGrant对我不起作用,点击屏幕时我使用onTouchEnd触发