expo-datepicker

expo-datepicker is a beautiful and simple datepicker for react native and expo

DEMO

Installation

1npm i expo-datepicker
2yarn add expo-datepicker

Example

1import React, { useState } from "react";
2import { StyleSheet, Text, View, ViewStyle } from "react-native";
3import DatePicker from "expo-datepicker";
4import { Entypo } from "@expo/vector-icons";
5export default function App() {
6  const [date, setDate] = useState(new Date().toString());
7
8  return (
9    <View style={styles.container}>
10      <DatePicker
11        date={date}
12        onChange={(date) => setDate(date)}
13        icon={<Entypo name="chevron-right" size={40} color="#689CA3" />}
14      />
15    </View>
16  );
17}
18
19const styles = StyleSheet.create({
20  container: {
21    flex: 1,
22    backgroundColor: "#fff",
23    alignItems: "center",
24    justifyContent: "center",
25  },
26});

Properties

Property	Description
date	Current date selected
icon	Icon
fontStyle	Input text style
containerStyle	Container Style
backgroundColor	Input background color
borderColor	Change border color
inputDayStyle	Change style day input
inputMonthStyle	Change Style month input
inputYearStyle	Change style year input
inputStyle	Change style of all input
itemStyleModal	Change style item modal
modalBackgroundColor	Change modal background
selectedColor	Change color item modal
selectedTextColor	Change text color item
textStyleModal	Change text style item

Events

Property	Description
onChange	(date:string)=>void

License

MIT

Free Software, Hell Yeah!