How do i change the color of my alert in react native

问题

How do i change the background color, font size of my alert box in react native? I put my alert after a button is clicked. I don't know how to style this one, Thanks for the help

Alert.alert(
  'Plate',
  'Plate has been sent for printing!',
  [
    {text: 'OK', onPress: () => console.log('OK Pressed')},
  ],
  { cancelable: false }
)

回答1:

1. Open android/app/src/main/res/values/styles.xml
2. Add <item name="colorAccent">#000000</item> inside <style> tag.

You will get this:

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="colorAccent">#000000</item>
    </style>
</resources>

This will change color over whole app (alerts, calendars, etc.)

回答2:

You can use this library React-Native_DropDown-Alert. Its highly customizable library with predefined styles for differnet types of alerts. The code would go like this.

    <View>
          // !!! Make sure it's the last component in your document tree.
          <DropdownAlert
            ref={(ref) => this.dropdown = ref}
            onClose={(data) => this.onClose(data)} />
        </View>

// ...
handleRequestCallback(err, response) {
  if (err != null) {
    this.dropdown.alertWithType('error', 'Error', err)
  }
}
// ...
onClose(data) {
  // data = {type, title, message, action}
  // action means how the alert was dismissed. returns: automatic, programmatic, tap, pan or cancel
}
// ...

来源：https://stackoverflow.com/questions/44666119/how-do-i-change-the-color-of-my-alert-in-react-native