问题标签 [touchableopacity]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
0 回答
523 浏览

react-native - 如果包裹在 Touchable 中,则无法单击 Android 上的 Webview

这是反应原生应用程序中的 Android 特定问题。

更准确地说,这个问题可以在三星 S6 Edge、Pixel 2 等设备上产生,并且适用于其他 Android 手机。

我有一个包裹在 Touchable 下的 webview(播放视频),如下所示:

当我单击 webview 时,它根本无法识别触摸。

如果我删除 TouchableWithoutFeedback,它工作得很好。

当点击 webview 时,我需要有 touchable 以获取有关其 onPress 事件的一些数据。

这是风格 - styles.newsVideo

我已经尝试过其他帖子中建议的 onStartShouldSetResponder、pointerEvents 等道具。他们都没有为我工作。真的很感谢这里有人的帮助。谢谢

0 投票
0 回答
128 浏览

react-native - 处理 ReactNative 屏幕上呈现的长文本中每个单词的按下事件

  1. 我有一个长文本(例如,某本书的一部分),我需要在屏幕上呈现它,但我需要每个单词来处理触摸。在触摸时,我想显示这个词的翻译。有没有比将每个单词包装在一个可触摸组件中更有效的方法来做到这一点?

  2. 我希望能够选择几个单词并查看这些单词的翻译。如果我们将每个单词都包装在 touchable 中,有没有办法在 ReactNative 中做到这一点?

0 投票
1 回答
2396 浏览

react-native - 滚动时禁用 TouchableOpacity 突出显示

我想在 FlatList 或 ScrollView 内滚动时禁用 TouchableOpacity 的突出显示。onPress 在滚动时没有触发,只是触发了高亮效果。

我试过 delayPressIn 但它只会延迟 onPress 时间而不是突出显示效果。

0 投票
0 回答
965 浏览

react-native - 在 Flatlist 内滚动时,TouchableOpacity 突出显示

在此处输入图像描述

我在 Flatlist 的行项内呈现了 TouchableOpacity。我想在用户单击该项目时显示单击效果。但是,当用户开始滚动时,也会触发点击效果。用户滚动时如何禁用突出显示效果?

0 投票
2 回答
4932 浏览

android - vertical ScrollView with wrapped row in React Native

I'm new to React Native, and struggling to get my ScrollView working.

I'm trying to have a vertically scrollable list of TouchableOpacity components that are arranged in pairs across the page, e.g.

view arrangement

This is how the app looks when I wrap the TouchableOpacity components in a View, but (obviously) it is not scrollable. If I change the View to a ScrollView, the components are no longer arranged correctly, they now look like this:

Broken ScrollView

They are still not scrollable, and also the layout is no longer working correctly.

So far (and there may be a better way of achieving this?) I've attempted to create my layout by setting the container to have flexDirection: row, with wrap turned on, and sizing the sub components appropriately to fit two across the screen.

Approximation of the code i'm using is:

0 投票
1 回答
639 浏览

android - React Native marginTop 在 TouchableOpacity 中偏移文本位置

所以我刚刚开始在 React Native 中开发并遇到这个问题,由于某种原因,当我尝试将 marginTop 设置为可触摸不透明度时,我的文本不会与可触摸不透明度一起“移动”。这就是我的意思:

在此处输入图像描述

这变成:

在此处输入图像描述

相关代码如下(第二张图)。对于第一张图片,代码完全相同,只是没有marginTop。这里是:

0 投票
4 回答
1875 浏览

react-native - 如何在 react native 中使用 gridview 构建主屏幕?

我需要在 react-native 中构建一个带有网格视图的主屏幕。该网格视图应包含四个图像按钮。每个图像按钮应重定向到不同的页面。我正在使用 react-native-super-grid 包。

0 投票
0 回答
4433 浏览

reactjs - 反应本机 TouchableOpacity 不能与里面的图标一起工作

我有一个项目,我想在其中添加一个带有图标“+”的按钮,但是可触摸的不透明度不能作为按钮工作,我单击它,并且不会产生不透明度,并且我 console.log() ,查看按钮是否正常工作,只有不透明度反馈是问题,但不能正常工作。

这是我的渲染:

0 投票
1 回答
10840 浏览

reactjs - 如何在 Text ReactNative 中包含 TouchableOpacity

嗨,我想将 TouchableOpacity 包装在 Text 中,因为我想让一些文本可点击。当我将所有内容包装在 Text 中时,它看起来很完美,这就是我想要的样子。

当我添加 TouchableOpacity 它不起作用。

我尝试在视图中添加它,然后它工作正常,我可以添加 TouchableOpacity 但从 UI 角度来看,它们没有正确对齐。

这是仅显示 Text 的屏幕截图,其中 TouchableOpacity 不起作用,第二位位于 TouchableOpacity 起作用但看起来不正确的视图中。

在此处输入图像描述

如何使它看起来像第一个位。非常感谢任何建议。

谢谢R

0 投票
3 回答
8263 浏览

javascript - 在本机反应中隐藏按钮

我想隐藏 Sign Up 并且我使用了 的disable属性,TouchableOpacity但它似乎不起作用

但是注册按钮没有隐藏

在此处输入图像描述

我的代码: