在 React-Native 应用程序中隐藏标题,顶部的 TabBar 保持可见

时间:2020-12-31 14:31:31

标签: react-native react-navigation react-navigation-v5 react-navigation-collapsible

我一直在尝试实现一种相当常见的 UI 模式。我有一个包含许多 ListView 的反应导航 MaterialTopTabNavigator。当前活动的 ListView 向下滚动时,标签上方的标题应该被隐藏(通过将其向上平移,移出视口),标签也应该向上移动。

Like in this picture

我在这里面临的问题是 a) 如果我翻译标题和选项卡,我需要在列表中使用 paddingTop 以确保第一项完全可见。但是,如果我向下滚动并隐藏标题,然后切换到下一个选项卡(列表滚动到顶部),则填充将可见。

b) 如果我翻译整个内容(标题、标签栏和 ListView),则不需要 paddingTop(我可以在底部添加一个填充并通过 BottomTabNavigator 将其隐藏),但动画在 android 上变得生涩。 似乎有一个 bug in react-native causing 这个。 但是有一些适用于 Android 的应用实现了这种模式。

如果您对此有任何想法或建议,我将不胜感激。

0 个答案:

没有答案
相关问题