ReactNative 修改导航状态栏相关属性 - RN

近期接了个使用 ReactNative 为基础的项目，也算是对此正面做进一步的了解，因项目设计有些个性化，前前后后跟 @react-navigation/stack 组件折腾了一番，也尝试了自定义导航组件，最后还是回归使用了官方的导航组件，特此对 StatusBar 简要归纳，官方文档中也介绍的很详细，可以通过文档或者直接跳转进组件中查看对应的属性和方法
如下简要对会常用到的一些属性简要归纳，以便日后快速查阅

// package.json 相关依赖版本
"react": "16.9.0",
"react-native": "0.61.5",
"@react-navigation/native": "^5.0.9",
"@react-navigation/stack": "^5.1.1",

具体 code 使用相关

<StatusBar // 设置状态栏样式相关
    backgroundColor='#1F80D6'
    barStyle='light-content'
/>
<Stack.Screen
    name="exam"
    options={{
        title : '选择考试', // 导航栏标题
        animationEnabled: true, // 是否启用动画效果，默认 true
        headerShown : false, // 是否渲染导航栏，默认 true
        headerStyle: { // 导航栏样式相关配置
          backgroundColor: '#1F80D6', // 导航栏背景颜色
        },
        // header : () => <ExamScreenHeaderView/>, // 导航栏整体视图，自定义可以使用该属性
        headerRight: () => <ExamScreenHeader />, // 右导航视图样式，对应的同时也有 headerLeft
    }}>
    {() => <ExamScreen {...state} />}
</Stack.Screen>

还有些属性没有涉及到，具体可以通过文档或官方方法对应的接口中查阅

以上便是此次分享的全部内容，希望能对大家有所帮助！