Fullscreen modal buggy (flickering) when using CustomTabBar
维护者通常 1 天内回复
还没有人认领这个 Issue。
评估
- 难度
- 4/5
- 预计耗时
- 3-5 天
- 新手友好度
- 35/100
- Issue 类型
- 缺陷
- 描述清晰度
- 基本清楚
- 活跃度
- 停滞
- 技术栈
- react-native, typescript
- 领域
- mobile
调研方向
首先运行 https://github.com/dylancom/native-tabs-modal-bug 中可复现的示例，并在将 presentation 设置为 fullScreenModal、将 animation 设置为 none 的情况下进行导航。跟踪产生初始标签栏高度的 CustomTabBar 和模态布局过渡，然后验证导航是否始终一致地渲染全屏模态，而不会出现闪烁或底部黑色区域。
由索引模型根据 Issue 内容生成。
描述
Bug summary
When using a custom tab bar as by your example, full-screen modals behave inconsistently when no animation is used (animation: "none"). Upon navigation, the new screen’s height is initially calculated as SCREEN_HEIGHT - TABBAR_HEIGHT, and shortly after, it adjusts to include the height of the tabbar, causing noticeable flickering.
In other cases, the new screen ends up with a black area at the bottom, matching the height of the tab bar.
Navigating to the modal shortly still shows the tabbar sometimes (for a frame):
Then shortly after renders the full screen as supposed to:
It also happens that it just shows a black area at the bottom part all the time:
Library version
0.9.2
Environment info
⚠️ react-native depends on @react-native-community/cli for cli commands. To fix update your package.json to include:
"devDependencies": {
"@react-native-community/cli": "latest",
}
Steps to reproduce
Navigate to a screen that has the following options:
options={{
title: "Modal",
presentation: "fullScreenModal",
animation: "none",
}}
Reproducible sample code
https://github.com/dylancom/native-tabs-modal-bug
- 主要语言
- 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
-
./collections should export setUmbracoVersion and setAllowFilePathUploads for in-process consumers未关闭
难度 2/5 1-3 小时 新手友好度 78/100
umbraco/Umbraco-CMS-MCP-Dev#563 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 65/100
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 76/100
-
afk-ok area:data-quality importer size:S
难度 2/5 1-3 小时 新手友好度 77/100
enorm-labs/event-junkie#3166 ·
维护者通常 1 天内回复
-
enhancement
难度 1/5 1 小时以内 新手友好度 80/100
alunduil/projects-v2-sync#21 ·