A lo que me enfrento:

Tengo un StackNavigator en el que quiero configurar un ImageBacgkround para todas sus pantallas secundarias. El problema es que ya configuré mi StackNavigator cardStyle: { backgroundColor: 'transparent' } , siguiendo React Navigation Docs , y lo envolví dentro de ImageBackground pero aún no puedo hacerlo funcionar.

Lo que he probado:

 //My navigator component is more complex, but the concept looks something like this //for both navigators const Stack = createStackNavigator(); const MyStackNavigator = () => ( <ImageBackground source=('../assets/my-background.png') resizeMode='cover' style={{flex: 1}}> //If I change BackgroundColor to 'red' or anything like that, it works fine //so I think the problem isn't related to styling properties <Stack.Navigator screenOptions={{cardStyle: { BackgroundColor: 'transparent' } }}> <Stack.Screen name='Screen1' component={Component1}/> <Stack.Screen name='Screen2' component={Component2}/> <Stack.Screen name='Screen3' component={Component3}/> </Stack.Navigator> </ImageBackground> ); export default App() => ( <MyStackNavigator /> );

Hice lo mismo en un DrawerNavigator dentro de mi componente de navegador pasando sceneContainerStyle: { backgroundColor: 'transparent' } }} y realmente funciona. Parece que mi StackNavigator no representa correctamente sus componentes principales.

Una de las pantallas de mi StackNavigator:

Una de las pantallas de mi DrawerNavigator:

El diseño de las pantallas de ambos navegadores está envuelto en una View de contenedor transparente, por lo que, como puede ver, la pantalla del cajón muestra el fondo correctamente, pero la pantalla de la pila no. ¿Quizás estoy pasando accesorios incorrectos a mi StackNavigator?