zmiana koloru przycisku reaguje natywnie

Question

Chcę po prostu zmienić kolor przycisku, ale nie mogę. Próbowałem zmienić bezpośrednio w przycisk i przekazać mu styl. Ale żaden z nich nie zadziałał. Oto mój bardzo prosty kod.

export default class Dots extends Component { 
    render() { 
    return (
     <Image style={styles.container} source={require('./background3.png')}> 
     <Button title='play' style = {{color:'red'}}/> 
     </Image> 
    ); 
    } 
} 

const styles = StyleSheet.create({ 
    container: { 
    flex:1, 
    backgroundColor:'transparent', 
    resizeMode:'cover', 
    justifyContent:'center', 
    alignItems:'center', 
    width:null, 
    height:null 
    }, 

    button:{ 
    backgroundColor:'#ff5c5c', 
    } 

}); 

Answer 1

Reagujący komponent Button renderuje przycisk natywny na każdej platformie, z której korzysta. Z tego powodu nie reaguje na podpórkę style. Ma własny zestaw rekwizytów.

Prawidłowy sposób na wykorzystanie byłoby

<Button color='#ff5c5c` title='I'm a button! />

można znaleźć w dokumentacji tutaj https://facebook.github.io/react-native/docs/button.html

Teraz mówisz, że chcesz, aby przycisk bardzo konfigurowalny, za które będziesz muszą używać widoków i nieprzezroczystości, które można dotknąć. Coś w tym stylu.

<TouchableOpacity onPress={...}> 
    {... button markup} 
</TouchableOpacity> 

Zawiniesz to we własnym komponencie przycisku i użyjesz go.