React原生弹性框不使用所有可用空间

我有一个我想要全屏的布局.这就是它现在的样子:

我想要的是布局占用屏幕上的所有空间(所以提交按钮应该在底部向下).我正在尝试使用,{flex: 1}但它不起作用.这是代码:

'use strict';

const React = require('react-native');
const {
  StyleSheet,
  Text,
  View,
  BackAndroid,
  TextInput,
  TouchableNativeFeedback,
  ScrollView
} = React;

const ActionButton = require('./action-button');

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.scrollView.getScrollResponder();
      scrollResponder.scrollResponderScrollNativeHandleToKeyboard(
        React.findNodeHandle(this.refs[refName]),
        0,
        true
      );
    }, 50);
  },

  render: function() {
    return (
      
        
          
            New Post

              
                
              
          
          
            

            
          
          
            

              
                Submit
              
            
          
        
      
    );
  }
});

const styles = StyleSheet.create({
  scroller: {
    flex: 1,
    flexDirection: 'column'
  },
  container: {
    flex: 1,
    flexDirection: 'column',
    justifyContent: 'flex-start',
    backgroundColor: 'white',
    padding: 5,
  },
  post: {
    flex: 3
  },
  professor: {
    flex: 1
  },
  actions: {
    flex: 1,
    flexDirection: 'row',
    justifyContent: 'flex-end',
    alignSelf: 'center'
  },
  header: {
    flex: 1,
    padding: 5,
    flexDirection: 'row'
  },
  content: {
    flex: 4
  },
  footer: {
    flex: 1
  }
});

从我所看到的,我将flex属性一直设置在视图层次结构中,但仍然没有做任何事情(在顶层是一个导航器,{flex:1}也是如此).有什么建议？

你想要的是组件的contentContainerStyle支柱ScrollView.如果你替换:

用:

这将解决您的问题.

正如文件中所述:

这些样式将应用于包含所有子视图的滚动视图内容容器.

希望能帮助到你!