admin管理员组

文章数量:1418104

I’m building a React Native app using Expo and have been trying to customize the status bar color, but it still shows as black on the top and bottom of the screen.

I am testing the app through the Expo Go app on iOS.

Screen

Here’s the code I’m using:

import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { SafeAreaView, SafeAreaProvider } from 'react-native-safe-area-context';

export default function App() {
  return (
    <SafeAreaProvider>
      <SafeAreaView style={styles.container}>
        <Text style={styles.text}>Notice that the status bar has light text!  </Text>
      </SafeAreaView>
    </SafeAreaProvider>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: 'grey',
    alignItems: 'center',
    justifyContent: 'center',
  },
  text: {
    color: '#000',
  },});

I’ve also tried changing the background color and style in StatusBar, but the status bar is still black.

I want the status bar to match the background color of the SafeAreaView (grey).

Thanks!

本文标签：

版权声明：本文标题：ios - Why does the status bar in my React Native app still appear black even after using SafeAreaView and expo-status-bar? - Sta 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1745173923a2646140.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。