react-native-calendar arrow style

287 Views Asked by At

I´m programming in react native and I need to do a calendar. for this, i´m using react-native-calendars library. I need to customize the arrows.

It should be like this:

enter image description here

But it is like this (the arrow is black because if it were white, it would not be possible to see) :

enter image description here

The code (style) is this:

              style={{
                height: 350,
              }}
              theme={{
                arrowStyle: {
                    backgroundColor: '#0064D5',
                    color: '#fff',
                    borderRadius: 3,
                    height: 16,
                    width: 16,
                    alignContent: 'top',
                    alignItems: 'top',
                    alignSelf: 'top',
                },
                arrowColor: "#000",
            }}

I would like to:

  1. Leave the arrows closer to the name of the month;
  2. Place the arrow in the center of the blue square;
  3. Change the arrow icon. The default arrow icon is this triangle. I want to use the IOS arrow

That is, I want to leave the design the same as the second image.

Can someone help me?

0

There are 0 best solutions below