React Native ScrollView 动态页脚

Question

如何制作 React 原生滚动视图页脚。如果内容小于屏幕，屏幕最底部应该有一个按钮；如果它更大，那么按钮应该在内容之后到达最底部

我这样做了，但是如果没有足够的内容，那么按钮就会上升

<ScrollView>

    <Text>asdasd</Text>

    <Button text="Next" />

</ScrollView>

如果是这样，那就永远坐在按钮下面的卷轴下面，但我也需要按钮去

<View>
    <ScrollView>

        <Text>asdasd</Text>

    </ScrollView>

    <Button text="Next" />
</View>

Answer 1

尝试将滚动视图设置为灵活可用space，并将按钮设置为底部

<ScrollView style={{flex: 1}}>
    <Text>asdasd</Text>
    <Button text="Next" style={{bottom: 0}}/>
</ScrollView>

Answer 2

这是我找到的解决方案

<ScrollView>
    <View style={{ minHeight: height - buttonHeight - safeAreaView }}>
        <Text>Content</Text>
    </View>
    <Button text="Next" />
</ScrollView>

React Native ScrollView 动态页脚

React Native ScrollView dynamic footer

javascript

typescript

react-native

scrollview