React-Native iOS 状态栏

Posted 2023-04-18

【中文标题】React-Native iOS 状态栏

【英文标题】：React-Native iOS Status Bar

【发布时间】：2019-03-02 09:57:21

【问题描述】：

我正在使用 react-native 构建一个简单的应用程序。尝试更改状态栏中的背景颜色和内容颜色时遇到错误。我目前正在我的 iPhone 8 上进行测试。有人知道如何对状态栏进行这些更改吗？我检查了这个 [doc][1]，但它没有识别“路线”。请帮忙。谢谢 :) `

render() 

    return (

        <View>
            <StatusBar
            backgroundColor="red"
            barStyle="light-content"
             />
            <Button
                    title="go to Home"
                    color ="#841584"
            onPress=() => this.props.navigation.push('Home') />

        </View>      
    );

`

【参考方案1】：

请试试这个代码

import React,  Component  from 'react';

import  StyleSheet, View, StatusBar, Text, Platform  from 'react-native';

export default class Myproject extends Component 

  render() 

    return (

      <View style=styles.MainContainer>

        <StatusBar
          barStyle="dark-content"
          hidden=false
          backgroundColor="#fff"
          translucent=true
          networkActivityIndicatorVisible=true
        />

        <Text style= textAlign: 'center', fontSize: 25 > React Native Status Bar Example Tutorial </Text>

      </View>
    );
  


const styles = StyleSheet.create(

  MainContainer: 
    backgroundColor: 'red',
    justifyContent: 'center',
    flex: 1,
    marginTop: (Platform.OS == 'ios') ? 30 : 0

  

);