如何为React Native中的所有组件设置相同的背景图像？

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

// 自定义根组件
const BackgroundView = ({ children }) => {
  return (
    <View style={styles.container}>
      {children}
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundImage: 'url(https://example.com/background.jpg)', // 替换为你的背景图像URL
    backgroundSize: 'cover', // 确保图像覆盖整个屏幕
    justifyContent: 'center',
    alignItems: 'center',
  },
});

// 在App组件中使用BackgroundView
const App = () => {
  return (
    <BackgroundView>
      {/* 你的其他组件 */}
      <Text>Hello, World!</Text>
    </BackgroundView>
  );
};

export default App;

// 使用本地图像资源
import backgroundImage from './path/to/background.jpg';

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundImage: `url(${backgroundImage})`,
    backgroundSize: 'cover',
    justifyContent: 'center',
    alignItems: 'center',
  },
});