React Native DrawerLayout：儿童的阴影出现在iOS上但不出现在Android

Question

我有一个应用程序，它使用具有GestureHandler.DrawerLayout抽屉样式的Expo "back"，以便视图位于固定抽屉的顶部并向下滑动以显示它。为了强调这种安排，我想在内容View上添加一个投影，投射在抽屉内容上。到目前为止，我已经在iOS上工作了，但在Android上没有。

为了与我的应用程序的其余部分分开进行探索，我已经分配了react-native-gesture-handler项目并修改了horizontalDrawer示例应用。我在这里为阴影添加了风格道具：

https://github.com/kmagiera/react-native-gesture-handler/compare/2542bd39503412ef00883e0e799caf7d1f68ef3a...brettdh:shadows-broken-on-android

正如您在this screenshot中看到的那样，阴影会出现在iOS上，但不会出现在Android上。但是，如果我通过注释掉this line来删除绝对定位，我会看到阴影实际上被剪切在左侧，正如您在this screenshot中看到的那样。

我已经挖了一下组件树并尝试过：

• 将影子道具移动到包装器View
• 清除overflow: hidden
  • （虽然现在我的理解是overflow: visible仅适用于iOS）

我发现讨论描述这与绝对定位有关，但即便如此，我也不认为我可以避免这种情况，因为它是DrawerLayout本身的一部分。有关如何在iOS和Android上实现相同阴影效果的想法吗？

Answer 1

进一步的调查表明，DrawerLayout使a View around my component放置（可能）剪切阴影。如果我将elevation道具放在View上（与backgroundColor一起），则不再剪切阴影。

这可能意味着我需要制作PR以在此包装器View上启用自定义样式。