CODEWITHSUNDEEP
react-nativetouchableopacity
Jai Sethia
Jai Sethia

Reputation: 81

TouchableOpacity not working inside Animated.View

I am trying to translate a ball from one position (x1,y1) to another (x2,y2). This translation is supposed to take place after clicking the ball.

I am using Animated.View which gets the current position of ball from a state variable. Inside this Animated.View I am wrapping the children using Touchable Opacity. I also looked around in internet and as per my understanding, this problem is related to absolute position of ball (initial and final position of ball is passed as a prop from parent)

<Animated.View style={this.state.position.getLayout()}>
    <TouchableOpacity onPress={()=>console.log('clicked')}>
        <View>
            {this.props.children}
        </View>
    </TouchableOpacity>
</Animated.View>

I am unable to understand why onPress is not getting triggered and also want to know the solution to this problem. Thanks

Upvotes: 4

Views: 1468

Answers (1)

anhtuangv
anhtuangv

Reputation: 575

Use TouchableOpacity from 'react-native-gesture-handler' instead of from 'react-native'.

import { TouchableOpacity } from 'react-native-gesture-handler';

Follow this post Cannot click TouchableOpacity in animated.view using React native

Upvotes: 4

Related Questions