如何在iphone React Native中检测向后滑动事件
在iPhone React Native中检测向后滑动事件可以通过使用PanResponder来实现。PanResponder是React Native提供的一个用于处理原生手势的API。
以下是实现的步骤：
- 首先，确保你已经安装了React Native并创建了一个React Native项目。
- 在需要检测向后滑动事件的组件中，导入PanResponder和Dimensions：
import React, { Component } from 'react';
import { PanResponder, Dimensions } from 'react-native';- 在组件的构造函数中，创建一个PanResponder实例并设置相关的回调函数：
constructor(props) {
super(props);
this.panResponder = PanResponder.create({
onStartShouldSetPanResponder: () => true,
onPanResponderMove: (evt, gestureState) => {
if (gestureState.dx < 0) {
console.log('向后滑动');
// 在这里执行你想要的操作
}
},
});
}- 在组件的render方法中，将panHandlers属性绑定到需要检测滑动事件的组件上：
render() {
return (
<View {...this.panResponder.panHandlers}>
// 组件的内容
</View>
);
}通过上述步骤，你就可以在iPhone React Native中检测向后滑动事件了。当用户向后滑动时，控制台将输出"向后滑动"，你可以在该回调函数中执行你想要的操作。
推荐的腾讯云相关产品：腾讯云移动应用分析（MTA），该产品提供了丰富的移动应用数据分析功能，可以帮助开发者深入了解用户行为和应用性能，优化应用体验。产品介绍链接地址：https://cloud.tencent.com/product/mta
相关·内容
2回答
我使用react native navigator进行两个屏幕之间的通信登录和登录屏幕当我从登录屏幕注销时，即使我可以从登录屏幕向后滑动回到登录屏幕，我如何在react本地导航器中禁用向后滑动
浏览 2提问于2016-03-15得票数 9
回答已采纳
2回答
react-向后滑动导航不会触发
、、、、
我正在使用堆栈导航，并且我想使用swipe返回。然而，即使我一直向右滑动屏幕，应用程序也不会导航到前一个屏幕，屏幕会向后滑动。 import { View } from 'react-native';
import Main from './components/Main'
import Options from './components/Options'
import 'react-native-gesture-handler';
import { NavigationContainer } from '@react
浏览 56提问于2020-09-11得票数 0
嗨，我是一个新的开发人员，刚刚毕业的学校，所以我在一个投资组合项目。如果这个问题看起来很愚蠢，请提前向您道歉。 我有一个旋转木马，在我的屏幕顶部显示一个图片库和一个垂直的扁平列表，用于后半部分(底部)。 如何让下半部分在向上滑动时全屏，在向下滑动时返回半屏？react-native-gesture handler只提供向左或向右滑动，而不是上下滑动。
浏览 40提问于2021-05-06得票数 1
回答已采纳
我试图阻止用户在React Native中录制视频时通过Android后退按钮或手势返回。根据React导航的，它应该由beforeRemove事件侦听器处理。但是当返回时，事件永远不会被触发。
我尝试使用blur，它被触发了，但是因为这个事件没有preventDefault()方法，所以在这个场景中它是不可用的。
React导航- v5.x
React Native - 0.63.2
以下是我试图实现的屏幕的示例代码
const VideoCapturePage = ({navigation}) => {
const [isRecording, setIsRecording] =
浏览 3提问于2020-08-12得票数 6
我正在开发一个react原生应用程序，我正在尝试通过回退程序事件清除setinterval函数。它在android手机上运行正常，但iphone没有后退按钮，所以我无法停止setinteval功能。如何检测向后滑动处理程序？ ?
浏览 65提问于2020-08-17得票数 1
回答已采纳
1回答
是否可以控制UITableView何时在我自己的代码中滚动。
我正在尝试获取垂直滑动滚动和水平滑动传递到我的代码中的行为(有很多示例)
但
我想要一个对角线滑动什么也不做，即UITableView甚至不应该开始滚动。
我试着在这里抓到它
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
但scrollView.contentOffset.x始终为0，因此我无法检测到水平移动。
我还尝试了将UITableView子类化并实现
- (void)touchesMoved:(NSSet *)touches withEvent:
浏览 0提问于2010-06-04得票数 0
回答已采纳
我有名为主页的抽屉屏幕，它渲染材料顶部标签导航器和其他堆栈屏幕定义在it.Problem是我想重新渲染主屏幕时，我从其他定义的屏幕.Please帮助，这是应用程序中需要的最一般的功能，但我无法做到这一点。| iOS或Android |两者|都| @react-navigation/native 5.0.7 | @react-navigation/drawer 5.1.0 | react-native-reanimated 1.7.0 | react-native -gesture handler 1.6.0 | react-native-safe-area-context 0.7.3 | re
浏览 17提问于2020-05-31得票数 0
我使用的是react-native导航和react-native-navigatioin-drawer-extension。 "react-native": "^0.62.2",
"react-native-navigation": "^7.0.0",
"react-native-navigation-drawer-extension": "^3.0.0", 我想禁用滑动抽屉，并尝试将swipeToDismiss: false添加到passProps和options对象中。但是我没有得到我想要的结
浏览 13提问于2021-09-05得票数 0
回答已采纳
当我在物理iPhone设备中按下向后按钮(在堆栈标题中)或从左向右滑动时，我的react原生应用程序崩溃。应用程序在模拟器中工作正常，但在物理设备中工作不正常。
那么，我该如何解决这个问题呢？
下面是我的主导航器的代码
import { themeColor, themeColorLite } from "../styles/common";
import Login from "../views/Login"
import ForgetPass from "../views/forgetPass"
import Registration fro
浏览 1提问于2019-10-06得票数 1
我一直在阅读Reactive原住民的文档和论坛，并回答类似的问题，但我不知道如何在我的设备上运行我的应用程序。
我尝试过这个问题中提到的""，以及从ios目录中删除build文件夹并重新运行脚本。我将运行这个命令npm run ios --device "Anthony’s iPhone"，但是它会导致这个Launching iPhone 6 (iOS 11.3)... --我也尝试过运行npm run ios --simulator "iPhone 5s" --但是我还是得到了Launching iPhone 6 (iOS 11.3)...。我
浏览 0提问于2018-08-10得票数 4
回答已采纳
React本机中的平台或设备类型
(我需要它，因为我想实现一些与设备、-like、iphone或ipad相关的功能)
import {Platform} from 'react-native';
console.log(Platform.OS);
这对我很有效。
浏览 5提问于2018-01-10得票数 0
我正在构建一个混合移动应用程序，其中我在基于Cordova react的项目中使用Material-ui Snackbar组件。我想实现一个滑动关闭功能，以便可以使用swipe right action.Currently关闭Snackbar它与onClick event.I一起工作。我在material-ui Snackbar文档中找不到任何内容
浏览 1提问于2019-11-21得票数 2
2回答
当遵循一个示例时，传递React Native的初始属性不起作用。
问题是isSimulator的值被计算为undefined。
Xcode：
BOOL isSimulator = NO;
#if TARGET_IPHONE_SIMULATOR
isSimulator = YES;
#endif
RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
moduleName:@
浏览 0提问于2016-10-17得票数 1
3回答
如何在JSS中指定:焦点属性？
、、、、
我将react-native-web与expo和react-native-paper (material ui)一起使用
我的问题是在编译的web版本中的焦点轮廓属性上的文本区域，所以我需要去掉这个蓝色边框。通常我会这样做
textarea:focus {
outline:none!important
}
对于react-native，我们不能只使用jss而使用css，但是如何使用这个属性呢？
<TextInput
label='Email'
value={this.state.text}
onChangeText={text => thi
浏览 0提问于2019-09-01得票数 1
我有一个带有"n“个标签的iPhone标签栏应用程序。我想要一个UIpagecontrol，这样我就可以在标签之间滑动了。有人能告诉我怎么做吗？示例非常有用。
非常感谢。
浏览 1提问于2010-02-10得票数 1
回答已采纳
基于，我希望像yarn run ios --simulator="iPhone 8"这样的东西能工作，但它不能。
我使用的是"react-native-scripts": "1.5.0"。
浏览 0提问于2017-11-04得票数 0
1回答
在我的React Native应用程序中，我的屏幕上开始出现一些奇怪的间隙。
我已经简化了一个屏幕，所以你可以在这里看到问题：
<SafeAreaView style={{flex:1, backgroundColor: 'yellow'}}>
<View style={{flex: 1, backgroundColor: 'green'}}>
</View>
</SafeAreaView>
当我进入后台模式并重新打开应用程序(在iPhone 12上快速滑动手势)时，这个问题就消失了。请参见示例：
浏览 43提问于2021-05-22得票数 2
回答已采纳
1回答
React本机CLI将不会运行指定的模拟器。当我进入
/usr/local/bin/node /usr/local/lib/node_modules/react-native-cli run-ios ‑‑simulator="iPhone X"
模拟器按预期运行，但坚持在iPhone 6中运行，不管我指定了什么simulator，如果我从模拟器应用的菜单中选择了额外的硬件，启动的硬件就不会显示我的项目。(事实上，如果我是iPhone X的话，它会显示一款我之前开发的应用程序。)
我已经卸载并重新安装了react-native-cli，并且没有额外的全局ios-sim (尽管我曾
浏览 0提问于2018-07-08得票数 3
1回答
我从命令行使用react-native run-ios --device "<my name>’s iPhone"命令在iPhone上运行React Native应用程序。问题是我总是需要复制粘贴，因为当我实际输入<my name>'s时，<my name>’s中的撇号与撇号是不同的。’ vs '。如何键入’
浏览 46提问于2020-04-24得票数 1
1回答
我正在开发一个web应用程序，用户可以通过向左或向右滑动在旋转木马中的元素之间切换。它在移动设备上工作得很好，但是在触摸式Windows设备上的Chrome用“返回”命令覆盖了向右滑动的手势。有什么方法可以禁用它吗？
浏览 0提问于2017-11-14得票数 1
我有一个使用react-navigation的React Native应用程序。我想在StackNavigator的4个特定屏幕之间滑动手势。从屏幕A，我想要在向左滑动时访问屏幕B，在向右滑动时访问屏幕C，在向上滑动时访问屏幕D。然后从屏幕B开始，例如，如果我向右滑动，我就会回到屏幕A，等等。 我在React Navigation3.x中找不到任何适合我的用例的东西。有什么建议吗，也许是在react-native-gesture-handler中？ 我已经查过这个链接了：How to swipe horizontally inside stackNavigator screens?
浏览 6提问于2019-10-15得票数 0
我有一个暂停视频和一些其他行动的要求，以执行当用户点击主页按钮或切换到另一个应用程序使用卷帘行动。我查看了react-native AppState，但在某些设备上，当安卓系统上的home按钮被点击时，它不会调用事件侦听器。要使react-native应用程序状态正常工作，是否有兼容性最低版本要求？ 我尝试的代码如下所示 useEffect(() => {
AppState.addEventListener("change", _handleAppStateChange);
return () => {
AppState.remove
浏览 62提问于2020-08-22得票数 1
1回答
我正在创建一个在ReactNative中滑动的应用程序，它有可能提高滑动的速度吗？
模拟器
iOS11
我已经试过了。我找不到效果。
利布。
"@react-navigation/bottom-tabs":"6.3.1",
"@react-navigation/native": "6.0.10",
"@react-navigation/native-stack":"6.6.2",
"@react-navigation/stack":"6.2.1",
浏览 13提问于2022-07-12得票数 0
基于下面的代码，我期望看到“onDismiss！”当我在模式视图上向下滑动时。
当我向下滑动模式视图时，它不会调用所提供的函数。我找不到任何其他React Native用户遇到这个问题。我使用的是React Native版本0.60.6。
我使用Modal的方式是错误的，还是这是一个bug？
<Modal
animationType="slide"
presentationStyle="pageSheet"
visible={showSetup}
hardwareAccelerated
onDismiss={() => alert
浏览 51提问于2019-11-19得票数 4
回答已采纳
1回答
如何识别反应中的滑动事件？
、、、、
我目前正在开发一个React应用程序，我希望检测(在移动设备上) div元素上的滑动事件(左、右)。
在没有任何附加库的情况下，我如何实现这一点？
浏览 6提问于2022-01-06得票数 4
回答已采纳
我正在使用博览SDK 43和反应导航v6作为我的反应本地应用程序。我在我的应用程序导航中使用了React抽屉导航。在展览馆内部的开发模式中，抽屉的打开和关闭功能与滑动正确的手势配合得很好。当我在应用程序视图的边缘滑动时，抽屉面板就会完美地打开。但是，当我使用EAS build构建应用程序将其提交到应用程序商店时，在构建的版本中，滑动手势根本不起作用。按钮单击的打开/关闭功能工作正常，但滑动手势没有响应。
const StudentNavigator = () => {
return (
<DashboardDrawer.Navigator
screenOpt
浏览 26提问于2022-03-04得票数 4
我从2018年开始了一个反应本土项目。通过在2012年安装了Xcode 9.0的mini上输入npm install; npx react-native run-ios，我就可以让这个应用程序在模拟器中工作。
但是，iPhone 11无法从模拟器列表中获得。我读到我需要Xcode 11+来获得iPhone 11模拟器。因此，我将mini从OS10.13升级到OS10.15，然后将Xcode升级到12.0版。
我加载了新的Xcode并输入了我的Apple。然后我到终端输入了npx react-native run-ios，但是我得到了错误：
`instruments` is now deprec
浏览 8提问于2020-09-20得票数 3
我有一个问题，把图书馆“亚马逊-认知-身份-js”集成到反应本土化。根据设备的不同，authenticateUser函数太慢：
Iphone :40秒
三星星系A11: 70秒
问题可能在于库中的后处理，因为下面的图像显示api响应时间仅为200毫秒。
我已经寻找了几个星期的解决方案，请任何人遇到这种情况，并可以张贴解决方案。
"react-native": "0.66.3",
"@react-native-async-storage/async-storage": "^1.17.10",
"aws-amplify"
浏览 7提问于2022-09-30得票数 0
回答已采纳
5回答
如何检测滑动方向？
、、、
我想检测用户何时做了一个滑动手势，并检测它的方向(左、右、上或下)。我需要检测它不是在手势完成时，而是在iPhone知道方向时，即使它还没有完成。
我正在使用XCode 5，并使用iOS 7为iPhone 5设计。
我想知道我必须粘贴到.h和.m的代码，如果我必须将任何项目拖放到mainView中。
浏览 14提问于2014-05-01得票数 1
回答已采纳
1回答
我的React Native 0.64应用程序使用react-native-gesture handler 1.16/react-native-reanimated 2.1向左和向右滑动图像。其思想是，当用户点击图片库中的一个图像时，该图像将占据整个屏幕，而图片库中的其余图像可以通过向左或向右滑动逐一查看。以下是swipe工作的完整代码，但有一点需要注意:单击的图像不会显示，但图库中的第一个图像总是首先显示。如何登陆用户点击的图片？ import React, { useRef } from "react";
import { Dimensions, StyleSheet,
浏览 71提问于2021-05-10得票数 0
我能够读取reducer (Props)的值，但当该操作似乎被分派到还原器函数时，我无法更新redux值(Props2)。
页面：
componentDidMount(){
console.log("Props:"+this.props.user)
}
dummyFunction() {
//Redux
this.props.toggleTheme('red');
//which prints the object above in the screenshot
console.log(this.props.
浏览 0提问于2019-05-27得票数 1
回答已采纳
6回答
我在SD卡里有一个视频列表。此时，我只需要帮助为列表视图中的每一行创建手势或滑动检测。多亏了stackoverflow 上的这个问题，我在列表视图上实现了这个手势。当用户向右或向左滑动时，它现在很容易检测到。但是这个手势是针对整个listview的。我只想知道如何才能实现对单个行的滑动检测。例如，应用程序现在会打印“向右滑动”和“向左滑动”。我只想让它像“在第一行向右滑动”，“在第三行向左滑动”等等。我希望我的问题是清楚的。
期待一些有用的回复。谢谢
浏览 0提问于2011-07-06得票数 21
1回答
我正在做iOS react本地应用程序。App是视频播放器，可以连接到ChromeCast。我有一个任务要用ChromeCast卷按钮来控制iPhone卷。有没有人知道如何在反应中-本土化。或者至少解释一下如何用IOS (目标-c)来检测它？
你好，维塔利
浏览 1提问于2022-05-18得票数 0
我只是想知道，在React Native中，是否可以创建一个垂直覆盖；我的意思是，在页面上，当向下滑动时，一个覆盖下来，覆盖着页面，上面有各种信息(向上滑动时也是如此，覆盖来自底部)。一开始我想使用react-native-swiper，但垂直滑动与Android不兼容。所以，如果有人有其他的解决方案，请便！谢谢
浏览 14提问于2017-06-21得票数 1
我想在React Native中实现图像视图的收缩缩放功能。
首先，我将一个元素包装在一个元素中。我想检测缩放事件，然后相应地缩放图像。
如何获取缩放事件？
浏览 1提问于2015-06-30得票数 4
我有一个ScrollView，它包含几个用react-native-skia生成的图形。这些图形是可交互的，即我可以触摸它们，并沿着图的x轴移动一个指示符。
我的问题是，每当ScrollView事件触发时(即我们向上/向下滚动)，图形触摸事件就会被忽略，从而导致错误的UX。
演示：
下面是一个带有可复制演示的小吃：
FYI:由于某种原因，画布在Snack中1秒后消失，但是如果您在文件中进行任何更改并保存(例如在某个地方添加换行符)，那么它就会出现。如果你在本地运行这个就可以了。但为了这次讨论的目的，这是其他一些我们可以忽略的问题。
描述：
演示是一个足够大的react-native Scrol
浏览 10提问于2022-09-12得票数 1
回答已采纳
1回答
需要未知模块"111“
、、、、
我想从本地主机检索数据:4547
因此，我有一个名为loadText的函数，它应该在下面的代码中这样做：
import React, { useState } from 'react'
import { StyleSheet, View, Text, TouchableOpacity } from 'react-native'
import { TextInput } from 'react-native-gesture-handler'
import { response } from 'express'
exp
浏览 4提问于2020-04-02得票数 0
3回答
在我的iPhone应用程序中，我需要识别用户在视图上做出的滑动手势。
我希望滑动手势被识别，并在滑动上执行一个功能。
我需要的是，该视图应水平滑动，并显示另一个视图，因为用户作出一个滑动手势。
需要做些什么？
我怎么识别它呢？
浏览 0提问于2010-11-26得票数 33
回答已采纳
1回答
我有一个画廊，它使用的ipad / iphone滑动功能，但在iphone和ipad上，他的滑动功能很难激活，而且当我滑动时，它不会开始移动，就像我的手指移动时没有任何反馈一样。难道没有人知道有没有办法用我实现的东西来解决这个问题。
这是我做的画廊
浏览 0提问于2010-08-27得票数 2
回答已采纳
1回答
当应用程序处于后台时，我正试图获得用户的位置。我通过安装npm模块“@mauron85/react-native-background-geolocation”成功地做到了这一点，我的问题是当我关闭应用程序(向上滑动关闭应用程序)时，它会停止发送位置给我。它应该这样做吗？还是我把这个npm搞错了？
浏览 1提问于2019-07-10得票数 0
这是我的第一个问题，所以任何关于如何在堆栈溢出上写更好的问题的建议都将受到欢迎！
好的，我有一个有很多单元格的UICollectionView，假设在一个设备上，用户触摸第一个单元格，然后在其他单元格上滑动，而不抬起手指。当用户的手指从当前单元格中滑出并进入另一个区域时，我试图弄清楚如何调用一个函数(每个单元格都是特定的)。据我所知，我认为这就像是UIButtons的UIButtons事件(可能)。
现在，如果用户将手指拉在单元格上，它只会触发与她接触的第一个单元格相关的函数，但其他单元格都不会触发。请提前帮助和感谢！
浏览 0提问于2018-09-05得票数 1
我已经从反应导航5升级到6：
- "@react-navigation/bottom-tabs": "^5.10.6",
- "@react-navigation/material-top-tabs": "^5.3.15",
- "@react-navigation/native": "^5.8.6",
- "@react-navigation/routers": "^5.6.0",
- "@react-navigation/st
浏览 13提问于2022-11-22得票数 1
回答已采纳
9回答
我一直面临一个问题，‘react本机运行-ios’不能启动，不管我添加到-模拟器参数的模拟器。XCode有“命令行工具”的正确位置
我总是收到错误:找不到iPhone X模拟器
Error: Could not find iPhone X simulator
at resolve (/Users/eric/.../swim/node_modules/react-native/local-cli/runIOS/runIOS.js:149:13)
at new Promise (<anonymous>)
at runOnSimulator (/Users/eri
浏览 9提问于2019-02-03得票数 14
回答已采纳
在升级到React Native Webv0.13之前，带有PanResponder的视图中的TouchableOpacity不会触发onPress。在v0.13中，它现在使用相同的设置触发get。当PanResponder处理事件时，如何使onPress不被触发？ 请看我在https://codesandbox.io/s/stoic-wu-u0utn上的简单示例，红色矩形是一个TouchableOpacity，每次按下它都会记录下来。外部蓝色矩形是可拖动的。拖动红色部分时，如何使onPress不被触发？将React Native Web的版本更改为0.12.3，并查看它现在是否按预期工作。
浏览 22提问于2020-10-23得票数 2
回答已采纳
每天我都要面对很多Android React Native上crashlytics的生产模式的崩溃报告。在开发模式下不可能检测到这种崩溃。只是来自firebase的堆栈跟踪。所有这些堆栈都描述了原生Java方面正在发生的事情。通过异常的名称，我们可以假定错误的大致原因。在崩溃之前调用的一些方法，以及对您没有任何帮助的行数。更多的方法可以在应用程序的许多地方调用，甚至在第三方库中也可以调用。在一些幸运的情况下，你可以在GitHub或StackOverflow上找到相同的错误，但它们都是单独的，因为如果它在某个地方工作，并不意味着它在你的情况下也能工作。每天我都试着在我的应用程序的许多地方通过测试
浏览 1提问于2020-11-03得票数 0
我想要打包反应本机包
react-native bundle --entry-file index.ios.js --bundle-output ../NovaWed/NovaWed/Business/ReactNativeBundle/index.ios.jsbundle --platform ios --assets-dest ../NovaWed/NovaWed/Business/ReactNativeBundle --prepack true
但是终端发布的错误如下：
错误:无法在需要时(内部/module.js:12:17)在(/Users/huangjunjie/Document
浏览 2提问于2016-10-23得票数 0
我的应用程序以前运行良好，没有生成或运行时错误。然后，我将react-native-agora从^2.9.1更新到^3.0.1-rc.4。有个坠机的问题被
pod installreact-native start --reset-cache
我现在的问题是，应用程序卡在启动屏幕上，并在iOS RNv0.61.5上给出了这个错误：
Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication)
到目前为止，我已经尝试过：
在模拟器和coderemoving文
浏览 0提问于2020-08-12得票数 2
回答已采纳
我是一个模态打开和关闭使用滑动手势(反应-本机-滑动-手势)。
但当Modal可见时，它不起任何作用。
我想让Modal可以通过滑动关闭。
有什么解决办法吗？
import React from 'react';
import { ... } from 'react-native';
import GestureRecognizer from 'react-native-swipe-gestures';
export default class SwipeModal extends Component {
state = {
modal
浏览 1提问于2021-03-05得票数 1
回答已采纳
在我的React Native应用程序中，我有一个事件，当某个屏幕出现时，我希望触发该事件。我把事件放在componentDidMount中，所以它会在屏幕第一次加载时触发，但如果我离开屏幕并向左滑动以返回屏幕，屏幕已经挂载，所以事件不会被触发。
我应该如何处理这个问题？
浏览 0提问于2020-05-06得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
