Schaltfläche ändern Farbe reagieren nativen

Möchte ich einfach ändern Sie die Farbe der Schaltfläche, aber ich kann nicht. Ich habe versucht zu ändern, direkt in der Taste, und übergeben Sie einen Stil, um ihn. Aber keiner von Ihnen arbeitete.
Hier mein sehr einfacher code.

 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',
  }

});
InformationsquelleAutor Gisa | 2017-01-20
  1. 23

    Reagieren Button Komponente rendert die nativen Taste auf jeder Plattform, die es verwendet. Weil dieses, es reagiert nicht auf die style prop. Es hat seine eigene Reihe von Requisiten.

    Den richtigen Weg, es zu benutzen gewesen wäre

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

    Können Sie finden Sie in der Dokumentation zu https://facebook.github.io/react-native/docs/button.html

    Nun, sagen Sie, dass Sie tun wollen, um super-anpassbare Taste, die Sie verwenden müssen, Ansichten und greifbar Deckkraft. Etwas entlang der Linien von diesem.

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

    Werden Sie wrap up in Ihre eigenen button-Komponente und verwenden Sie es.

    • color='#ff5c5c' change background color in android. Wie kann ich den text ändern Farbe, schriftart und Größe?
    • Es gibt hier ein problem. Android nimmt den "color=" und macht es den button Hintergrundfarbe (überschreiben backgroundColor: im stylesheet). Während iOS nimmt den "color=" und lässt es die Farbe für den text und verwendet die Hintergrundfarbe entsprechend in der style-sheet. Dies macht es sehr schwierig, eine einzige code-set behandeln alle Tasten richtig.
    InformationsquelleAutor Kevin Velasco
Schreibe einen Kommentar