React-native-tab-view: When I wrap it inside a ScrollVIew, it can not adjust the height automatically

[changyu2hao]

I am nesting my tabs in the middle of the whole screen using a Scrollview, I have 3 tabs and one of them is longer than others. So I can see blank space in other two short tabs.

I need the scrollview can adjust each height automatically

Code sample

  <ScrollView>
    <Text
        style={{
          fontSize: fontScale * hp(hStr(16)),
          marginHorizontal: wp(wStr(16)),
          marginVertical: hp(hStr(4))
        }}
      >
        Hello World! 
      </Text>
        <TutorDetailTabView user={user} />(This is a component of the tab)
    </ScrollView>

For Syntax Highlighting check this link

My version:
react-native-tab-view: ^2.7.0

[github-actions[bot]]

Couldn't find version numbers for the following packages in the issue:

• react-native-tab-view
• react-native-gesture-handler
• react-native-reanimated
• ``

Can you update the issue to include version numbers for those packages? The version numbers must match the format 1.2.3.

[kevinmcalear]

I have the exact same issue.

Here are the versions I'm using:

"react-native-tab-view": "^2.14.4"
"react-native-gesture-handler": "^1.5.0"
"react-native-reanimated": "^1.4.0"

After further investigation, this issue is happening because I have 3 tabs, one of them much longer than the other two. All three tabs are the same height so the two shorter tabs with less content still scroll the full height of the longest tab's content. Any way to stop this?

EDIT: It looks like this library isn't designed to be used like this: https://github.com/react-native-community/react-native-tab-view/issues/1019

The UI we have requires things to be scrollable before getting to this tab section in the app. Any suggestions on how to do something like this would be very helpful. 🙏

[Miluaaa]

+1

[changyu2hao]

I have exactly the same issue, please let me know when you get solutions

[xmflsct]

@changyu2hao or if the content rendered in the renderTabBar can catch scrolling, then I can avoid wrapping it inside s scrollview.