zoukankan      html  css  js  c++  java
  • React-native 中的触摸响应功能

    我们在做APP的时候,与桌面应用系统不同的是触摸响应。

    web页面对触摸响应的支持和原生的APP有着很大的差异。

    基本用法

     componentWillMount: function() {
        this._panResponder = PanResponder.create({
          // 要求成为响应者:
          onStartShouldSetPanResponder: (evt, gestureState) => true,
          onStartShouldSetPanResponderCapture: (evt, gestureState) => true,
          onMoveShouldSetPanResponder: (evt, gestureState) => true,
          onMoveShouldSetPanResponderCapture: (evt, gestureState) => true,
    
          onPanResponderGrant: (evt, gestureState) => {
            // 开始手势操作。给用户一些视觉反馈,让他们知道发生了什么事情!
    
            // gestureState.{x,y}0 现在会被设置为0
          },
          onPanResponderMove: (evt, gestureState) => {
            // 最近一次的移动距离为gestureState.move{X,Y}
    
            // 从成为响应者开始时的累计手势移动距离为gestureState.d{x,y}
          },
          onPanResponderTerminationRequest: (evt, gestureState) => true,
          onPanResponderRelease: (evt, gestureState) => {
            // 用户放开了所有的触摸点,且此时视图已经成为了响应者。
            // 一般来说这意味着一个手势操作已经成功完成。
          },
          onPanResponderTerminate: (evt, gestureState) => {
            // 另一个组件已经成为了新的响应者,所以当前手势将被取消。
          },
          onShouldBlockNativeResponder: (evt, gestureState) => {
            // 返回一个布尔值,决定当前组件是否应该阻止原生组件成为JS响应者
            // 默认返回true。目前暂时只支持android。
            return true;
          },
        });
      },
    
      render: function() {
        return (
          <View {...this._panResponder.panHandlers} />
        );
      },

    //注释一下:


  • 相关阅读:
    对于想用OS但又觉得单片机资源太过紧张,状态机是个不错的选择分享一种状态机设计方法
    状态机实践入门
    Codewarrior 调试错误ILLEGAL_BP
    坑爹的AVR编译器中文路径问题
    跨入AVR
    atmega8 例程:USART串口通信
    2011总结
    atmega8 默认内部RC振荡 + 解锁
    关于AVR I/O 的驱动能力的介绍
    atmega8 例程:系统库函数的延迟
  • 原文地址:https://www.cnblogs.com/wanghualiang/p/5403966.html
Copyright © 2011-2022 走看看