Styling Possibilities for Datepicker Field

Question

Hi,

we have recently implemented the datetimepicker module and we like it a lot. One thing we are now facing is the challenge to somehow style the component that shows the date.

We would like to style it as all our input fields ( border, backgroundColor, fontColor and even enrich it with a calendar icon )

Is there any way to use a custom component ( like a textLink, an styled inputfield or anything ) to show the Calendar or can it only be triggered by using the

<DateTimePicker
          testID="dateTimePicker"
          value={date}
          mode={mode}
          is24Hour={true}
          display="default"
          onChange={onChange}
        />

A very simple example would help i guess.

[ravirajn22]

Use display: 'inline' for iOS this will show the picker directly on screen, now design your input fields the way you want, then onPress show this DateTimePicker in a modal or whatever way you want.

[vonovak]

Hello and thanks for asking, to the best of my knowledge, changing the styles of the provided compact picker is not possible, the native component does not offer much styling possibilities. You’ll have to resort to workarounds. Thank you 🙂