React Native scroll view not showing

I have a scroll view at the top level of the view hierarchy. I'm trying to get it to show its content but I haven't had any luck.

I see that the documentation says scroll views need a bounded height to work. I can't seem to get it to have a bounded height. This is what I have so far.

'use strict';const React = require('react-native');const {  StyleSheet,  Text,  View,  BackAndroid,  TextInput,  TouchableNativeFeedback,  ScrollView} = React;const ActionButton = require('./action-button'),    Dimensions = require('Dimensions');module.exports = React.createClass({  handleBackButtonPress () {    if (this.props.navigator) {      this.props.navigator.pop();      return true;    }    return false;  },  componentWillMount () {    BackAndroid.addEventListener('hardwareBackPress', this.handleBackButtonPress);  },  componentWillUnmount () {    BackAndroid.removeEventListener('hardwareBackPress', this.handleBackButtonPress);  },  onInputFocus (refName) {    setTimeout(() => {      let scrollResponder = this.refs.getScrollResponder();      scrollResponder.scrollNativeHandleToKeyboard(        React.findNodeHandle(this.refs[refName]),        110,        true      );    }, 50);  },  render: function() {    return (<View style={styles.scrollWrapper}><ScrollView ref='scrollView' style={styles.scroller}><View style={styles.container}><View style={styles.header}><Text>New Post</Text><View style={styles.actions}><ActionButton handler={this.handleBackButtonPress} icon={'fontawesome|close'}                    size={15} width={15} height={15} /></View></View><View style={styles.content}><TextInput underlineColorAndroid={'white'}                placeholder={'Who\'s your professor?'}                ref='professor'                onFocus={this.onInputFocus.bind(this, 'professor')}                /><TextInput multiline={true}                underlineColorAndroid={'white'}                placeholder={'What do you think?'}                ref='post'                onFocus={this.onInputFocus.bind(this, 'post')}                /></View><View style={styles.footer}><TouchableNativeFeedback                background={TouchableNativeFeedback.SelectableBackground()}><View style={{width: 50, height: 25, backgroundColor: 'green'}}><Text>Submit</Text></View></TouchableNativeFeedback></View></View></ScrollView></View>    );  }});const styles = StyleSheet.create({  scrollWrapper: {    flex: 1  },  scroller: {    flex: 1  },  container: {    flex: 1,    flexDirection: 'column',    justifyContent: 'flex-start',    backgroundColor: 'white',    padding: 5,  },  post: {    flex: 1,  },  actions: {    flex: 1,    flexDirection: 'row',    justifyContent: 'flex-end',    alignSelf: 'center'  },  header: {    flex: 1,    position: 'absolute',    top: 0,    left: 0,    right: 0,    height: 35,    padding: 5,    flexDirection: 'row'  },  content: {    flex: 1,    position: 'absolute',    top: 35  },  footer: {    flex: 1,    position: 'absolute',    bottom: 0,    left: 0,    right: 0,    height: 35  }});

EDIT: So I changed the background colors of all the components to something obvious. I was able to simplify the view, so now the ScrollView is the root of the component. The container view (the immediate child of the ScrollView) is the one who isn't filling all the available space. I'm still playing around with it but any help is much appreciated.