React Native Touchables
Touchable components provide the capability to capture the tapping functionality. If the basic button does not look right for your app, you can use touchables components as there alternative. Using these components, you build your own button. Tapping on these components, you can display the feedback.
The touchables components do not provide any default styling, so you will need to do your style for presenting nicely in your app.
Types of Touchable Components
There are four touchable components provided by React Native. Selection of this component depends on what kind of feedback you want to provide:
React Native TouchableHighlight
The TouchableHighlight can be used anywhere you would use a button or link on the web. The background becomes dark on pressing this component.
React Native TouchableNativeFeedback
The TouchableNativeFeedback makes a view to response properly to touch. This component works only on Android operating system. It uses native state drawable to display the touch feedback.
It supports only a single View instance as a child node. It is implemented by replacing that View with another instance of RCTView node.
React Native TouchableOpacity
The TouchableOpacity wrapper is used to reduce the opacity of the button. It allows the background to be seen while the user presses down. The opacity of button will be controlled by wrapping the children in an Animation.
React Native TouchableWithoutFeedback
The TouchableWithoutFeedback is used when the user wants to handle the tap functionality but doesn't want to display any feedback.
Some time user presses a view and holds it for the set of time. This long press is handled by the function using onLongPress props of any of the above "Touchable" components.
React Native Touchables Example