Box Shadow in createMaterialBottomNavigator

How to add shadow on top in createMaterialBottomNavigator for both ios and android ?

Hi

You might find that a better place to ask about React Navigation is:

This is the style we use on a navigation header to add a bottom shadow (may be able to reverse it to apply a top shadow):

shadowColor: '#000',
    shadowOffset: { width: 1, height: 2 },
    shadowOpacity: 0.1,
    shadowRadius: 3,
    elevation: 2,

Keep in mind that Android doesn’t support the shadow props, but they do support elevation.

Check the style props on createMaterialBottomNavigator (https://reactnavigation.org/docs/en/material-bottom-tab-navigator.html) to see where you want to put this. May require some trial and error.

1 Like