我有两个场景,Login和Home,两者的背景颜色都设置为黑色。但在过渡期间,当卸载和安装时,似乎还有另一个白色的背景。
有没有办法弄清楚背景是什么,并将颜色改为黑色?
这是我的设置:
const RouterWithRedux = connect()(Router)
const store = configureStore()
export default class App extends Component {
render() {
return (
<Provider store={store}>
<RouterWithRedux>
<Scene key='root'>
<Scene component={Login} initial={true} key='login' sceneStyle={{backgroundColor: 'black'}} title='Login'/>
<Scene component={Home} direction='vertical' key='Home' sceneStyle={{backgroundColor: 'black'}} title='Home'/>
</Scene>
</RouterWithRedux>
</Provider>
)
}
}
白色显示的过渡图像,很难看到但是如果你看到右上角的电池图标,则在登录场景的右侧和顶部有一个空白区域(从登录到主页,和登录正在卸载过程中,因此是半透明的黑色):
答案 0 :(得分:2)
将函数传递给返回样式或getSceneStyle
对象的StyleSheet
。
// ..
const getSceneStyle = (/* NavigationSceneRendererProps */ props, computedProps) => {
const style = {
backgroundColor: 'black',
};
return style;
};
// ..
<RouterWithRedux getSceneStyle={getSceneStyle}>
// ..
请勿执行以下操作,只需将道具直接传递至RouterWithRedux
,connect
会将其传递至Router
组件:
const RouterWithRedux = connect()(<Router sceneStyle={{backgroundColor: 'black'}}/>)