Material Design Date Picker For React Native

An easy Material Design inspired date picker component for React Native.

Install & Import:

# Yarn
$ yarn add react-native-material-date-picker

# NPM
$ npm i react-native-material-date-picker –save

import { ModalDatePicker } from “react-native-material-date-picker”;

Basic Usage:

const App = () => {
  return (             
      <View style={{flex: 1, alignSelf: 'stretch'}}>
        <ModalDatePicker 
            button={<Text> Open </Text>} 
            locale="tr" 
            onSelect={(date) => console.log(date) }
            isHideOnSelect={true}
            initialDate={new Date()}
            language={require('./locales/en.json')}. # Your localization file
        />             
      </View>
  );
};

Default configs:

locale?: string,
color?: string,
onSelect?: (date: Date) => void,
onForward?: (date: Date) => void,
onBack?: (date: Date) => void,
onHidden?: () => void,
button?: React.ReactNode,
style?: any,
isHideOnSelect?: boolean,
initialDate?: Date,
language?: any

Preview:

Material Design Date Picker For React Native

Download Details:

Author: ilkerkesici

Live Demo: View The Demo

Download Link: Download The Source Code

Official Website: https://github.com/ilkerkesici/react-native-material-date-picker

License: MIT

You Might Be Interested In:

Add Comment