react-native-calendar-strip icon indicating copy to clipboard operation
react-native-calendar-strip copied to clipboard

Doesn't scroll to selected date on scrolling past a certain no. of months

Open Balthazar33 opened this issue 3 years ago • 5 comments

First of all, thanks for the awesome package.

Here's the issue:

Config:

<CalendarStrip
                            selectedDate={new Date()} //Select current date by default
                            onDateSelected={(e) => {
                                console.log("Date selected", moment(e).format('dddd MM/DD/YYYY'));
                                setSelectedDate(moment(e).format('dddd MM/DD/YYYY'));
                            }}
                            dayComponentHeight={75}
                            scrollable
                            scrollerPaging
                            ref={calendarRef}
                            calendarHeaderFormat='MMMM'
                            style={{ height: 100 }}
                            calendarHeaderStyle={{  }}
                            calendarColor={'#fff'}
                            dateNumberStyle={{  }}
                            dateNameStyle={{ }}
                            highlightDateNumberStyle={{  }}
                            highlightDateNameStyle={{  }}
                            highlightDateContainerStyle={{  }}
                            disabledDateNameStyle={{ color: 'grey' }}
                            disabledDateNumberStyle={{ color: 'grey' }}
                            iconContainer={{ flex: 0.1 }}
                            useIsoWeekday={false}
                            startingDate={moment().day(0)}
                        />

Behaviour: On the press of a button, I'm calling calendarRef.current.setSelectedDate(moment(moment().format('MM/DD/YYYY'), "MM/DD/YYYY"))

This scrolls the calendar to the current date.

However, if I scroll for quite a few months, there's a glitch and then whenever I call the above function, it does not scroll back to the current date.

(Notice the glitch as I'm scrolling towards February [the month shows September/October for a split second])

https://user-images.githubusercontent.com/40452950/134676558-131ca579-fdfc-4504-b0de-dee46bccb026.mp4

Android version: 10 RN version: 0.63.4

Balthazar33 avatar Sep 24 '21 12:09 Balthazar33

I am also having this issue. It seems to have something to do with the scrollers recycling of days. It's the same issue if you call setSelectedDate with a date over half a year ago, it won't scroll to that date. Has anyone come up with a solution?

joeljoeljoeljoel avatar Feb 01 '22 14:02 joeljoeljoeljoel

I am also having this issue. It seems to have something to do with the scrollers recycling of days. It's the same issue if you call setSelectedDate with a date over half a year ago, it won't scroll to that date. Has anyone come up with a solution?

I solved the problem by duplicating the calendarStrip file to my project and changing the value this.numDaysScroll = your value. (You should change imports to this calendarStrip file)

VikBn avatar Feb 20 '22 20:02 VikBn

@Balthazar33 were you able to fix this ?

cpandya231 avatar Mar 02 '22 05:03 cpandya231

I'm having the same issue. Did anyone seem to find a solution?

nkhan97 avatar Jan 05 '23 19:01 nkhan97

Please create a PR to fix this bug. The recycler list view is a fickle one.

Looks like a work-around is the change numDaysScroll. This could be exposed as a prop to allow the caller to customize it to their needs.

peacechen avatar Jan 05 '23 22:01 peacechen