callstack / callstack/react-native-paper

Add possibility to override default elevation of BottomNavigationBar

Đang mở
#4,582 0 bình luận 1 reaction 0 người được giao Xem trên GitHub
BottomNavigation feature request
Ngôn ngữ chính
TypeScript
Star
14.5k
Fork
2.2k
Merge trung bình
5 ngày 23 giờ
Pull request đã merge (30 ngày)
12

Mô tả

**Is your feature request related to a problem? Please describe.**
I know the v3 spec suggests that the `BottomNavigationBar` should not have any shadow but currently it is possible to "bypass" the spec on iOS by simply setting the various `shadow*` style props (i.e. `shadowColor`, `shadowOpacity`, `shadowOffset`, `shadowRadius`).

The same is currently not feasible on Android when setting the `elevation` style prop because of [this](https://github.com/callstack/react-native-paper/blob/main/src/components/BottomNavigation/BottomNavigationBar.tsx#L588) line.

Below a simple example of casting a shadow working on iOS but not working on Android:

```
const Tab = createMaterialBottomTabNavigator();

export default function App() {
return (


// ...


);
}

const styles = StyleSheet.create({
barStyle: {
backgroundColor: '#fff',
// does not work on Android
elevation: 4,
// works on iOS
shadowColor: '#000',
shadowOpacity: 0.1,
shadowOffset: { width: 0, height: -2 },
shadowRadius: 4,
},
});
```

**Describe the solution you'd like**
It would be amazing if the `BottomNavigationBar` could use the `elevation` set in the `barStyle`, maybe something as simple as:

```
const BottomNavigationBar = ({

// ...

return (

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Đánh giá

Issue này chưa được đánh giá.

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.