在 Android 上单击“播放”按钮时，YouTube 嵌入式视频会显示开发人员选项

Posted 2023-05-07

【中文标题】在 Android 上单击“播放”按钮时，YouTube 嵌入式视频会显示开发人员选项

【英文标题】：YouTube Embedded Video Shows Developer Options when Click Play Button on Android

【发布时间】：2021-05-07 07:38:24

【问题描述】：

我在我的 React Native Expo 应用程序中使用嵌入式 YouTube 视频。嵌入视频位于WebView 中，来自react-native-webview。我遇到了一个奇怪的问题，我不确定它是在 YouTube 方面还是在 React Native 方面。

当我尝试点击 android 上的播放按钮时，我会在 YouTube 视频中看到开发者选项。视频无法播放，我无法“点击”这些选项。

当我按下播放键时，YouTube 嵌入视频在 WebView 中的样子

即使我清楚地点击播放器中心的播放按钮，我还是得到了这个菜单。看起来 Webview 要么对用户触摸输入反应不佳，要么认为它是一个 longPress。我没有长按视频。当我将 UI 剥离为仅占用整个屏幕的 WebView 时，它工作正常。长按，我看到这个菜单弹出。但是点击播放按钮一切正常。

似乎一旦我减小了 WebView 的大小（即使 YouTube 播放器根本没有被切断或压扁），它就无法正确响应。在 ios 上，一切正常。

设备出现问题 当我开始在三星 Galaxy S7 上进行测试时，我注意到了这个问题。在 Google Pixel 3 模拟器上运行应用程序似乎可以正常工作。

这是一个简单的 WebView，其中嵌入了 YouTube 视频。

<WebView
     allowsInlineMediaPlayback=true
     source= uri: "https://www.youtube.com/embed/WOi0vnzcEzA?playsinline=1&rel=0&mute=1autoplay=1&fs=0" 
 />

谢谢

【参考方案1】：

我最终弄清楚发生了什么。我希望这可以帮助将来的人。

我的 WebView 被包裹在 TouchableWithoutFeedback 中。出于某种原因（这可能是正确的行为，但超出了我的 RN 能力），它正在“阻止”正确的用户输入到 WebView。在我将 WebView 移到 TouchableWithoutFeedback 之外后，一切都按预期工作。