0

When I use ScrollableTabView is nested inside ScrollView, it can't show anything in Android althought I updated ScrollableTabView version 0.8.0.

react-native-cli: 2.0.1 react-native: 0.44.3

My code like this:

   render() {
    return (
    <ScrollView>
      {this._renderUser()}
      <ScrollableTabView
        tabBarActiveTextColor="red"
        tabBarUnderlineStyle={{ backgroundColor: 'red' }}
        initialPage={0}
        renderTabBar={() => <DefaultTabBar textStyle={Styles.tabText} />}>                  
        <ScrollView
          tabLabel="线索"
          style={Styles.tabView}>
          <ListView dataSource={this.state.dataSource}
            renderRow={this._renderRow} />
        </ScrollView>
        <ScrollView
          tabLabel="客户档案">
          {this._renderCusProfile()}
        </ScrollView>
      </ScrollableTabView>
    </ScrollView>
  );
}

Please click here to show image example

Any pointers to what I might need to change in your code to get this to work?

Thanks

  • Can you post the your style sheet. Styling used in Styles.tabView. – csath Mar 21 '18 at 05:19
  • This is my code : {this.renderCheckoutModal()} {this.renderPhotosView()} {this.renderInfoView()} {/* {this.renderDescView()} */} {this.renderDoctorsTitle()} – Tran Van Thang Mar 21 '18 at 07:03

2 Answers2

1

import Dimensions from react native :

import {
  ...
  Dimensions
} from "react-native";

then you bring height :

const { height } = Dimensions.get('window');

And you apply hight to ScrollableTabView

  <ScrollableTabView
        style={{ height: height, position: 'relative' }}
      ...
ZeivRine
  • 43
  • 1
  • 3
0

Not sure what styling includes in your Styles.tabView. If you use { flex: 1 } inside your style object for this might work.

csath
  • 1,048
  • 9
  • 19