React Native Tab View : displaying empty screen when Tabview element is wrapped / nested within View

Question

I am using 'react-native-tab-view' library in my code. Link here: npm / github .

Here is a basic example code in snack - that can run on Web.

Now the issue is- if I want to display a Header text above <Tabview/> tag, it shows nothing. Even if I just wrap the <Tabview/> within a <View></View> like this below snippet, it shows an empty screen, even without any error.

<View>
  <TabView .... />   /*Shows empty screen*/
</View>

Here is an example code screenshot with output, from snack with nested <Tabview/> , running in Android device :

Kindly suggest how to achieve that. Not sure what am I missing?

Answer 1

I think you should have to use <View style={{flex:1}}> Tab code </View>