在某些(不是全部)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/>
在下图中,还添加了导航栏高度。
尝试使用React Native的useWindowDimensions
import {useWindowDimensions} from 'react-native'
const height = useWindowDimensions().height