我刚开始对本机做出反应,我正试图把我的文本放到android设备的状态栏下面。在我的ios设备上,“你好世界!”完全就在状态栏下面,但是在android设备上,"Hello!“就在状态栏里。有人能帮我移动文本吗?这样它就可以在状态栏下面。这是我的代码,以及它现在在我的android设备上的样子。
import React from "react";
import { StatusBar } from "expo-status-bar";
import { StyleSheet,Text,SafeAreaView,Platform } from "react-native";
export default function App() {
return (
<SafeAreaView style={styles.container}>
<Text style={styles.textColor}>Hello World!</Text>
<StatusBar style="auto" />
</SafeAreaView>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "rgba(0, 0, 0, 0.7)",
alignItems: "center",
paddingTop: Platform.OS === "android" ? StatusBar.currentHeight : 0,
},
textColor: {
color: "white",
},
});
当前android视图

发布于 2022-01-21 08:37:21
SafeAreaView不支持paddingTop尝试将其应用于View
<SafeAreaView style={styles.container}>
<View style={{ paddingTop: StatusBar.currentHeight }}>
...
</View>
</SafeAreaView>发布于 2022-08-04 17:11:18
我尝试了一些与反应结合起来的东西--自然状态-酒吧高度。
import {Animated, Platform} from "react-native";
import {getStatusBarHeight} from "react-native-status-bar-height";
import React from "react";
const StatusbarAndroid = () => {
return <Animated.View style={[{
minHeight:0,
height: Platform.OS === 'android' ? getStatusBarHeight() : 0}]}/>;
}
export default StatusbarAndroid;发布于 2022-08-04 18:33:22
使导入从react本机
import React from "react";
import { StyleSheet,Text,SafeAreaView,Platform, StatusBar } from "react-native";
export default function App() {
console.log(StatusBar.currentHeight)
return (
<SafeAreaView style={styles.container}>
<Text style={styles.textColor}>Hello World!</Text>
<StatusBar style="auto" />
</SafeAreaView>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "rgba(0, 0, 0, 0.7)",
alignItems: "center",
paddingTop: Platform.OS === "android" ? StatusBar.currentHeight : 0,
},
textColor: {
color: "white",
},
});
https://stackoverflow.com/questions/70798426
复制相似问题