How to change Alert button color in React Native?

Question

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.

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.