繁体   English   中英

滑动失去了感动的元素

Swiping loses the touched element

提示:本站收集StackOverFlow近2千万问答,支持中英文搜索,鼠标放在语句上弹窗显示对应的参考中文或英文, 本站还提供   中文繁体   英文版本   中英对照 版本,有任何建议请联系yoyou2525@163.com。

对于我正在构建的应用程序,我在React Native中使用AnimatedPanResponder ,下面的代码有效,但是,在滑动时,需要非常稳定的手。

你知道我该如何使它变得更宽容吗?

这是一个截屏视频: https : //giphy.com/gifs/2wGSCsPGJwYcsWsRc4

import React, { useRef, useEffect } from 'react';
import PropTypes from 'prop-types';
import { useNavigation } from '@react-navigation/native';
import { Animated, PanResponder } from 'react-native';
import Emoji from './emoji';

const animStyle = {
  zIndex: 1,
  elevation: 1,
};

const animConfig = {
  useNativeDriver: false,
};

function Swipe({ emoji, swipePast, clubId }) {
  const { navigate } = useNavigation();
  const pan = useRef(new Animated.ValueXY()).current;
  const onPanResponderMove = useRef(Animated.event([null, { dx: pan.x }], animConfig)).current;
  useEffect(() => {
    function onPan({ x }) {
      if (x > swipePast) {
        pan.resetAnimation();
        navigate('Done', { clubId });
      }
    }
    pan.addListener(onPan);
    return () => pan.removeAllListeners();
  }, [clubId, pan, swipePast, navigate]);
  const { panHandlers } = useRef(
    PanResponder.create({
      onMoveShouldSetPanResponder: () => true,
      onPanResponderMove,
      onPanResponderRelease: () => {
        Animated.spring(pan, {
          ...animConfig,
          toValue: { x: 0, y: 0 },
        }).start();
      },
    }),
  ).current;
  return (
    <Animated.View
      // eslint-disable-next-line react/jsx-props-no-spreading
      {...panHandlers}
      style={{ ...animStyle, transform: [{ translateX: pan.x }] }}
    >
      <Emoji emoji={emoji} />
    </Animated.View>
  );
}

Swipe.propTypes = {
  emoji: PropTypes.string.isRequired,
  swipePast: PropTypes.number.isRequired,
  clubId: PropTypes.string.isRequired,
};

export default Swipe;
问题暂未有回复.您可以查看右边的相关问题.
1 哪个HTML元素失去了焦点?

在javascript中,当我收到焦点事件时,如何确定哪个元素失去了焦点? 我试图避免在我的网页中的所有元素上放置onblur事件处理程序。 ...

2 Git Rebase失去了一切

我试图使用 由于使用的设备有一阵子没有更新,我有很多合并冲突。 我解决了所有冲突,在这样做的同时,我还清理了项目的90%,以删除所有旧的/错误的代码和方法。 然后,我执行以下操作: 当我这样做时,我向上滚动并想起自己是在变基中期,所以我做到了 为了中止它,当我这样做时 ...

3 iOS失去了什么?

我找不到任何解释丢失的UITouch事件的东西。 如果你在屏幕上砸了足够的时间足够多次,touchesBegan的数量将不同于touchesEnded的数量! 我认为实际了解这些孤立触摸的唯一方法是自己引用它们并跟踪它们没有移动多长时间。 示例代码: ...

4 失去了连接

我正在尝试在我的应用中上传照片。 当照片大小大于10 Mb应用程序崩溃时,xcode会显示“与资产的连接已中断或资产死亡”的消息,并显示消息“与Maria的iPhone失去连接”。 如何解决这个问题? ...

5 失去了Audiofocus

我写了一个播客音频播放器,并包含了音频焦点原理。 这是我的方法,在媒体播放器的onPrepared()方法中调用: 问题是: 启动应用程序并播放第一个播客时,一切正常。 获得了Audiofocus,播客继续播放。 当我停止播放并开始播放另一个播客时,会再次获得音频焦点 ...

6 失去了我的填充

我有一个网站,一切都可以在谷歌浏览器中完美运行,但是在IE和Firefox中,当浏览器的尺寸调整到800像素以下时,我的内容填充丢失了。 http://www.readysetpixel.net/about.html是网址。 如果您的屏幕高度大于800px,它将在20px的底部显示其填充 ...

7 CSS:绝对定位的伪元素失去了z-index?

为什么绝对定位的伪元素在使用transition时会丢失其z-index ? 小提琴: http : //jsfiddle.net/RyanWalters/jNgLL/ 发生了什么? 当您单击li ,它会向左滑动而不更改任何z-index值。 但是, :after内容突然出现在l ...

2013-11-14 21:04:45 2 891   css/ css3
8 转移div后,jQuery元素失去了可拖动的效果

我是Jquery UI Draggable的新用户。 这是我的问题,我有2个Divs,其中两个div之间可以转移项目。 为什么将div转移到另一个div然后返回时,可拖动效果消失了? 我不能使用辅助克隆。 元素必须始终是可拖动的。 这是在jsfiddle https://jsfid ...

9 嵌套的React 元素失去了对键入的关注

我有: 具有子组件Filter组件App 。 子进程需要通过&lt;input onChange={handler}&gt;来改变父进程中的状态。 handler是父项在子项上设置的prop 。 到目前为止都很好。 但是,只要在输入上按下某个键,它就会失去 ...

2014-08-19 14:08:11 1 3268   reactjs
10 JQuery-ui:元素失去了“可拖动性”

我正在开发一种基于Web的地图编辑器,并且正在使用JQuery和JQuery-ui。 我主要使用后者来使对象可拖动。 当用户单击按钮时,将创建对象并将其插入页面的默认位置。 创建对象时,我使其可拖动。 发生的事情是,如果我创建两个或多个重叠的对象,则只能拖动顶部的对象,其他对象将失去 ...

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2022 STACKOOM.COM