Kind von TouchableHighlight verliert die Opazität beim Drücken

Question

Wenn ein Kind von TouchableHighlight eine Deckkraft hat, verschwindet seine Deckkraft (wird auf 1 gesetzt), nachdem TouchableHighlight gedrückt wurde.

Lauf Beispiel hier: https://rnplay.org/apps/c0NIjQ

Minimal Beispiel:

<TouchableHighlight onPress={() => {}}> 
    <Text style={{ opacity: 0.5 }}> 
     Press me! 
    </Text> 
</TouchableHighlight> 

Gibt es eine Möglichkeit, dies zu reparieren, oder ist es ein Fehler in der india reagieren?

Answer 1

TouchableOpacity funktioniert so, wie ich es für TouchableHighlight (live code sample) erwartet hätte, daher könnte die Verwendung von TouchableOpacity ein Workaround sein. Hinweis jedoch, dass TouchableOpacity keine Unterlage hat, die erscheint, wenn sie aktiv ist, also was auch immer Sie darunter rendern, ist, was "durchscheint" beim Drücken. Daher ist es kein perfekter Ersatz für TouchableHighlight.

Ich bin nicht sicher, ob das Verhalten von TouchableHighlight bestimmt ist, eine Art eines Kompromisses oder tatsächlich einen Fehler, aber im Code suchen Sie deutlich sehen können, wie es von TouchableOpacity in dieser Hinsicht unterscheidet:

• TouchableHighlight always sets the child's opacity to 1 when it goes inactive.
• TouchableOpacity sets the child's opacity to childStyles.opacity if it is set, otherwise 1, when it goes inactive.

Answer 2

Sie könnten durch die Umsetzung der onPressOut Methode von TouchableHighlight um ihn herum arbeiten, und die Bindung Ihrer Opazität in einen Zustand richtigen ty.

constructor (props) { 
    this.state = {opacity: 0.5} 
} 

render() { 
    return (
    <TouchableHighlight 
     onPressOut={() => this.setState({opacity: 0.5})} 
     opacity={this.state.opacity} 
    > 
     .... 
    </TouchableHighlight> 
); 
} 

Nicht ideal, stimme ich zu.