All Projects → maggialejandro → React Native Calendario

maggialejandro / React Native Calendario

Licence: mit
📆 React Native Calendar

Programming Languages

typescript
32286 projects

Projects that are alternatives of or similar to React Native Calendario

Vue Mobile Calendar
a vue component of calendar for mobile移动端vue日期选择组件
Stars: ✭ 194 (-17.09%)
Mutual labels:  calendar
Datepicker
Get a date with JavaScript! A datepicker with no dependencies.
Stars: ✭ 212 (-9.4%)
Mutual labels:  calendar
Calendarview
A highly customizable calendar library for Android, powered by RecyclerView.
Stars: ✭ 2,862 (+1123.08%)
Mutual labels:  calendar
Ember Power Calendar
Powerful and customizable calendar component for Ember
Stars: ✭ 200 (-14.53%)
Mutual labels:  calendar
Dayz
A calendar component for React
Stars: ✭ 210 (-10.26%)
Mutual labels:  calendar
Customizablecalendar
CustomizableCalendar is a library that allows you to create your calendar, customizing UI and behaviour
Stars: ✭ 214 (-8.55%)
Mutual labels:  calendar
Yii2 Tech
Yii2 通用后台管理系统
Stars: ✭ 193 (-17.52%)
Mutual labels:  calendar
Kin Web Client
Desktop Web Client for Kin Calendar.
Stars: ✭ 234 (+0%)
Mutual labels:  calendar
Ymcalendar
Monthly event calendar framework for iOS
Stars: ✭ 212 (-9.4%)
Mutual labels:  calendar
Aaf Easydiary
📘 A diary application optimized for user experience.
Stars: ✭ 216 (-7.69%)
Mutual labels:  calendar
Hotel Datepicker
Date range picker for hotels
Stars: ✭ 202 (-13.68%)
Mutual labels:  calendar
Jbcalendardatepicker
A replacement for UIDatePicker made for Catalyst.
Stars: ✭ 203 (-13.25%)
Mutual labels:  calendar
Kalendar
Full featured, responsive, lightweight calendar in the browser.
Stars: ✭ 213 (-8.97%)
Mutual labels:  calendar
Mxlcalendarmanager
A set of classes used to parse and handle iCalendar (.ICS) files
Stars: ✭ 198 (-15.38%)
Mutual labels:  calendar
React Native Add Calendar Event
Create, view or edit events in react native using the standard iOS / Android dialogs
Stars: ✭ 225 (-3.85%)
Mutual labels:  calendar
Icalendar Generator
Generate calendars in the iCalendar format
Stars: ✭ 193 (-17.52%)
Mutual labels:  calendar
Cornercal
A simple, clean calendar and clock app for macOS.
Stars: ✭ 213 (-8.97%)
Mutual labels:  calendar
Ipoli Android
Fun & Motivational Todo List with Calendar for Android written in Kotlin. Using Redux, coroutines, Firebase and Clean Architecture.
Stars: ✭ 234 (+0%)
Mutual labels:  calendar
Elegantcalendar
The elegant full screen calendar missed in SwiftUI.
Stars: ✭ 224 (-4.27%)
Mutual labels:  calendar
Simple Calendar
A simple calendar with events, customizable widgets and no ads.
Stars: ✭ 2,696 (+1052.14%)
Mutual labels:  calendar

React Native Calendar 📆

Coverlogo

Greenkeeper badge

BuildStatus NPM version npm CodeFactor Codacy Badge

Installation

npm install react-native-calendario --save

Using yarn

yarn add react-native-calendario

Usage

import { Calendar } from 'react-native-calendario';
<Calendar
  onChange={(range) => console.log(range)}
  minDate={new Date(2018, 3, 20)}
  startDate={new Date(2018, 3, 30)}
  endDate={new Date(2018, 4, 5)}
  theme={{
    activeDayColor: {},
    monthTitleTextStyle: {
      color: '#6d95da',
      fontWeight: '300',
      fontSize: 16,
    },
    emptyMonthContainerStyle: {},
    emptyMonthTextStyle: {
      fontWeight: '200',
    },
    weekColumnsContainerStyle: {},
    weekColumnStyle: {
      paddingVertical: 10,
    },
    weekColumnTextStyle: {
      color: '#b6c1cd',
      fontSize: 13,
    },
    nonTouchableDayContainerStyle: {},
    nonTouchableDayTextStyle: {},
    startDateContainerStyle: {},
    endDateContainerStyle: {},
    dayContainerStyle: {},
    dayTextStyle: {
      color: '#2d4150',
      fontWeight: '200',
      fontSize: 15,
    },
    dayOutOfRangeContainerStyle: {},
    dayOutOfRangeTextStyle: {},
    todayContainerStyle: {},
    todayTextStyle: {
      color: '#6d95da',
    },
    activeDayContainerStyle: {
      backgroundColor: '#6d95da',
    },
    activeDayTextStyle: {
      color: 'white',
    },
    nonTouchableLastMonthDayTextStyle: {},
  }}
/>

API

Prop Description Required? Default Type
onChange Callback called when a day is pressed. yes Function
minDate Minimum date that can be selected. no null Date
maxDate Maximum date that can be selected. no null Date
startDate Selected start date no null Date
endDate Selected end date requires startDate null Date
theme Calendar StyleSheet no null ThemeType
locale Calendar language es, en, fr, br 'en' LocaleType
showWeekdays Show Week columns no true boolean
showMonthTitle Show Month title no true boolean
initialListSize FlatList initialNumToRender no 2 number
startingMonth First month to render no current month 'YYYY-MM-DD'
numberOfMonths Number of months to render no 12 number
disableRange Turn off range date selection no false boolean
firstDayMonday Monday as first day of the week no false boolean
monthHeight Change Month row height no 370 number
disabledDays Disabled days no null {[string]: any }
renderDayContent Render custom Day content no null Function
extraData FlatList extraData no null any
viewableItemsChanged handleViewableItemsChange callback no null Function
disableOffsetDays Remove offset Days. no false boolean

License

MIT

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].