SegmentedView takes all space in parent View?

Hi. I have tried using this component which looks great, thank you.

When I add it to my project other content gets pushed to the bottom of the view. I've styled the SegmentedView to see what space it is occupying and it appears to attempt to take all the empty space on the page.

Code Example:

    render: function() {
        var theTitles = ["Tab1","Tab2","Tab3","Tab4"];
        var currentTabContent = ( <View><Text>{theTitles[this.state.index]}</Text></View> );
        return (
            <View style={styles.container}>
                <SegmentedView
                    titles={theTitles}
                    index={this.state.index}
                    onPress={ index => this.setState({index})}
                    stretch
                    style={styles.segmentedView} />
                {currentTabContent}
                <View><Text>[contentArea]</Text></View>
                <View><Text>[contentArea]</Text></View>
                <View><Text>[contentArea]</Text></View>
            </View>
        );

    }

    var styles = StyleSheet.create({
        container: {
            backgroundColor:"#ffffff",
            flex: 1
        },
        segmentedView: {
            backgroundColor:"#ff9999"
        },
    });

If I remove the "flex:1" attribute from the container then the SegmentedView behaves, but the page layout is then affected.

Am I doing something wrong?

Start by reproducing the supplied render method and styles with a flex: 1 parent and the SegmentedView using stretch. Inspect how the component sizes itself in that layout; done means the SegmentedView no longer consumes the parent's empty space while the parent retains its page layout.