React-Native 固定 ScrollView 中的页脚？

Question

我想创建具有动态内容的视图，该视图应该具有某种页脚，通常（如果有足够的空间）看起来应该粘在底部。

在介绍 ScrollViews 之前，我的代码如下所示：

<View style={{flex: 1, justifyContent: 'space-between'}}>
  <View>{content}</View>
  <View>{stickyFooter}</View>
</View>

引入 ScrollView 后，我必须将其删除flex: 1，否则 ScrollView 根本无法滚动。之后justifyContent就变得没用了，因为 flex-container 的高度没有设置为100%。因此两者Views只是相邻出现。

为了弄清楚我的观点总体上应该是什么样子：

该按钮不应粘在底部，但应出现在底部（如果可能）。

Answer 1

现在这是一个老问题了，但是为了那些像我一样通过谷歌搜索最终到达这里的人的利益，我在下面粘贴了对我有用的解决方案。

基本上，只需将页脚放在滚动视图之外即可。

标记

  render = () => {
    return (
      <View>
         <ScrollView style={styles.container}>
            ...
         </ScrollView>
         <TouchableOpacity style={styles.floatingActionButton}>
           <RkButton
             rkType='stretch'>
             <RkText>Do stuff</RkText>
           </RkButton>
         </TouchableOpacity>
      </View>
    )
  }

风格

const styles = StyleSheet.create(theme => ({
    floatingActionButton: {
    alignItems: 'center',
    justifyContent: 'center',
    position: 'absolute',
    bottom: 10,
    left: 10,
    right: 10,
    borderRadius: 10,
  }
}));