<!-- prettier-ignore --> | iOS | Android | | --- | --- | | <img src="./screenshots/iOS.png" width="300" /> | <img src="./screenshots/Android.png" width="300" /> |
npm install react-native-simple-time-picker
| iOS | Android |
| --- | --- |
|
|
|
Simple wrapper component on @react-native-picker/picker.
``React Native
npm install react-native-simple-time-picker @react-native-picker/picker
npx pod-install
Usage
`tsx
import React from 'react';
import {TimePicker, ValueMap} from 'react-native-simple-time-picker';const YourApp = () => {
const [value, setValue] = useState({
hours: 1,
minutes: 0,
seconds: 0,
});
const handleChange = (newValue: ValueMap) => {
setValue(newValue);
};
return ;
};
`Props
| Property | Type | Default | Description |
| ---------------- | -------------------------- | ---------------------- | -------------------------------------------------------------------------------------------- |
| value |
{ hours: number, minutes: number, seconds: number, ampm?: 'am' \| 'pm' } | { hours: 0, minutes: 0, seconds: 0 } | Controlled state |
| defaultValue | { hours: number, minutes: number, seconds: number, ampm?: 'am' \| 'pm' } | { hours: 0, minutes: 0, seconds: 0 } | Controlled state |
| onChange | Function | | Callback function for when values are changed ({ hours: number, minutes: number }) => void |
| pickerShows | Array | ["hours", "minutes"] | Pickers to display (e.g. ["hours", "minutes", "seconds"]`) |https://snack.expo.io/@uraway/react-native-simple-time-picker
MIT