Tab icon size is hard-coded to 27x27pt with no way to override it
维护者通常 1 天内回复
评估
- 难度
- 4/5
- 预计耗时
- 3-5 天
- 新手友好度
- 48/100
- Issue 类型
- 功能
- 描述清晰度
- 基本清楚
- 活跃度
- 活跃
- 技术栈
- react-native, swift, typescript
调研方向
从 React Native tab options API 以及 ios/TabViewProvider.swift:60 和 ios/TabViewImpl.swift:350 中的两个 iOS 调用点开始。检查 navigator-level default 和 per-screen override 如何传递到两个固定尺寸路径，同时包括 proposal 中提到的 Android 布局问题。当所选 API 允许一个 tab icon 使用不同尺寸且不破坏默认行为时，即视为完成。
由索引模型根据 Issue 内容生成。
描述
Summary
Tab icon size is hard-coded to 27×27pt with no way to override it, which makes it impossible to give a single tab item a larger icon.
Where
Two independent call sites, both fixed:
ios/TabViewProvider.swift:60—private var iconSize = CGSize(width: 27, height: 27), applied to remotely-loaded icons viaimage.resizeImageTo(size: iconSize).ios/TabViewImpl.swift:350—let iconSize = CGSize(width: 27, height: 27)insidemakeTabBarItemImage, used on theexperimental_bakedTintColorspath.
Because remote images are resized to iconSize, supplying a larger source image has no effect.
Use case
We show the signed-in user's avatar as the Profile tab's icon (a snapshot of our own circular avatar component, handed over as a file:// PNG). Design wants that avatar rendered noticeably larger than the neighbouring glyph icons, which is a common pattern for a "you" tab — the avatar is a photo of a person rather than a symbol, so it reads better at a larger size, especially with the label hidden via tabBarLabel: ''.
At 27pt it is legible but visibly smaller than intended, and there is currently no prop, per-screen option, or imageInsets-style escape hatch to change it.
Proposal
Expose the icon size, ideally per screen so one item can differ from the rest:
<Tab.Screen
name="Profile"
options={{
tabBarIcon: () => ({ uri: avatarFileUri }),
tabBarIconSize: 34, // new
}}
/>
A navigator-level default (iconSize on Tab.Navigator) with a per-screen override would also work for us. Happy to open a PR if you'd like it in this shape — wanted to check the preferred API first, and whether per-screen sizing raises layout concerns on Android's BottomNavigationView that aren't obvious from the iOS side.
Environment
react-native-bottom-tabs1.4.0 /@bottom-tabs/react-navigation1.4.0- React Native 0.85.3, Expo SDK 56, New Architecture, React 19.2.3
- iOS 26.5 simulator (iPhone 17 Pro), Xcode 26.6
- 主要语言
- TypeScript
- 星标
- 1.5k
- 派生
- 108
- 平均合并
- 22 小时 32 分钟
- 30 天内合并 PR
- 8
环境准备
- 没有 Dockerfile 或 Docker Compose 文件
- 有 Pull Request 模板
- 阅读贡献指南
从这里开始
- 先读完整个 Issue，再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库，在一个分支上完成修改。
- 提交 Pull Request，并在描述里引用这个 Issue 编号。
callstack/react-native-bottom-tabs 的其他 Issue
-
难度 2/5 1-3 小时 新手友好度 75/100
callstack/react-native-bottom-tabs#593 ·
维护者通常 1 天内回复
-
[iOS] Fabric: SIGABRT on tab press when tab key contains non-ASCII characters (kCFStringEncodingUTF8 passed to -cStringUsingEncoding:)可能已有人在做 @thiagobrez 于 47 天前认领。 未关闭
难度 2/5 1-3 小时 新手友好度 75/100
callstack/react-native-bottom-tabs#560 ·
维护者通常 1 天内回复
-
bug
难度 3/5 1-2 天 新手友好度 72/100
callstack/react-native-bottom-tabs#596 ·
维护者通常 1 天内回复
-
难度 4/5 3-5 天 新手友好度 48/100
callstack/react-native-bottom-tabs#592 ·
维护者通常 1 天内回复
-
难度 4/5 3-5 天 新手友好度 68/100
callstack/react-native-bottom-tabs#591 · 1 条评论 ·
维护者通常 1 天内回复
查看 callstack/react-native-bottom-tabs 的全部 Issue
相似的 Issue
-
难度 2/5 1-3 小时 新手友好度 78/100
维护者通常 1 天内回复
-
难度 1/5 1 小时以内 新手友好度 82/100
homarr-labs/dashboard-icons#2939 ·
维护者通常 1 天内回复
-
Agent/category reasoning variants are still checked against the stale model cache in chat.params未关闭opencode
难度 2/5 1-3 小时 新手友好度 75/100
code-yeongyu/oh-my-openagent#10003 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 77/100
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 65/100
nextcloud-libraries/nextcloud-dialogs#2669 ·
维护者通常 1 天内回复