Custom dayComponent with big height makes Calendar jump to random places when scrolling through months

[goxr3plus]

Please make our job easier by filling this template out to completion. If you're requesting a feature instead of reporting a bug, please feel free to skip the Environment and Reproducible Demo sections.

Description

Please watch the below youtube video to understand exactly :)

https://www.youtube.com/shorts/TBT8QSp2Thg

Expected Behavior

I expect the scrolling to be smooth

Observed Behavior

The scroll jumps all over the place

Environment

Please run these commands in the project folder and fill in their results:

• npm ls react-native-calendars: react-native-calendars@1.1283.0
• npm ls react-native: Using expo 44 with react-native@0.64.3

Also specify:

1. Device/emulator/simulator & OS version: Using real Android phone with Android 12

Reproducible Demo

Easy just implement custom dayComponent and add a view with a big min height ( for example 90px )

Screenshots

@Inbal-Tish

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[Inbal-Tish]

@goxr3plus Try passing calendarHeight to the CalendarList component with the new calculated height (you can find it using the Inspector).

[jordanmkoncz]

I'm experiencing the same issue.

@Inbal-Tish can you clarify how the calendarHeight prop is meant to be used? The description of this prop in the docs is just "Dynamic calendar height". My custom dayComponent has a height of 40, so I tried passing calendarHeight={40} but this didn't work and made the scrolling behaviour totally broken.

I'm assuming that calendarHeight is meant to be passed a different kind of value, could you please clarify this?

[Inbal-Tish]

@jordanmkoncz The calendarHeight prop should be used to modify the Calendar's height, not the day's. You should calculate the required height as you enlarged the day component's height (the default height is 360, calculated for a 32 points day component). See the example in CalendarListScreen.tsx

[jarvistesting]

Me too facing the same issue, Please share some working solution.

[frankA10019]

how to know if my calendar has 4 weeks or 5 weeks? Is there any parameter help me for calculate height?

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[goxr3plus]

.

[redjohnfrv]

Hi, there! Is there any solution a with week rows count?
Also want to ask: maybe is it possible to disable auto-alignment when a date is selected? Because when I choose 1st day of any month - Calendar jumps to the previous month y some reason....

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[dionart]

.

[TNAJanssen]

Same issue here

[kamilkedzierski]

same issue on my end :(