как удалить верхнюю тень материала-верхних вкладок?

Текущее поведение

  • Верхняя сторона tabBar имеет тень.

введите здесь описание изображения

Ожидаемое поведение

  • как убрать верхнюю тень верхней вкладки?
  • попробовал высота: 0, но он также удаляет нижнюю тень.
  • Примечание. Как была достигнута верхняя тень для Tabs.Navigator (реагирующая навигация)? поскольку свойства box-shadow не работают для Android, а высота показывает только тень внизу.

Как воспроизвести

<>
<Header /> //App name custom component
<Tabs.Navigator
        ...
        tabBarOptions={{
          ....
          style: {
            // elevation: 0, 
          },
        }}>

react-native react-navigation css react-navigation-v5
person Nikhil Shisode    schedule 02.04.2020    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Попробуйте с этим:

<>
<Header /> //App name custom component
<Tabs.Navigator
        ...
        tabBarOptions={{
          ....
          style: {
            elevation: 0,
            shadowColor: "#000000",
            shadowOffset: { width: 0, height: 10 }, // change this for more shadow
            shadowOpacity: 0.4,
            shadowRadius: 6
          },
        }}>

shadowOffset: { width: 0, height: 10 } тени размещаются только в нижней части View. shadowOffset: { width: 0, height: -10 } тени размещаются только в верхней части View. shadowOffset: { width: 10, height: 0 } тени размещаются только справа от обзора. shadowOffset: { width: -10, height: 10 } тени размещаются только слева от вида.

Этот пример найден здесь .

person William Brochensque junior    schedule 02.04.2020