activeOpacity of TouchableOpacity and TouchableHighlight is broken
Closed this issue · 6 comments
The activeOpacity style prop has no effect on a TouchableOpacity or TouchableHighlight. This can be demonstrated using TouchableExample.js from the included examples folder in this project.
Here is a snack with TouchableExample.js pasted in and unchanged.
I am unsure of when this problem started occurring as I am using react-native-popup-menu for the first time recently. Using Expo SDK 34 in my project while I assume snack uses SDK 35. I have not tested activeOpacity with a TouchableHighlight outside of a popup menu, but I do not see any open or closed issues regarding activeOpacity in the React-Native repository.
I have tried your example, it was little bit "non-standard" (menuprovider was not on the top)... so I change it a bit and it looks to work.
https://snack.expo.io/@sodik82/react-native-popup-menu-optiontouchablecomponent-problem
can you check it?
Ah. Thanks so much for your help, and I did forget to add the MenuProvider.
It looks like activeOpacity is not what I thought it was, because I don't see anything different in your example. I would simply like to change the background color or opacity of whatever menu option the user is mousing over. Do you know how to do that? I will close this issue.
are you using react-native-web?
Yes, and I think snack is too but not sure. Is activeOpacity the correct property for what I was talking about, but it only displays on mobile?
active opacity is when you press/long press the option - not the move over.
it works also on web...
Thank you for clarifying. I think that since there isn't equivalent functionality on mobile, I should just use react-hover-observer and hope the overhead isn't that bad. My bad for not realizing TouchableHighlight and TouchableOpacity have no functionality to handle mouseover, just touches.