diff --git a/DatePickerAndroid.js b/DatePickerAndroid.js index 8794125..8d31322 100644 --- a/DatePickerAndroid.js +++ b/DatePickerAndroid.js @@ -5,26 +5,36 @@ const NativeDatePicker = requireNativeComponent(`DatePickerManager`, DatePickerA class DatePickerAndroid extends React.Component { - static defaultProps = { + static defaultProps = { mode: 'datetime', minuteInterval: 1, - }; - - _onChange = e => this.props.onDateChange(new Date(parseInt(e.nativeEvent.date))); - _maximumDate = () => this.props.maximumDate && this.props.maximumDate.getTime(); - _minimumDate = () => this.props.minimumDate && this.props.minimumDate.getTime(); + }; + render = () => ( ) + + _onChange = e => this.props.onDateChange(new Date(parseInt(e.nativeEvent.date + this._getOffsetMillis()))); + _maximumDate = () => this._toUnixMillisWithTimeZoneOffset(this.props.maximumDate); + _minimumDate = () => this._toUnixMillisWithTimeZoneOffset(this.props.minimumDate); + _date = () => this._toUnixMillisWithTimeZoneOffset(this.props.date); + _toUnixMillisWithTimeZoneOffset = date => date && this._toUnixMillis(date) - this._getOffsetMillis(); + _toUnixMillis = date => date.getTime() + + _getOffsetMillis = () => this.props.timeZoneOffsetInMinutes === undefined ? 0 + : -toMs(this.props.timeZoneOffsetInMinutes + new Date().getTimezoneOffset()) + } +const toMs = minutes => minutes * 60 * 1000 + const styles = StyleSheet.create({ picker: { width: 310, diff --git a/README.md b/README.md index d3fcd8b..3418ccb 100644 --- a/README.md +++ b/README.md @@ -68,6 +68,8 @@ minuteInterval | The interval at which minutes can be selected. | Datetime mode iosdate mode iostime mode ios|date mode androiddatetime mode androidtime mode android | locale | The locale for the date picker. Changes language, date order and am/pm preferences. Value needs to be a Locale ID.| React Native Date picker locale language ios|React Native Date picker locale language android textColor | Changes the text color. | text color background color ios|Text color background color android +timeZoneOffsetInMinutes | Timezone offset in minutes (default: device's timezone) + | ## About 📅   React Native Date Picker is a cross platform component working on both iOS and Android. It uses the slightly improved DatePickerIOS on iOS and a custom picker on Android which has similar look and feel. The datetime mode might be particulary interesting if you looking for a way to avoid two different popup pickers on android. diff --git a/example/src/PropButton.js b/example/src/PropButton.js new file mode 100644 index 0000000..67bf92c --- /dev/null +++ b/example/src/PropButton.js @@ -0,0 +1,4 @@ +import React, { Component } from 'react'; +import { Button } from 'react-native'; + +export const PropButton = ({ title, value, onChange }) =>