在屏幕中间创建可滚动标签的最佳方法是? [英] The best way to create a scrollable tab in the middle of the screen?

问题描述

在您的个人资料上时，Twitter的移动应用程序在屏幕中间具有一个可滚动的选项卡.当您单击可滚动的标签中间屏幕时，显示个人资料信息等的屏幕上半部分不会更改:推文和回复"，媒体"等.我想知道如何创建此信息?让一半的屏幕保持不变，然后让选项卡更改中间的屏幕...目前，我将导航选项卡作为主导航，因此，在这些选项卡之一(配置文件选项卡)中，我想创建与以下相同的概念图片.

The mobile app of Twitter has a scrollable tab in the middle of the screen when you are on your profile. The top half of the screen displaying your profile info etc doesn't change when you click on the scrollable tabs mid screen : "Tweets & replies", "Media" etc. I am wondering how one would create this? Having half the screen stay the same and then having tabs which change mid screen... At the moment I have react navigation tabs as my main navigation - so on one of these tabs (the profile tab) I want to create the same concept as the picture..

推荐答案

最新答案，但是(供其他人和将来参考)，react-navigation使用此程序包，react-native-tab-view:

Late answer but (for anyone else and future reference), react-navigation uses this package, react-native-tab-view: https://github.com/react-native-community/react-native-tab-view

(用于其标签).

您可以将其嵌套在屏幕中，就像您想要的一样(上一个答案仅解决了导航器中的导航器，而这并不是您想要的).

You can nest this within a screen, just like you desire (the previous answer only addresses the navigator inside navigator and that isn't what you want).

这里是一个示例(并非完全像您想要的那样，但是您知道可以.因此，代替背景图像，将其换出并相应地使用视图或滚动视图来创建该布局):

Here is an example (not exactly like you want, but you get the idea that you can. so instead of a background image, swap it out and use a view or scrollview accordingly to create that layout):

https://snack.expo.io/@satya164/collapsible -header-with-tabview

欢呼:)

我只是找到了只使用react-navigation的方法:

i just found a way with just using react-navigation after all:

https://snack.expo.io/@mattx/collapsible-header -tabs

签出

和另一个库: https://github.com/benevbright/react-navigation-collapsible

这篇关于在屏幕中间创建可滚动标签的最佳方法是?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！