如何在 react-native 中检测屏幕是否有圆角答案

【问题标题】：How to detect if screen has rounded corners in react-native如何在 react-native 中检测屏幕是否有圆角
【发布时间】：2019-02-08 07:42:50
【问题描述】：

如何检测设备屏幕是否有圆角并估计圆角的半径（如果可能）？

我想修改我的view 更常见的是cardview 以适应这些屏幕。我已经使用Dimensions成功检索了屏幕width和height

width: Dimensions.get('window').width,
height: Dimensions.get('window').height

我无法通过上述方法根据 4 个角的曲线调整我的父视图。如果我为父视图提供静态半径，它会在矩形屏幕上产生不好的外观和感觉，这是不可接受的。

我想到的一种方法是生成所有圆角设备的列表，并将边框半径仅应用于这些设备。但是维护列表并根据市场上的新人调整列表变得更加困难。

有人可以帮我吗？任何形式的方法或指南都会真正帮助我。提前谢谢你

【问题讨论】：

【解决方案1】：

在努力解决之后，我提出了一个更简单的解决方案，为什么我不应该在应用程序第一次启动时询问用户他/她是否有圆角屏幕，然后在我的应用程序下的设置中提供一个选项以随时更改用户想要的。

我将用户的选择存储在本地存储中，并根据该标志修改了我的视图。现在我不必维护所有设备的列表，而是涵盖所有用例。

【讨论】：

【解决方案2】：

目前没有从Dimensions 获取角半径的选项。下面给出的维度对象中只有 4 个值。

{ width: 384, height: 592, scale: 2, fontScale: 1 }

【讨论】：

【解决方案3】：

即使您已经回答并接受了自己的答案，这也不是原始帖子的真正解决方案。

我认为基本上所有带有凹槽的手机都有圆角，而没有凹槽的设备通常没有圆角。如果您有凹槽，则您的安全区域中有一个插图。例如，如果您使用 react-native-safe-area-context，则可以使用

const insets = useSafeAreaInsets();
const hasNotch = insets.top || insets.bottom || insets.right || insets.left;

【讨论】：