Stack Overflow
Stack Overflow

Questions tagged [touchableopacity]

React Native wrapper for making views respond properly to touches. On press down, the opacity of the wrapped view is decreased, dimming it.

React Native wrapper for making views respond properly to touches. On press down, the opacity of the wrapped view is decreased, dimming it.

Opacity is controlled by wrapping the children in an Animated.View, which is added to the view hierarchy. Be aware that this can affect layout.

Docs: https://facebook.github.io/react-native/docs/touchableopacity.html

285 questions
53
votes
28 answers

React native TouchableOpacity onPress not working on Android

TouchabelOpacity works fine on iOS but the onPress method does not work on Android for me. My react-native version: 0.57.4 My code: const initDrawer = navigation => ( …
user3653164
  • 979
  • 1
  • 8
  • 24
30
votes
8 answers

How to disable highlighting effect of TouchableOpacity when scrolling?

{contentData[i].name}

{contentData[i].description} …
Henok Tesfaye
  • 8,287
  • 13
  • 47
  • 84
25
votes
4 answers

Stacked TouchableOpacity inside another TouchableOpacity is not clickable

Even though this document (https://facebook.github.io/react-native/docs/gesture-responder-system.html) states, that touch events are passed down to the children and are only consumed by a parent, if the child doesn't react on the event, I face the…
moritzschaefer
  • 681
  • 1
  • 8
  • 18
24
votes
1 answer

How to include TouchableOpacity within Text ReactNative

Hi I want to wrap TouchableOpacity within a Text as I want to make some of the text clickable. When I wrap everything within a Text it looks perfect and that is how I want it to look.
BRDroid
  • 3,920
  • 8
  • 65
  • 143
24
votes
1 answer

Set opacity's volume onPress of TouchableOpacity manually in React-Native

I am trying to figure out how to change the volume of the opacity of TouchableOpacity component of React-Native, meaning that I do not like the default value of the opacity when the press is performed, and I would like the opacity to be less…
Eduard
  • 8,437
  • 10
  • 42
  • 64
18
votes
5 answers

Dynamic Opacity not changing when component rerenders in react native

I'm starting to learn React Native, and for my project I created a simple Button component to reuse in my project. I set the opacity value dynamically according to the variable 'disabled', however, the look of the button is not changing with the…
otavio1992
  • 712
  • 2
  • 6
  • 18
15
votes
1 answer

Create "Raised" or Shadow effect on TouchableOpacity: React Native

I use react-native-elements, and they make it easy to make an actual button appear "raised", or shadowed. I want to duplicate this look for TouchableOpacity. Here's an example of the "raised buttons" with react-native-elements. It is subtle, but…
tman091
  • 483
  • 1
  • 6
  • 17
15
votes
4 answers

React Native TouchableOpacity not updating styles

I have a strange issue with the TouchableOpacity component. I have a MainButton component which takes 2 props, item and disabled. Based on the the disabled prop I want my MainButton component to apply a different style. The problem is when the…
Zolve
  • 514
  • 5
  • 13
12
votes
1 answer

How to resize TouchableOpacity according to the component present inside it?

I'm using TouchableOpacity to make a button as I'm learning react-native. But the problem is, TouchableOpacity takes 100% width of the screen. But, I want to take the size/grow with the component present inside it. How can I do it? import React, {…
ssh
  • 491
  • 1
  • 8
  • 19
11
votes
3 answers

How do I disable the touch of a child element in Touchable Component

I have following code this.setState({displayVideoModal: false})}>
Ibrahim Azhar Armar
  • 25,288
  • 35
  • 131
  • 207
10
votes
1 answer

Disable TouchableOpacity highlighting when scrolling

I want to disable highlighting of TouchableOpacity when scrolling inside of FlatList or ScrollView. onPress did not trigger when scrolling, it is just the highlighting effect that got triggered. I've tried delayPressIn but it only delay the onPress…
Henry
  • 153
  • 2
  • 7
9
votes
1 answer

onPress() function of TouchableOpacity does not work at first if the keyboard is open

I have used TouchableOpacity as my submit button, after filling the form(Login/Registration/...) when I click on submit button(TouchableOpacity), the keyboard hides (if open), and then I need to press again on submit button and then the onPress…
Anukool
  • 732
  • 1
  • 9
  • 21
8
votes
3 answers

TouchableOpacity onPress not working on Android

I have 3 simple react components- First the actual view(let us name this screen A)- return( …
Mayank Baiswar
  • 605
  • 6
  • 20
7
votes
4 answers

Image with TouchableOpacity onpress not working in react native

I am new to react native development. In my application in one screen I have image click. So i have taken image inside touchable opacity and wrote onpress method to that touchable opacity. But onpress is not working. But i have written the same code…
rams
  • 1,558
  • 7
  • 25
  • 48
7
votes
2 answers

Style breaks when using TouchableOpacity instead of TouchableWithoutFeedback

Here's how this part looks using TouchableWithoutFeedback And here is the same thing, except with TouchableOpacity The code for this part: …
BoredBurrito
  • 101
  • 2
  • 5
1
2 3
…
18 19