在React Navigation中过渡背景颜色

Question

当从一个屏幕转换到另一个屏幕时(使用卡片或模式模式),在屏幕到屏幕动画期间,有一个白色背景将其alpha从0 o 1转换.

如果可能的话,我想知道如何改变颜色.

环境

• React Native Navigation版本:1.0.0-beta.11
• React Native版本:0.45.1
• 平台:iOS和Android
• 设备:iOS 10.3,iPhone 6

---

我用来创建StackNavigation的一些代码

注意:模态背景颜色是由@Jason Gaare的答案/sf/answers/3154587971/解决的,现在问题仍然存在于StackNavigation上

let navOptions = {
    headerMode: 'screen',
    navigationOptions: ({navigation}) => ({
        headerTintColor: '#fff',
        headerStyle: {
            backgroundColor: '#1A1A1A',
        },
        headerTitleStyle: {
            color: '#fff',
            fontFamily: 'my-font'
        },
        headerLeft: (<ImageBtn
                        buttonStyle={{ .. }}
                        buttonHighlightStyle={{}}
                        source={ myImage }
                        imageStyle={{ ... }}
                        callback={navigation.goBack.bind(this, null)} />)
    })
};

const MyTab = StackNavigator({
    MyScreen1: {screen: MyScreen1},
    MyScreen2: {screen: MyScreen2},
    MyScreen3: {screen: MyScreen3},
    MyScreen4: {screen: MyScreen4},
}, navOptions);

Answer 1

您参考的问题(#563)已于2015年4月通过将默认过渡颜色更新#555555为透明而关闭.可以通过在导航器中设置背景样式来应用过渡颜色,如下所示:

<Navigator
  style={{flex: 1}} // style for the navigator container
  transitionerStyle={{backgroundColor: 'black'}} // style applied to the scenes container
 ...

你没有意识到这个问题是没有意识到的; 有人('alvaromb')在一年后的2016年5月就固定问题发表评论,评论说"这不应该记录在案吗？" 显然用户并没有意识到这一点.

显然,类似的背景颜色问题(以及其他问题)在react-native-router-flux(2017年7月8日发布)的版本4中得到修复,可能是通过相同/类似的代码更新.

Answer 2

查看AppDelegate.m：

RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                  moduleName:@"Example"
                                           initialProperties:nil
                                               launchOptions:launchOptions];
rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1];

尝试改变backgroundColorrootview ！这可能会帮助您实现目标。