ReactNative SafeAreaView修改IOS上下安

2021-01-29  本文已影响0人  我给你想的好名字

Reactnative 使用SafeAreaView适配IOS iphonex 刘海屏 状态栏和底部背景色

最新新开项目,用了最新的版本(0.61.2),用到SafeAreaView。

然后发现一个问题根据设计稿要求状态栏颜色是需要显示主题色的。不bb 直接上图。。

image

还是直接上解决代码吧。。。
[图片上传中...(image.png-c29cc1-1611880988014-0)]

render() {
        return (
            <View style={{flex: 1}}>
                //顶部背景色
                <SafeAreaView style={{
                    backgroundColor: "#13BFA2",
                    flex: 0
                }}>

                </SafeAreaView>
                //中间内容区域
                <SafeAreaView
                    style={{
                        backgroundColor: "#13BFA2",
                        flex: 1,
                    }}>

                    <StatusBar barStyle="dark-content" backgroundColor="#13BFA2"/>
                    <MainScreenRouterOld ref={this.mainRouter}/>
                </SafeAreaView>
                //底部背景色
                <SafeAreaView style={{
                    backgroundColor: "white",
                    flex: 0
                }}>
                </SafeAreaView>
            </View>

        );
    }
上一篇 下一篇

猜你喜欢

热点阅读