I'm trying to use the Tab View component inside a ScrollView but it never show if I don't specify a minHeight, I can't understand why.
import React from 'react'
import { View, StyleSheet, Text, ScrollView } from 'react-native'
import { Tabs } from 'react-native-collapsible-tab-view'
const LongText = () => {
return (
<Text>
///Long lorep isum text
</Text>
)
}
const TestScreen = () => {
return (
<ScrollView style={{ flex: 1, backgroundColor: 'pink', padding: 5 }}>
<View style={{ flex: 1, backgroundColor: 'yellow' }}>
<Text>This is a TabTest</Text>
<View style={{ flex: 1 }}>
<Tabs.Container>
<Tabs.Tab name="About">
<View style={{ flex: 1 }}>
<LongText />
</View>
</Tabs.Tab>
<Tabs.Tab name="Reviews">
<Text>Test</Text>
</Tabs.Tab>
</Tabs.Container>
</View>
<Text>Test</Text>
</View>
</ScrollView>
)
}
const styles = StyleSheet.create({})
export default TestScreen
I tried adding minHeight and it worked :
<View style={{ flex: 1, minHeight: 400 }}>
<Tabs.Container>
...
</Tabs.Container>
</View>
But it's not optimal because I don't know the size of the content I will put in this View in advance, and it crop the rest of it. Result with minHeight