Dimension.get('window').height 返回屏幕高度,而不是 RN v0.71.7 中的设备窗口高度

问题描述 投票:0回答:1

在某些(不是全部)Android 设备上观察到一种奇怪的行为,每当使用

Dimensions.get('window').height
时,它都会返回屏幕高度,因为 Android 导航栏也添加到组件的总高度中。

Android 属性:

avd.ini.encoding                 UTF-8
AvdId                            Nexus_7_API_32
disk.dataPartition.size          2G
fastboot.chosenSnapshotFile
fastboot.forceChosenSnapshotBoot no
fastboot.forceColdBoot           no
fastboot.forceFastBoot           yes
hw.accelerometer                 yes
hw.arc                           false
hw.audioInput                    yes
hw.battery                       yes
hw.camera.back                   virtualscene
hw.camera.front                  emulated
hw.cpu.ncore                     4
hw.device.hash2                  MD5:121629bcfab97028767e9021d5e4cdd1
hw.device.manufacturer           Google
hw.device.name                   Nexus 7 2013
hw.dPad                          no
hw.gps                           yes
hw.gpu.enabled                   yes
hw.gpu.mode                      auto
hw.initialOrientation            Portrait
hw.keyboard                      yes
hw.lcd.density                   320
hw.lcd.height                    1920
hw.lcd.width                     1200
hw.mainKeys                      no
hw.ramSize                       1536
hw.sdCard                        yes
hw.sensors.orientation           yes
hw.sensors.proximity             no
hw.trackBall                     no
image.androidVersion.api         32
image.sysdir.1                   system-images/android-32/google_apis/arm64-v8a/
PlayStore.enabled                false
runtime.network.latency          none
runtime.network.speed            full
showDeviceFrame                  yes
skin.dynamic                     yes
tag.display                      Google APIs
tag.id                           google_apis
vm.heapSize                      128

React Native 组件片段:

<FlatList 
snapToOffsets={[...Array(props.count)].map((x, i) => (i*Dimensions.get('window').height))}
renderItem={() => (
<View style={{ height: Dimensions.get('window').height }}></View> //this is taking full-height = window + android navigation bar.
)}
>

<Flatlist/>

在下图中,还添加了导航栏高度。

android reactjs react-native react-native-navigation
1个回答
0
投票

尝试使用React Native的useWindowDimensions

import {useWindowDimensions} from 'react-native'

const height = useWindowDimensions().height

https://reactnative.dev/docs/0.71/usewindowdimensions

© www.soinside.com 2019 - 2024. All rights reserved.