是否可以使用 React Native 来定位具有动态岛屿的手机(iPhone 14 Pro 和 iPhone 14 Pro Max)?
为了补充其他答案,也可以使用 react-native-device-info
const iPhonesWithDynamicIsland = ['iPhone15,2', 'iPhone15,3']; // iPhone 14 Pro, iPhone 14 Pro Max
const isIphoneWithDynamicIsland = iPhonesWithDynamicIsland.includes(DeviceInfo.getDeviceId());
console.log(isIphoneWithDynamicIsland);
或者更简单:
DeviceInfo.hasDynamicIsland()
您可以通过使用
react-native-safe-area-context
获取其高度/顶部来简单地检测具有动态岛的 iPhone,如果是 59
那么此 iPhone 具有动态岛
import { useSafeAreaInsets } from 'react-native-safe-area-context';
const insets = useSafeAreaInsets();
console.log(insets.top == 59 ? true : false ) // has dynamic
// this is some of the other heights of other iPhones
59 - iPhone 14 Pro / 14Pro Max
50 - iPhone 13 mini
47 - iPhone 12 / 12Pro / 13 / 13Pro / 13Pro Max / 14 / 14 Plus
44 - on iPhoneX
20 - on iOS device
可以使用
react-native-device-info
的hasDynamicIsland()
方法。
import DeviceInfo from 'react-native-device-info';
let hasDynamicIsland = DeviceInfo.hasDynamicIsland();
// true