我想要一个组件，看起来像这样，在GitHub中打开按钮接近其余的内容，这样：

然而，在我的应用程序上，按钮卡在屏幕底部，就像这样：

我认为flexbox会自动为孩子提供垂直对齐：“顶级”属性...
此外，我尝试添加垂直对齐：Top到子组件，但它不执行任何操作。

<><View style={styles.container} testID="repositoryItem" >
              <View>
                <Image source={{ uri: repositories?.repository?.ownerAvatarUrl }} style={styles.image} />
  
              </View>
              <View>
                <Text style={styles.name}> {repositories?.repository?.fullName}</Text>
                <Text> {repositories?.repository?.description}</Text>
                <Text style={styles.language}> {repositories?.repository?.language} </Text>
              </View>
            </View><View style={styles.container2}>
                <View>
              <Text style={styles.name}>{kFormatter(repositories?.repository?.stargazersCount)}</Text>
              <Text>Stars</Text>
                </View>
                <View>
                <Text style={styles.name}>{kFormatter(repositories?.repository?.forksCount)}</Text>
                <Text>Forks</Text>
                </View>
                <View>
                <Text style={styles.name}>{repositories?.repository?.reviewCount}</Text>
                <Text>Reviews</Text>
                </View>
                <View>
                <Text style={styles.name}>{repositories?.repository?.ratingAverage}</Text>
                <Text>Rating</Text>
                </View>
                </View>
                <View style={styles.container3}>
                <Pressable     title="Open in GitHub"
          placeholder="Open in GitHub"
          onPress={onClick}
          testID="submitButton"
          style={{margin: 10, padding: 10, backgroundColor: 'lightblue'}}>
      
        <Text style={{ textAlign: 'center', color: 'white'}}>
          Open in GitHub
        </Text>
        </Pressable>
                </View>
             </>

款式：

const styles = StyleSheet.create({
    container: {
      display: 'flex',
  alignItems: 'center',
  flexDirection: 'row',
  justifyItems: 'start',
  minHeight: 0
    },
    container2: {
      display: 'flex',
  flexDirection: 'row',
  flexGrow: 1,
  minWidth: '100%',
  justifyContent: 'space-evenly'
    },
    container3: {
display: 'flex',
flexDirection: 'column',
minWidth: '100%',
minHeight: 0,
justifyContent: 'space-evenly'
    },
    separator: {
      height: 10,
      backgroundColor: 'lightgrey'
    },
    image: {
      width: 50,
      height: 50,
      margin: 20
    },
    language: {
      borderStyle: 'solid',
      borderWidth: 2,
      borderColor: 'white',
      padding: 3,
      backgroundColor: 'blue',
      color: 'white',
      borderRadius: 5,
      alignSelf: 'flex-start'
    },
    name: {
      fontWeight: 'bold'
    }
  });

是否有人能够强制子组件不粘在页面底部？