3

我有一个身份验证屏幕,我想在其中显示一个徽标并反应在两个组件之间切换的本机选项卡。当标签内容的高度太大以至于无法适应屏幕,我希望能够向下滚动。

class AuthContainer extends Component {
    render() {
        return (
            <View style={{flex:1, paddingBottom: 20}}>
                <ScrollView
                    contentContainerStyle={{ flexGrow: 1}}
                    vertical={true}
                    nestedScrollEnabled={true}
                    >
                    <View style={authContainerStyles.heading}>
                        <Image
                            source={require('../../assets/images/logo.png')}
                            style={authContainerStyles.headingImage}
                            resizeMode='contain'
                        />
                    </View>

                    <Tabs/>

                </ScrollView>
            </View>
        )
    }
}

export default AuthContainer;

问题是即使选项卡组件的内容超过屏幕高度,滚动视图也不会显示。

我的标签组件:

const routes = {
    LogIn: {
        screen           : LogIn,
        navigationOptions: {
            title     : 'LogIn'
         }
    },
    SignUp: {
        screen           : SignUp,
        navigationOptions: {
            title     : 'SignUp'
        }
    }
}

const routeConfig = {
    tabBarOptions : {
        animationEnabled: true,
        showLabel        : true
    }
}

export default createMaterialTopTabNavigator(routes, routeConfig);

任何帮助表示赞赏。谢谢大家的时间!

4

0 回答 0