You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

4.6 KiB

React Native Date Picker

npm packageReact Native Date Picker

This is a React Native Date Picker with following main features:

📱 Supporting iOS and Android
📅 3 different modes: Time, Date, DateTime
🌍 Multiple languages
🎨 Customizable

iOS Android
React Native Date Picker IOS React Native Date Picker Android
A slightly improved DatePickerIOS. A custom made native component.

Installation

  1. npm install react-native-date-picker-x --save or yarn add react-native-date-picker-x
  2. react-native link

Minimal Example

import React, { Component } from 'react';
import DatePicker from 'react-native-date-picker-x';

export default class App extends Component {

  state = { date: new Date() }

  render = () =>
    <DatePicker
      date={this.state.date}
      onDateChange={date => this.setState({ date })}
    />

}

Properties

Prop Description Screenshots iOS Screenshot Android
date The currently selected date.
onDateChange Date change handler
fadeToColor Android picker is fading towords this background color. {color, 'none',}
maximumDate Maximum selectable date.
minimumDate Minimum selectable date
minuteInterval The interval at which minutes can be selected. Date picker minute interval IOS Date picker minute interval Android
mode The date picker mode. {'datetime', 'date', 'time'} 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

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.

Roadmap