vlad-doru/react-native-calendar-datepicker

React-Native cross-platform, calendar component.

react-native-calendar-datepicker's Issues

Multiple Dates select

Salut, ( Hi )
I was wondering if there is any chance to get a multiple dates select ?
Either by swapping or by tapping on each date.

Any ideas ?
Cool module tough

Adding or subtracting a year from current one.

Hi,
I'm going to customize this library. I don't want change year after changing slider. It also feel be good way for adding and subtracting a year from current.

I added two button on top of calendar bar in Calendar class.

`<View style={{flexDirection: 'row',backgroundColor:'#d8d8d8'}}>

      <Awesome name='angle-left' onPress={()=> this._previousYear()} size={30} color='#000' style={styles.iconLeft}/>

      <TouchableHighlight
          activeOpacity={this.state.stage !== YEAR_SELECTOR ? 0.8 : 1}
          underlayColor={barStyle ? barStyle.backgroundColor : 'transparent'}
          style={[styles.barView, this.props.barView]}>
        <Text style={this.props.barText}>
          {this._stageText()}
        </Text>
      </TouchableHighlight>

      <Awesome name='angle-right' onPress={()=> this._nextYear()} size={30} color='#000'  style={styles.iconLeft}/>
    </View>`

I want when i tap on next and previous button i need to change year calendar view. I tried a lot but no luck. If you have any way please let me know.

when trying to swipe from month to month it jumps back to current month

from 10 tries only once got a jump from 1 month to next one

with this guesture:

It just slides and jumps back, you have to slide quite heavily to actually jump to next month.

Use ViewPropTypes instead of View.propTypes, as it is deprecated. Fall back if not available.

import { View, ViewPropTypes as RNViewPropTypes } from 'react-native';

const ViewPropTypes = RNViewPropTypes || View.propTypes;

export default ViewPropTypes;

Thanks!

What is the minimum compatible React Native version?

The title is self explanatory, but it would be nice if you mentioned it in your README. My team wanted to use this module but we are currently on RN 0.32 and it does not support the flexGrow property and a couple others.
We'll try again once we upgrade RN :)

onPanResponderTerminationRequest cancels day selector swipes too easily

Related to #1 , the pan responder is very janky inside scrollview containers. If the swiping gesture for day selector moves up or down even just a little, enough to activate the scrollview, the day selector swipe cancels. The swiper has to have a very steady hand, therefore.

I found the following line in DaySelector.react.js

onPanResponderTerminationRequest: (evt, gestureState) => true,

and changed true to false

onPanResponderTerminationRequest: (evt, gestureState) => false,

and it seems to have done the trick. Do you see potential problems with this change, or can we have that change implemented in the source?

Showing only month and year

Is it possible to modify this calendar to shown only months and year, i want to modify it to show only months and years like below view

<     2017           >
   Jan   Feb    Mar
   Apr   May    Jun
   Jul   Aug    Sep 
   Oct   Nov    Dec

Does it work on Windows ?

I am looking for a time picker on react native for Windows...
Thanks

ios crash for repeat Text Color Set

DaySelector.react.js in this file ,there are repeat style import ,it could lead to crash In ios .

use custom moment calendar

Hi guys,
Is it possible to use custom moment calendar with this calendar?
For example with this plugin: https://momentjs.com/docs/#/plugins/jalaali/

Invalid Date

I'm using Expo

The example code
<Calendar onChange={(date) => this.setState({date})} selected={this.state.date} // We use Moment.js to give the minimum and maximum dates. minDate={Moment().startOf('day')} maxDate={Moment().add(10, 'years').startOf('day')} />

Says "Invalid date" when I try to run it. My application doesn't break, the calendar just doesn't load.

How to get selected date

Just started using this, works great !

But, i do not have a state object 'date' and the examples are show that (this.state.date).

Ok, it works, but when I try to use it / format it, system says it can't find it :can't find variable date.

What is best practice to use it as a component:

       <Calendar style={styles.calendar} onChange={(date) => this.setState({date})} selected={this.state.date}
       minDate={moment().startOf('day')}
       maxDate={moment().add(10, 'years').startOf('day')}
       />

All good, but again, this.state.date not defined ... if I use something else, it crashes render saying invalid date format.

Thanks !

some grey matter during animation in iOS

Because you use slide animation and there is no option for it, if i add shadow for entire calendar with:

<Calendar
        style={{
          marginTop: 24,
          marginBottom: 24,
          backgroundColor: colors.background,
          shadowColor: "#fff",
          shadowOpacity: 0.4,
          shadowRadius: 2,
          shadowOffset: {height: 0, width: 0},
          alignSelf: 'center',
        }}
...

during animations i see that shadow:

there could be an option to have different animation, like fade or disable animations all together

React Native PropTypes has been moved to a separate package

Since React 16, please

import PropTypes from 'prop-types';

Thanks for an awesome component!

Month doesn't change when swiping

Swipe animation works, but calendar simply goes blank.

I can only change it manually, pressing the top bar and selecting a month.

React native 0.39
Android 7.0

NPM package not up-tp-date

Last PR with the propTypes change hasn't been uploaded to NPM

src/pure/DaySelector.react.js

NPM

/**
* DaySelector pure component.
* @flow
*/

import React, { Component, PropTypes } from 'react';
import {
  Dimensions,
  PanResponder,
  TouchableHighlight,
  LayoutAnimation,
  View,
  Text,
  StyleSheet,
} from 'react-native';

GIT

/**
* DaySelector pure component.
* @flow
*/

import PropTypes from 'prop-types';
import React, { Component } from 'react';
import {
  Dimensions,
  PanResponder,
  TouchableHighlight,
  LayoutAnimation,
  View,
  Text,
  StyleSheet,
} from 'react-native';
import ViewPropTypes from '../util/ViewPropTypes';

How to pass param to highlight the current month?

Hi Bro, I want to hightlight current month in finalStage="month", I pass param selected={moment().startOf('day')}. But not working?