React原生纸质日期DatePickerInput模态定制

问题描述 投票:0回答:1

我正在网络上使用 React Native 开发,使用 react-native-paper-dates 在网站上显示 DatePickerInput,并且能够自定义日期输入的颜色 - 但不能自定义出现的模态日期选择器其中。

import { View } from '@gluestack-ui/themed'
import React from 'react'
import { DatePickerInput } from 'react-native-paper-dates'
import { CalendarDate } from 'react-native-paper-dates/lib/typescript/Date/Calendar'
import { SafeAreaProvider } from 'react-native-safe-area-context'

const DatePicker = ({ amountOfMonths = 3 }: { amountOfMonths?: number }) => {
    const [inputDate, setInputDate] = React.useState<CalendarDate>()
    
    return (
        <SafeAreaProvider>
            <View>
                <DatePickerInput
                    placeholder="XX/XX/XXXX"
                    placeholderTextColor={appliedColors.inputPlaceholderColor}
                    endYear={new Date().getFullYear() + 1}
                    startWeekOnMonday
                    iconColor={colors.darkCantaloupeGreen}
                    activeOutlineColor={colors.darkCantaloupeGreen}
                    selectionColor={colors.darkCantaloupeGreen}
                    textColor={colors.darkCantaloupeGreen}
                    outlineColor={appliedColors.inputBorderColor}
                    locale="en"
                    value={inputDate}
                    onChange={(d) => setInputDate(d)}
                    inputMode="start"
                    validRange={{
                        startDate: new Date(),
                        endDate: new Date(
                            new Date().setMonth(
                                new Date().getMonth() + amountOfMonths
                            )
                        ),
                    }}
                />
            </View>
        </SafeAreaProvider>
    )
}

export default DatePicker

我已经尝试了所有道具,包括名称中的“...颜色”和主题道具。 浏览了我能找到的所有类型声明,没有任何对我有用的。

我承认React本机纸张日期DatePickerInput自定义问题存在,但它从未得到有效的答案,并且它引用了一个android实例。

有没有办法改变模态“主”颜色?

实时结果示例: Current working input colors Current modal colors

react-native react-native-paper
1个回答
0
投票

我发现真正有效的唯一选择是安装react-native-paper,使用他们的PaperProvider并传递一个主题。

© www.soinside.com 2019 - 2024. All rights reserved.