Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/ssh/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
React native 应用变换动画时,TouchableOpacity不起作用_React Native_Animation_Transform_Touchableopacity - Fatal编程技术网

React native 应用变换动画时,TouchableOpacity不起作用

React native 应用变换动画时,TouchableOpacity不起作用,react-native,animation,transform,touchableopacity,React Native,Animation,Transform,Touchableopacity,下面的代码是使用变换动画来渲染可触摸的按钮 const { scrollY, headerScrollDistance } = this.state; const profileImageTranslateX = scrollY.interpolate({ inputRange: [0, headerScrollDistance], outputRange: [0, -(ScreenWidth /2) + 32], extrapo

下面的代码是使用
变换
动画来渲染
可触摸的
按钮

    const { scrollY, headerScrollDistance } = this.state;
    const profileImageTranslateX = scrollY.interpolate({
        inputRange: [0, headerScrollDistance],
        outputRange: [0, -(ScreenWidth  /2) + 32],
        extrapolate: 'clamp',
    });

    const profileImageTranslateY = scrollY.interpolate({
        inputRange: [0, headerScrollDistance],
        outputRange: [0, -11],
        extrapolate: 'clamp',
    });

    const profileImageScale = scrollY.interpolate({
        inputRange: [0, headerScrollDistance / 2, headerScrollDistance],
        outputRange: [1, 0.8, 0.6],
        extrapolate: 'clamp',
    });

    return (
        <Animated.View
            style={[
                Styles.animatedView.profileStyle,
                {
                    transform: [
                        { translateX: profileImageTranslateX },
                        { translateY: profileImageTranslateY },
                        { scale: profileImageScale }
                    ]
                }
            ]}
        >
            <TouchableOpacity activeOpacity={0.5} onPress={() => this.props.history.push('./profilePhotoChanger')}>
                <ImageComp profileImageUrl={profileimageurl} imageStyle={Styles.homePageImageStyle} />
            </TouchableOpacity>
        </Animated.View>
    );
const{scrollY,headerscrolldance}=this.state;
const profileImageTranslateX=scrollY.interpolate({
输入范围:[0,headerScrollDistance],
输出范围:[0,-(屏幕宽度/2)+32],
外推:“夹具”,
});
const profileImageTranslateY=scrollY.interpolate({
输入范围:[0,headerScrollDistance],
输出范围:[0,-11],
外推:“夹具”,
});
const profileImageScale=scrollY.interpolate({
输入范围:[0,headerScrollDistance/2,headerScrollDistance],
输出范围:[1,0.8,0.6],
外推:“夹具”,
});
返回(
this.props.history.push('./profilePhotoChanger')}>
);
当页面滚动时,
动画
应用于可触摸按钮。未应用变换动画时,按钮按预期工作。但在应用动画时不工作。若页面恢复到正常状态(即向后滚动),则按钮按预期工作


应用动画时,
react native
中的
TouchableOpacity
onPress
不起作用,这是正常行为吗?或者我的代码有问题吗?

如果对您有效,您可以尝试以下选项之一

1-从“反应本机手势处理程序”导入{TouchableOpacity}

2-将包含TouchableOpacity的动画视图的高度更改为 触摸屏的适配尺寸(不透明度)

3-通过移动