Eventdates not being displayed

[Tuuben]

Hey, i've been trying to add some eventDates to my calendar but the eventIndicators aren't being displayed. Any ideas what the issue might be?

Code:
<Calendar eventDates={['2017-10-05', '2017-11-05', '2017-12-05', '2017-13-05']} nextButtonText={'Next'} prevButtonText={'Prev'} showControls={true} customStyle={calendarStyle} dayHeadings={["SUN", "MON", "TUE", "WED", "THU", "FRI", "SAT"]} />

Style:
const calendarStyle = { eventIndicator: { backgroundColor: 'blue', width: 10, height: 10, }, }

[BrianPflum]

I am having the same issue. There is a flag for event indicators:

showEventIndicators={true}

Doesn't seem to make a difference though. Tried many different things and couldn't get anything to show.

[kesha-antonov]

00ffe9a

This broke "eventDates". How to pass them now? What format?

@christopherdro @noitcudni

[noitcudni]

Yup, I can reproduce the bug. Looking at it now.

[noitcudni]

Submitted a PR. In the meantime you can cherry-pick this commit.
https://github.com/christopherdro/react-native-calendar/pull/135/commits

noitcudni@4ce1445

[christopherdro]

Thanks @noitcudni !

@Tuuben Could you give this a shot and let me know if it worked out for ya?

[Tuuben]

Thank you for the quick response! I tried the changes @noitcudni made to the Calendar.js file but no event indicators are still being displayed in the calendar for me .. anything else im missing here?

@christopherdro

[noitcudni]

@Tuuben You are missing the showEventIndicators attribute.
Also, the date format is in either YYYY-MM-DD or YYYYMMDD format.

[Tuuben]

Oh yeah, thank you very much @noitcudni i got it working now!

[saycchai]

@noitcudni , I used your commit, it can show the events in the middle of the calendar, however, events are not show in the last row of the calendar (I marked '20170530', '20170531' in the event, however the indicator not shown in these 2 days)

`

class RosterScreen extends Component {
render() {
const customDayHeadings = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
const customMonthNames = ['Jan', 'Feb', 'Mar', 'Apr', 'May','Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];

const customStyle = {
  eventIndicator: {
        backgroundColor: 'green',
        width: 10,
        height: 10,
  },
  currentDayCircle: {
    backgroundColor: 'blue',
  }, 
  currentDayText: {
    color: 'blue',
  },     
};

return (
<Calendar
  showEventIndicators
  eventDates={['20170518', '20170519', '20170520', '20170522', '20170523', '20170524', '20170525', '20170526', '20170528', '20170530', '20170531']}
  customStyle={customStyle} 
  dayHeadings={customDayHeadings}
  monthNames={customMonthNames}
  scrollEnabled
  showControls
  titleFormat={'MMMM YYYY'}
  prevButtonText={'Prev'}
  nextButtonText={'Next'}
/>
)

}
}
`

[noitcudni]

OK, I'll take a look over the weekend.

[noitcudni]

@saycchai, I tried it in my dev environment and the events are showing up fine. I just took another look at your screenshot. Looks like you might need to increase your view height?

[saycchai]

@noitcudni, thx for your advice, I will try it out.

[antonbaranov]

@saycchai, I have the same problem. It's because of padding of ScrollView.
Set scrollEnabled={false} in Calendar props and enjoy. :-)