如何修改react-native-date-picker的默认白色背景色适配主题？

Android 端 #

你之前直接在styles.xml添加android:background的方法无效，因为没有关联到date picker对应的原生弹窗主题。正确步骤如下：

1. 在android/app/src/main/res/values/styles.xml中创建自定义主题：

<style name="CustomDatePickerTheme" parent="Theme.AppCompat.Light.Dialog.Alert">
    <!-- 设置弹窗背景色 -->
    <item name="android:windowBackground">#0BBCED</item>
    <!-- 可选：设置选中日期的高亮颜色 -->
    <item name="colorAccent">#FF9800</item>
</style>

2. 在组件中通过androidTheme属性指定这个自定义主题：

import DatePicker from 'react-native-date-picker';

// 组件内使用
<DatePicker
  androidTheme="@style/CustomDatePickerTheme"
  // 其他必要属性（如onDateChange、date等）
/>

iOS 端 #

iOS端可以直接通过组件的style属性设置背景色：

<DatePicker
  style={{ backgroundColor: '#0BBCED' }}
  // 其他必要属性
/>

如果是模态弹窗样式的date picker，还可以通过modalStyle属性调整弹窗容器的背景：

<DatePicker
  modal
  modalStyle={{ backgroundColor: '#0BBCED' }}
  // 其他必要属性
/>

内容的提问来源于stack exchange，提问作者Manali Tailor