react-native移动端。StatusBar、SafeAreaView不生效，状态栏，分屏状态。问题适配

望舒的头像
望舒
标签：
react-nativeStatusBarSafeAreaView状态栏分屏

问题场景

很奇葩。StatusBar、SafeAreaView都不生效，没有给到正确的屏幕安全空间，项目依赖版本又不能改动，只好通过StatusBar高度设置安全空间，这种方法，遇到分屏、小窗状态下会有空白，通过监听根视图高度和屏幕高度来判断状态来适配

实现方法

通过StatusBar的currentHeight获取状态栏高度

通过Dimensions.get('screen')获取到屏幕的最大高度

在应用根页面，设置一个高度、宽度为100%的View，并通过onLayout监听VIew的变化，与屏幕高度进行比较，判断是否分屏状态

代码实现

复制

import {Dimensions, StatusBar} from "react-native"

// 获取屏幕高度，宽度
const {width, height} = Dimensions.get('screen');

// 状态栏高度
StatusBar.currentHeight

// demo伪代码。注意不同系统版本间差异仍需适配，参考实际解决效果
export function Demo(props: React.PropsWithChildren) {

    const [isSplitScreen, setIsSplitScreen] = useState<boolean>(false)

    const onRootLayout = useCallback((e: LayoutChangeEvent) => {
        const {width, height} = e.nativeEvent.layout;
        setIsSplitScreen(height !== globalStyle.screenInfo.height)
    }, [])

    const rootStyle = useMemo<StyleProp<ViewStyle>>(() => isSplitScreen ? {
        width: "100%",
        height: "100%"
    } : {
        width: "100%",
        height: "100%",
        paddingTop: StatusBar.currentHeight
    }, [isSplitScreen])

    return <View style={rootStyle} onLayout={onRootLayout}>
        {props.children}
    </View>
}

作者：https://blog.xn--rpv331d.com/望舒

链接：https://blog.xn--rpv331d.com/望舒/blog/25

转载注意保留文章出处...

‌‌‌‌‌‌‌‌​‌‌​‌​‌‌‌​‌‌‌‌​‌​‌‌‌‌​‌‌‌‌‌‌‌​​‌​‌‌‌‌​‌‌‌​‌‌‌​​‌​‌​‌‌‌‌‌‌​‌‌‌​‌‌​‌‌​‌​‌‌‌​‌‌‌​​‌​‌‌‌‌‌‌‌‌​‌‌‌‌​‌​‌​‌‌‌‌‌‌​‌‌‌‌​‌​‌​‌‌‌‌‌‌‌‌‌‌‌‌‌​‌‌​‌‌‌‌‌‌‌‌‌​​‌​‌​‌‌​‌‌‌​‌‌‌​‌‌​‌‌​‌‌‌‌‌​‌‌‌​​‌​‌‌​‌​‌‌‌‌‌‌‌​‌‌​‌‌​‌‌‌‌‌​‌‌‌‌​‌​‌‌‌‌​‌‌‌‌‌‌‌​​‌​‌​‌‌​‌‌‌‌‌‌‌‌‌‌​‌​​‌​‌‌‌​​‌​‌‌‌‌​‌​​​​‌‌‌‌​‌​​‌‌‌‌​‌‌‌‌​‌​​​‌‌​‌​​‌​​​‌‌‌‌‌‌‌‌‌​‌‌​‌​‌‌‌​‌‌‌​​‌​‌‌‌‌‌‌‌‌‌‌‌‌​​‌​‌‌‌‌​‌‌‌​‌‌‌​‌‌​‌‌‌‌​‌‌‌​‌‌‌‌​‌​‌​‌‌​‌‌‌​‌‌‌​​‌​‌‌​‌‌‌‌‌​‌‌‌​​‌​‌​​‌​‌‌‌‌‌‌‌‌‌‌​‌‌​‌‌‌‌‌‌‌‌‌​​‌​‌​‌‌​‌‌‌​‌‌‌​‌‌​‌‌‌‌​‌‌‌​‌‌‌‌​‌​‌‌​‌​‌‌‌​‌‌‌‌​‌​‌‌​‌​‌‌‌​‌‌‌‌​‌​‌‌‌‌​‌‌‌​‌‌‌‌​‌​‌​‌‌‌‌‌‌‌‌‌‌‌‌‌​‌​‌‌​‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌​​‌​‌​‌‌​‌‌‌​‌‌‌​‌‌​‌‌​‌​‌‌‌​‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌​​‌​‌​​‌‌‌‌‌‌‌‌‌​‌‌​‌​​‌​‌‌‌​‌‌‌‌‌‌​‌‌‌‌​‌‌‌​‌‌‌​‌‌​‌​​‌​‌‌‌‌‌‌‌​‌‌​‌‌​‌‌‌‌‌‌‌‌‌​‌‌​‌‌​‌‌‌‌‌​‌‌‌‌​‌​‌​‌‌​‌‌‌​‌‌‌‌​‌​‌‌‌‌​‌‌‌​‌‌‌‌​‌​‌​​‌​‌‌‌‌‌‌‌‌​‌​‌​‌‌‌‌‌‌‌‌‌‌‌​‌​‌​‌‌‌‌‌‌‌‌‌‌‌​‌​‌‌‌‌‌‌‌‌​‌‌‌​​‌​‌‌​‌​‌‌‌‌‌‌‌​‌‌​‌​​‌​‌‌‌​‌‌‌​​‌​‌​‌‌‌‌‌‌​‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌​‌‌​‌‌​‌‌‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌‌​‌​‌‌​‌‌​‌​‌​‌‌‌​​‌‌​‌‌‌​‌‌​‌‌‌‌‌‌‌​​‌​‌​‌‌​‌‌‌‌‌‌‌​​‌​‌‌‌‌​‌‌‌​‌‌‌​​‌​‌​‌‌‌‌‌‌​‌‌‌​‌‌​‌‌​‌​‌‌‌​‌‌‌​​‌​‌‌‌‌‌‌‌‌​‌‌‌‌​‌​‌​‌‌‌‌‌‌​‌‌‌‌​‌​‌​‌‌‌‌‌‌‌‌‌‌‌‌‌​‌‌​‌‌‌‌‌‌‌‌‌​​‌​‌​‌‌​‌‌‌​‌‌‌​‌‌​‌‌​‌‌‌‌‌​‌‌‌​​‌​‌‌​‌​‌‌‌‌‌‌‌​‌‌​‌‌​‌‌‌‌‌​‌‌‌​​‌​‌‌‌‌‌‌‌‌‌‌‌‌​​‌​‌​‌‌​‌‌‌‌‌‌‌​​‌​‌‌‌‌​‌‌‌​‌‌‌‌​‌​‌‌​‌​‌‌‌​‌‌‌​​‌​‌‌‌‌‌‌‌‌​‌‌‌‌​‌​‌​‌‌​‌‌‌​‌‌‌​​‌​‌​​‌‌‌‌‌​‌‌‌​​‌​‌‌​‌‌‌‌‌​‌‌‌‌​‌​‌‌​‌​‌‌‌‌‌‌‌‌‌‌​‌‌​‌‌‌‌‌‌‌‌‌​​‌​‌​‌‌​‌‌‌​‌‌‌‌‌‌‌‌​​‌‌‌‌‌​‌‌‌​​‌​‌​‌‌​‌‌‌​‌‌‌​‌‌​‌‌​‌​‌‌‌​‌‌‌​​‌​‌‌‌‌‌‌‌‌​‌‌‌​‌‌​‌​​‌​‌‌‌​‌‌‌​‌‌​‌​‌‌‌‌‌‌‌‌‌‌​​‌​‌​‌‌​‌‌‌‌‌‌‌‌‌‌​‌​​‌​‌‌‌​‌‌‌​‌‌​‌‌‌‌​‌‌‌​‌‌‌‌​‌​‌‌​‌​‌‌‌​‌‌‌‌​‌​‌‌​‌​‌‌‌​‌‌‌‌​‌​‌‌‌‌​‌‌‌​‌‌‌‌​‌​‌​‌‌‌‌‌‌‌‌‌‌‌‌‌​‌​‌‌​‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌​​‌​‌​‌‌​‌‌‌​‌‌‌​‌‌​‌‌​‌​‌‌‌​‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌​​‌​‌​​‌‌‌‌‌‌‌‌‌​‌‌​‌​​‌​‌‌‌​‌‌‌‌‌‌​‌‌‌‌​‌‌‌​‌‌‌​‌‌​‌​​‌​‌‌‌‌‌‌‌​‌‌​‌‌​‌‌‌‌‌‌‌‌‌​‌‌​‌‌​‌‌‌‌‌​‌‌‌‌​‌​‌​‌‌​‌‌‌​‌‌‌‌​‌​‌‌‌‌​‌‌‌​‌‌‌‌​‌​‌​​‌​‌‌‌‌‌‌‌‌​‌​‌​‌‌‌‌‌‌‌‌‌‌‌​‌​‌​‌‌‌‌‌‌‌‌‌‌‌​‌​‌‌‌‌‌‌‌‌​‌‌‌​​‌​‌‌​‌​‌‌‌‌‌‌‌​‌‌​‌​​‌​‌‌‌​‌‌‌​​‌​‌​‌‌‌‌‌‌​‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌​‌‌​‌‌​‌‌‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌‌​‌​‌‌​‌‌​‌​‌​‌‌‌​​‌‌​‌‌‌​‌‌​‌‌‌‌‌‌‌‌‌‌​‌‌​‌​‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌​​‌​‌‌‌‌‌‌‌‌‌‌‌‌‌‌‌​‌​​‌​‌‌‌‌‌‌‌‌‌‌​‌‌​‌​‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌‌​‌​‌‌‌‌​‌‌‌‌‌‌‌‌‌‌​‌​​‌​‌‌‌‌‌‌‌‌‌‌​‌‌​‌​‌‌‌​‌‌‌‌​‌​‌‌‌‌​‌‌‌‌‌‌‌​​‌​‌‌‌‌​‌‌‌​‌‌‌​​‌​‌​‌‌‌‌‌‌​‌‌‌​‌‌​‌‌​‌​‌‌‌​‌‌‌​​‌​‌‌‌‌‌‌‌‌​‌‌‌‌​‌​‌​‌‌‌‌‌‌​‌‌‌‌​‌​‌​‌‌‌‌‌‌‌‌‌‌‌‌‌​‌‌​‌‌‌‌‌‌‌‌‌​​‌​‌​‌‌​‌‌‌​‌‌‌​‌‌​‌‌​‌‌‌‌‌​‌‌‌​​‌​‌‌​‌​‌‌‌‌‌‌‌​‌‌​‌‌​‌‌‌‌‌​‌‌‌‌​‌​‌‌‌‌​‌‌‌‌‌‌‌​​‌​‌​‌‌​‌‌‌‌‌‌‌‌‌‌​‌​​‌​‌‌​​‌​​‌‌‌​‌​​‌​‌​‌‌​‌‌​​​​‌‌​​‌​​​‌​​​‌‌​‌​​‌​​​‌‌‌‌‌‌‌‌‌​‌‌​‌​‌‌‌​‌‌‌​​‌​‌‌‌‌‌‌‌‌‌‌‌‌​​‌​‌‌‌‌​‌‌‌​‌‌‌​‌‌​‌‌‌‌​‌‌‌​‌‌‌‌​‌​‌​‌‌​‌‌‌​‌‌‌​​‌​‌‌​‌‌‌‌‌​‌‌‌​​‌​‌​​‌​‌‌‌‌‌‌‌‌‌‌​‌‌​‌‌‌‌‌‌‌‌‌​​‌​‌​‌‌​‌‌‌​‌‌‌​‌‌​‌‌‌‌​‌‌‌​‌‌‌‌​‌​‌‌​‌​‌‌‌​‌‌‌‌​‌​‌‌​‌​‌‌‌​‌‌‌‌​‌​‌‌‌‌​‌‌‌​‌‌‌‌​‌​‌​‌‌‌‌‌‌‌‌‌‌‌‌‌​‌​‌‌​‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌​​‌​‌​‌‌​‌‌‌​‌‌‌​‌‌​‌‌​‌​‌‌‌​‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌​​‌​‌​​‌‌‌‌‌‌‌‌‌​‌‌​‌​​‌​‌‌‌​‌‌‌‌‌‌​‌‌‌‌​‌‌‌​‌‌‌​‌‌​‌​​‌​‌‌‌‌‌‌‌​‌‌​‌‌​‌‌‌‌‌‌‌‌‌​‌‌​‌‌​‌‌‌‌‌​‌‌‌‌​‌​‌​‌‌​‌‌‌​‌‌‌‌​‌​‌‌‌‌​‌‌‌​‌‌‌‌​‌​‌​​‌​‌‌‌‌‌‌‌‌​‌​‌​‌‌‌‌‌‌‌‌‌‌‌​‌​‌​‌‌‌‌‌‌‌‌‌‌‌​‌​‌‌‌‌‌‌‌‌​‌‌‌​​‌​‌‌​‌​‌‌‌‌‌‌‌​‌‌​‌​​‌​‌‌‌​‌‌‌​​‌​‌​‌‌‌‌‌‌​‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌​‌‌​‌‌​‌‌‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌‌​‌​‌‌​‌‌​‌​‌​‌‌‌​​‌‌​‌‌‌​‌‌​‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌​​‌​‌​‌‌​‌‌‌​‌‌‌​‌‌​‌‌​‌​‌‌‌​‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌​​‌​‌​​‌‌‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌‌‌‌‌‌​‌​‌​‌‌​‌‌‌‌‌‌‌‌​‌​‌‌​‌‌‌‌‌‌‌‌‌​​‌​‌​‌‌​‌‌‌‌‌‌‌​​‌​‌‌‌‌​‌‌‌​‌‌‌​​‌​‌​‌‌‌‌‌‌​‌‌‌​‌‌​‌‌​‌​‌‌‌​‌‌‌​​‌​‌‌‌‌‌‌‌‌​‌‌‌‌​‌​‌​‌‌‌‌‌‌​‌‌‌‌​‌​‌​‌‌‌‌‌‌‌‌‌‌‌‌‌​‌‌​‌‌‌‌‌‌‌‌‌​​‌​‌​‌‌​‌‌‌​‌‌‌​‌‌​‌‌​‌‌‌‌‌​‌‌‌​​‌​‌‌​‌​‌‌‌‌‌‌‌​‌‌​‌‌​‌‌‌‌‌​‌‌‌​​‌​‌‌‌‌‌‌‌‌‌‌‌‌​​‌​‌​‌‌​‌‌‌‌‌‌‌​​‌​‌‌‌‌​‌‌‌​‌‌‌‌​‌​‌‌​‌​‌‌‌​‌‌‌​​‌​‌‌‌‌‌‌‌‌​‌‌‌‌​‌​‌​‌‌​‌‌‌​‌‌‌​​‌​‌​​‌‌‌‌‌​‌‌‌​​‌​‌‌​‌‌‌‌‌​‌‌‌‌​‌​‌‌​‌​‌‌‌‌‌‌‌‌‌‌​‌‌​‌‌‌‌‌‌‌‌‌​​‌​‌​‌‌​‌‌‌​‌‌‌‌‌‌‌‌​​‌‌‌‌‌​‌‌‌​​‌​‌​‌‌​‌‌‌​‌‌‌​‌‌​‌‌​‌​‌‌‌​‌‌‌​​‌​‌‌‌‌‌‌‌‌​‌‌‌​‌‌​‌​​‌​‌‌‌​‌‌‌​‌‌​‌​‌‌‌‌‌‌‌‌‌‌​​‌​‌​‌‌​‌‌‌‌‌‌‌‌‌‌​‌​​‌​‌‌‌​‌‌‌​‌‌​‌‌‌‌​‌‌‌​‌‌‌‌​‌​‌‌​‌​‌‌‌​‌‌‌‌​‌​‌‌​‌​‌‌‌​‌‌‌‌​‌​‌‌‌‌​‌‌‌​‌‌‌‌​‌​‌​‌‌‌‌‌‌‌‌‌‌‌‌‌​‌​‌‌​‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌​​‌​‌​‌‌​‌‌‌​‌‌‌​‌‌​‌‌​‌​‌‌‌​‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌​​‌​‌​​‌‌‌‌‌‌‌‌‌​‌‌​‌​​‌​‌‌‌​‌‌‌‌‌‌​‌‌‌‌​‌‌‌​‌‌‌​‌‌​‌​​‌​‌‌‌‌‌‌‌​‌‌​‌‌​‌‌‌‌‌‌‌‌‌​‌‌​‌‌​‌‌‌‌‌​‌‌‌‌​‌​‌​‌‌​‌‌‌​‌‌‌‌​‌​‌‌‌‌​‌‌‌​‌‌‌‌​‌​‌​​‌​‌‌‌‌‌‌‌‌​‌​‌​‌‌‌‌‌‌‌‌‌‌‌​‌​‌​‌‌‌‌‌‌‌‌‌‌‌​‌​‌‌‌‌‌‌‌‌​‌‌‌​​‌​‌‌​‌​‌‌‌‌‌‌‌​‌‌​‌​​‌​‌‌‌​‌‌‌​​‌​‌​‌‌‌‌‌‌​‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌​‌‌​‌‌​‌‌‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌‌​‌​‌‌​‌‌​‌​‌​‌‌‌​​‌‌​‌‌‌​‌‌​‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌​​‌​‌​‌‌​‌‌‌​‌‌‌​‌‌​‌‌​‌​‌‌‌​‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌​​‌​‌​​‌‌‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌‌‌‌‌‌​‌​‌​‌‌​‌‌‌‌‌‌‌‌​‌​‌‌​‌‌‌‌‌‌‌‌‌‌‌‌​‌‌​‌​‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌​​‌​‌‌‌‌‌‌‌‌‌‌‌‌‌‌‌​‌​​‌​‌‌‌‌‌‌‌‌‌‌​‌‌​‌​‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌‌​‌​‌‌‌‌​‌‌‌‌‌‌‌‌‌‌​‌​​‌​‌‌‌‌‌‌‌‌‌‌​‌‌​‌​‌‌‌​‌‌‌‌​‌​‌‌‌‌​‌‌‌‌‌‌‌​​‌​‌‌‌‌​‌‌‌​‌‌‌​​‌​‌​‌‌‌‌‌‌​‌‌‌​‌‌​‌‌​‌​‌‌‌​‌‌‌​​‌​‌‌‌‌‌‌‌‌​‌‌‌‌​‌​‌​‌‌‌‌‌‌​‌‌‌‌​‌​‌​‌‌‌‌‌‌‌‌‌‌‌‌‌​‌‌​‌‌‌‌‌‌‌‌‌​​‌​‌​‌‌​‌‌‌​‌‌‌​‌‌​‌‌​‌‌‌‌‌​‌‌‌​​‌​‌‌​‌​‌‌‌‌‌‌‌​‌‌​‌‌​‌‌‌‌‌​‌‌‌‌​‌​‌‌‌‌​‌‌‌‌‌‌‌​​‌​‌​‌‌​‌‌‌‌‌‌‌‌‌‌​‌​​‌​‌‌‌​​​​​‌‌​​‌​​​‌‌‌​​​​‌‌‌​​‌​​‌‌‌‌​‌‌​​‌​​​‌‌‌​​​‌‌‌‌‌​‌​‌‌​​​‌​‌‌​​‌​‌‌‌‌​‌​​‌​​​​‌‌​‌‌​‌‌‌‌​‌​‌‌‌‌‌​​​​‌‌​​​‌​​​​​‌‌​​​​​‌‌‌​​​​​‌‌‌‌‌‌​‌​‌​​​​​‌‌‌‌​​‌‌​‌​​​​‌‌‌‌‌‌​‌‌​‌​​‌​‌‌‌‌‌‌‌​‌‌​‌​​‌​‌‌‌‌‌‌‌​‌‌​‌​​‌​‌‌‌‌‌‌‌‌‌‌​‌‌​‌​‌‌‌‌‌‌‌​‌‌​‌​​‌‌‌‌‌​‌‌‌‌​‌​‌‌‌‌​‌‌‌‌‌‌‌‌‌‌​‌​​‌​‌‌
1
0
39
No data