Align Button to Bottom in ScrollView [duplicate]

Question

I'm trying to align a button to bottom of the ScrollView and make the ScrollView fill the page. First screenshot is how it looks like and the second one is what I want.

In the screenshots, ScrollView is not used since there aren't enough items but number of items inside of the ScrollView is not fixed.

Render():

<ScrollView style={styles.scrollViewContainer}>
      <View style={{flex: 1, justifyContent: 'space-between', flexDirection: 'column'}}>
        <View style={{flex: 1}}>
          <Text style={styles.bigTitle}>Title</Text>
          <View style={styles.formContainer}>
            <Text>Hello</Text>
            <Text>Hello</Text>
            <Text>Hello</Text>
            <Text>Hello</Text>
            <Text>Hello</Text>
            <Text>Hello</Text>
            <Text>Hello</Text>
            <Text>Hello</Text>
            <Text>Hello</Text>
            <Text>Hello</Text>
            <Text>Hello</Text>
          </View>
        </View>
        <SignupButton onPress={this.submit} title="Next Step" image={require("../Images/right_btn.png")} boldText={true} />
      </View>
    </ScrollView>

Style:

  scrollViewContainer: {
    backgroundColor: '#fff',
  },
  formContainer: {
    paddingTop: 10,
    paddingLeft: 50,
    paddingRight: 50,
    paddingBottom: 30,
  },
  bigTitle: {
    fontSize: 24,
    textAlign: 'center',
    marginTop: 20,
    marginBottom: 20,
  },

Answer 1

Try adding justifyContent:'space-between' and flex:1 to contentContainerStyle to ScrollView

  <ScrollView style={style.container} contentContainerStyle={[{flex:1,justifyContent:'space-between'}]} >
    <LIST />
    <Button />
  </ScrollView>