In Native Android, we can change the button color in Alert Dialog as mentioned here.

How to perform similar styling for Alert in React Native?

Here is my code for Alert:

Alert.alert(
    'Alert Title',
    'Alert Message / Description?',
    [
        { text: 'No', onPress: () => this.actionNo() },
        { text: 'Yes', onPress: () => this.actionYes() }
    ],
    { cancelable: false }
);

Note: This is not duplicate. Here I've asked about how to use Alert dialog styling, without changing the implementation to Model.

In Native Android, we can change the button color in Alert Dialog as mentioned here.

How to perform similar styling for Alert in React Native?

Here is my code for Alert:

Alert.alert(
    'Alert Title',
    'Alert Message / Description?',
    [
        { text: 'No', onPress: () => this.actionNo() },
        { text: 'Yes', onPress: () => this.actionYes() }
    ],
    { cancelable: false }
);

Note: This is not duplicate. Here I've asked about how to use Alert dialog styling, without changing the implementation to Model.

• javascript
• android
• react-native

• Possible duplicate of how do I style an Alert element in react-native? – Ashish Yadav Commented Sep 6, 2019 at 4:16
• Reason for downvote? – Gokul Nath KP Commented Sep 6, 2019 at 5:13
• I am not the one who downvoted. – Ashish Yadav Commented Sep 6, 2019 at 9:45

1 Answer 1

I was going through the same thing and I found a way to style it. in styles.xml add:

In AppTheme add:

<item name="android:alertDialogTheme">@style/AlertDialogTheme</item>

Then:

<style name="AlertDialogTheme" parent="Theme.AppCompat.Dialog.Alert">
    <item name="android:background">#00397F</item>
    <item name="android:colorPrimary">#00397F</item>
    <item name="android:colorAccent">#0AAEEF</item>
    <item name="android:buttonBarNegativeButtonStyle">@style/NegativeButtonStyle</item>
    <item name="android:buttonBarPositiveButtonStyle">@style/PositiveButtonStyle</item>
</style>

<style name="NegativeButtonStyle" parent="Widget.AppCompat.Button.ButtonBar.AlertDialog">
    <item name="android:textColor">#F0A90F</item>
</style>

<style name="PositiveButtonStyle" parent="Widget.AppCompat.Button.ButtonBar.AlertDialog">
    <item name="android:textColor">#F0A90F</item>
</style>

Play with it and add more customized values as needed.