ナビゲーションルーティングに透明な背景がありません。

Question

私は非常に基本的なアプリを持っており、ナビゲーションにはex-navigationを使用しています。

App.js（注backgroundColor）：

export default class App extends Component { 
    render() { 
     return (
      <View style={{flex: 1, backgroundColor: 'lightblue'}}> 
       <TabEntry/> 
      </View> 
     ); 
    } 
} 

TabEntry：

const Router = createRouter(() => ({ 
    notification:() => Notification, 
})); 

const defaultRouteConfig = { 
    navigationBar: { 
     title: 'notify', 
     tintColor: 'blue', 
     backgroundColor: 'green', 
    }, 
}; 

export default class TabEntry extends React.Component { 
    render() { 
     return (
      <NavigationProvider router={Router}> 
       <StackNavigation 
        initialRoute={Router.getRoute('notification')} 
        defaultRouteConfig={defaultRouteConfig} 
       /> 
      </NavigationProvider> 
     ) 
    } 
} 

class Notification extends React.Component { 
    render() { 
     return (
      <View> 
       <Text>NOTIFICATION!!!</Text> 
      </View> 
     ) 
    } 
} 

以来は、そこ親コンポーネントでbackgroundColorであるが、その子要素でないのbackgroundColor、ライトブルーの背景が表示されているはずです。しかし、代わりに背景は白です。どうすれば透明にすることができますか？

Answer 1

backgroundColor: 'transparent'を<Text>スタイルに入れてみてください。

だから次の操作を行います。

<Text style={{backgroundColor: 'transparent'}}>NOTIFICATION!!!</Text> 

https://github.com/facebook/react-native/issues/7964