javascript - 如何更改 react native 按钮的背景颜色

Question

我正在尝试更改按钮的背景颜色，但似乎没有任何效果，我尝试了 raised 属性，也许我使用不正确。你们有什么想法吗？

 import React from 'react';
 import { StyleSheet, Text, View, Button, TouchableHighlight } from 'react-native';

export default class App extends React.Component {
state={
  name: "Mamadou"
};

myPress = () => {
  this.setState({
    name: "Coulibaly"
  });
};

  render() {
    return (
      <View style={styles.container}>

          <Button       
          title={this.state.name}
          color="red"
          onPress={this.myPress}
        />   

      </View>

    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },

});

Answer 1

在 iOS 中使用它为按钮添加背景颜色:

样式:

  loginScreenButton:{
    marginRight:40,
    marginLeft:40,
   marginTop:10,
    paddingTop:10,
    paddingBottom:10,
    backgroundColor:'#1E6738',
    borderRadius:10,
    borderWidth: 1,
    borderColor: '#fff'
  },
  loginText:{
      color:'#fff',
      textAlign:'center',
      paddingLeft : 10,
      paddingRight : 10
  }

按钮:

<TouchableOpacity
          style={styles.loginScreenButton}
          onPress={() => navigate('HomeScreen')}
          underlayColor='#fff'>
          <Text style={styles.loginText}>Login</Text>
 </TouchableOpacity>

对于 Android，它仅适用于 Button 颜色属性:

<Button  onPress={onPressAction}  title="Login"  color="#1E6738"  accessibilityLabel="Learn more about this button" />