Question

我试图找出如何更改React-Native的TouchableOpacity组件的不透明度的音量，这意味着我不喜欢执行印刷时的不透明度的默认值，并且我希望不透明度为不太透明。

通过将子项包装在Animated.View中来控制不透明度，Animated.View将添加到视图层次结构中。请注意，这可能会影响布局。

所以，我做到了，它看起来如何：

<Animated.View style={{ opacity: this.state.opacity._value }}>
    <TouchableOpacity 
        onPress={this.hideKeyboard.bind(this)}
        style={{ opacity: this.state.opacity._value }}
    >
        <Text style={buttonTextStyle}>Cancel</Text>
    </TouchableOpacity>
</Animated.View>

在onPress上调用的 hideKeyboard 方法会调用其中的 changeOpacity 方法，以及它的外观：

changeOpacity() {
    Animated.timing(
        this.state.opacity, 
        {
            toValue: this.state.opacity === 1 ? 0 : 1,
            duration: 500
        }
    ).start();
}

this.state.opacity 在构造函数中声明：

constructor(props) {
    super(props);
    this.state = { opacity: new Animated.Value(1) };
}

完成所有这些后，行为（不透明度onPress of TouchableOpacity的音量）不会改变，它仍然保持默认。该文档还模糊地介绍了setOpacityTo方法，但由于文档中提供的描述的全面性，我无法弄清楚如何使用它。如何执行不透明度的手动配置？

Answer 1

你试过这个吗？

<TouchableOpacity 
  activeOpacity={.7} // default is .2
  ... other props here
/>

在React-Native

1 个答案: