React Native固定页脚

import React from 'react';
import { View, Text, StyleSheet, ScrollView } from 'react-native';

const App = () => {
  return (
    <View style={styles.container}>
      <ScrollView contentContainerStyle={styles.scrollContent}>
        {/* 页面内容 */}
        <Text style={styles.contentText}>这里是页面内容</Text>
        {/* 更多内容 */}
      </ScrollView>
      <View style={styles.footer}>
        <Text style={styles.footerText}>这是固定页脚</Text>
      </View>
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  scrollContent: {
    flexGrow: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
  contentText: {
    fontSize: 20,
    margin: 20,
  },
  footer: {
    height: 50,
    backgroundColor: '#f8f8f8',
    justifyContent: 'center',
    alignItems: 'center',
    borderTopWidth: 1,
    borderTopColor: '#ddd',
  },
  footerText: {
    fontSize: 16,
  },
});

export default App;

container: {
  flex: 1,
},
scrollContent: {
  flexGrow: 1,
  justifyContent: 'center',
  alignItems: 'center',
},

<ScrollView contentContainerStyle={styles.scrollContent} keyboardShouldPersistTaps="handled">
  {/* 页面内容 */}
</ScrollView>