React Native全面屏状态栏和底部导航栏适配教程详细讲解_React

import { View, StatusBar, useColorScheme } from "react-native";
import type { FC } from "react";
const App: FC = () => {
    const colorScheme = useColorScheme();
    return (
        <View>
            <StatusBar
                translucent={true}
                backgroundColor="rgba(0,0,0,0)"
                barStyle={colorScheme === 'dark' ? 'light-content' : 'dark-content'} // 设置文字颜色
            />
        </View>
    )
}
export default App;

@Override
protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  WindowCompat.setDecorFitsSystemWindows(getWindow(), false);
}

import android.os.Bundle;
import androidx.core.view.WindowCompat;

    <item name="android:navigationBarColor">@android:color/transparent</item>

<resources>
<!—Base application theme. >
<style name="AppTheme" parent="Theme .AppCompat. DayNight.NoActionBar">
<l—Customize your theme here.>
<item name="android:editTextBackground">@drawable/rn_edit_text_material</item>
<item name="android: navigationBarColor">@android:color/transparent</item>
<style>
<resources>