callstack / callstack/react-native-paper

BottomNavigation.Bar applies wrong fontWeight to active label

未关闭
#4,780 1 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看
bug
主要语言
TypeScript
星标
14.5k
派生
2.2k
平均合并
5 天 23 小时
30 天内合并 PR
12

描述

### Current behaviour
The `BottomNavigation.Bar` applies the same `fontWeight` to all labels (active and inactive) as seen [in the implementation](https://github.com/callstack/react-native-paper/blob/ff0df5454eb13d6e8e2d8f1c87c0bca8bb3635f0/src/components/BottomNavigation/BottomNavigationBar.tsx#L850) but according to the [MD3 spec](https://m3.material.io/components/navigation-bar/specs) the weight for the active label should be bold (i.e. 700).

### Expected behaviour
Active label should be bold.

### How to reproduce?
Use `BottomNavigation.Bar` (e.g. together with react-navigation).

### Preview

### What have you tried so far?

Read the implementation, which clearly is wrong.

### Your Environment

| software | version
| --------------------- | -------
| ios | x
| android | x
| react-native | x.x.x
| react-native-paper | 5.14.5
| node | x.x.x
| npm or yarn | x.x.x
| expo sdk | x.x.x

贡献指南

打开贡献指南

调研方向

从 src/components/BottomNavigation/BottomNavigationBar.tsx 中 issue 链接的实现开始,并将活动和非活动标签的样式与 MD3 导航栏规范进行比较。在 iOS 和 Android 上使用 BottomNavigation.Bar 时验证该组件;当活动标签使用 fontWeight 700,而非活动标签保持其预期的字重时,即表示完成。

由索引模型根据 Issue 内容生成。

评估

技术栈
react-native, typescript
领域
design, frontend
Issue 类型
缺陷
难度
2/5
预计耗时
1-3 小时
活跃度
停滞
描述清晰度
描述清楚
新手友好度
45/100

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。