小编典典

更改按钮颜色反应本机

reactjs

我只想更改按钮的颜色,但不能。我试图直接在按钮中进行更改,并为其传递样式。但是他们两个都不起作用。这是我非常简单的代码。

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

});

阅读 276

收藏
2020-07-22

共1个答案

小编典典

react Button组件在其使用的每个平台上呈现本机按钮。因此,它不响应style道具。它有自己的一套道具。

正确的使用方式是

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

您可以在https://facebook.github.io/react-
native/docs/button.html上查看文档。

现在,假设您确实要制作超级可自定义的按钮,因为您必须使用视图和可触摸的不透明度。与此类似。

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

您将把它包装在自己的按钮组件中并使用它。

2020-07-22