React-native-calendars: Arrows not showing on iOS

[RShah512]

689 Description

The left and right arrows in the Calendar are not visible on iPhone X device, but are visible when run from xCode simulator. I tried using the Calendar inside & outside Native Base Card and both the arrows are not visible. I have no extra styles added on that page. The arrows are correctly visible on android device.

Expected Behavior

The calendar arrows should be visible on the device

Environment

• npm ls react-native-calendars: 1.22
• npm ls react-native:0.60.3

Also specify:

1. Phone/emulator/simulator & version: iPhone X

Reproducible Demo

Issues that come with minimal repro's are resolved much more quickly than issues where a maintainer has to reproduce themselves.

[ggunti]

Same problem at me. Sometimes the arrows are not visible on android too. I can't figure out why sometimes they appear and why sometimes they don't. Did you find a solution?

[RShah512]

@ggunti Yes, I solved it by customising the renderArrow parameter
renderArrow = {
( direction ) =>
{
if ( direction == 'left') return ();
if ( direction == 'right') return ( );
}

[ggunti]

Thank you! It works!

[Inbal-Tish]

@RShah512 Hi. I can't reproduce. Is it OS version related? Can you add a code snippet so I can see which component you're using and how?

[anija]

@ggunti Yes, I solved it by customising the renderArrow parameter
renderArrow = {
( direction ) =>
{
if ( direction == 'left') return ();
if ( direction == 'right') return ( );
}

I was having a similar problem: arrows won't shows up on web. This workaround fixed my problem, thanks!