UNPKG

react-native-year-month-pickers

Version:

This React-Native component library provides a seamless month and year picker for both Android and iOS platforms.

86 lines (60 loc) 2.78 kB
# react-native-year-month-pickers This React-Native component library provides a seamless month and year picker for both Android and iOS platforms. ## Examples <p align="left"> <img width=220 title="Screenshot-1" src="https://github.com/solutiontechseries/react-native-year-month-pickers/blob/master/assets/screenshot-1.png"> <img width=220 title="Screenshot-2" src="https://github.com/solutiontechseries/react-native-year-month-pickers/blob/master/assets/screenshot-2.png"> </p> # Install ## Step 1 ```bash npm i react-native-year-month-pickers --save ``` or ```bash yarn add react-native-year-month-pickers ``` ## Step 2 ### iOS ```bash cd ios pod install ``` ## Usage Import library ```javascript import YearMonthPicker from "react-native-year-month-pickers"; ``` Create required state variables ```javascript const [showPicker, setShowPicker] = useState(false); const [monthYear, setMonthYear] = useState(""); ``` Usage of the Month and Year value picker ```javascript <View> <Button title={"Show Date Picker"} onPress={() => setShowPicker(true)} /> <YearMonthPicker show={showPicker} value={monthYear} onClose={() => setShowPicker(false)} onDone={(date) => { setMonthYear(date); setShowPicker(false); }} /> </View> ``` ### Request Object | Property | Required | Type | Description | | --------------- | :------- | :------------------- | :-------------------------------------------------------------------------------------------------------------- | | `show` | **Yes** | bool (default false) | Show or Hide year month picker | | `value` | **Yes** | string (default '') | Selected date or empty string to show today's date | | `animationType` | **No** | string | This props used to show picker animation type like a Model acceptable values are `fade`, `slide` and `none` | | `primaryColor` | **No** | string | A string color value of the picker | | `onClose` | **Yes** | function | A callback function when hardware back button pressed in android or `Cancel` button pressed to close the picker | | `onDone` | **Yes** | function | A callback function called when `Done` button pressed in picker and return a selected date as function argument | ## Sponsors Support this project by becoming a sponsor. Your logo will show up here with a link to your website. ## License _MIT_