TouchableHighlight and TouchableOpacity affect layout on Android
The solution is not to introduce the wrapper view. Simply set the style directly on TouchableHighlight
or TouchableOpacity
:
<TouchableOpacity onPress={this.onClick} style={styles.row_container}>
<Text style={styles.row_text}>
{'I count the number of taps: ' + this.state.clicks}
</Text>
</TouchableOpacity>
To answer the question "is this expected," according to the docs, yes.
https://facebook.github.io/react-native/docs/touchableopacity
"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."