React Native Video 全屏模式退出后出现空白区域的解决方案

问题现象

在使用 React Native Video 组件时，Android 平台上出现了一个影响用户体验的问题：当用户点击默认控制条中的全屏按钮进入全屏模式，然后退出全屏后，屏幕顶部和底部会出现不必要的空白区域。这个问题不仅影响当前视频播放界面，还会影响整个应用的布局。

问题分析

经过技术分析，这个问题源于 ReactExoplayerView 在处理全屏模式时的系统窗口适配逻辑。具体表现为：

1. 进入全屏模式时，组件会将窗口的 decorFitsSystemWindows 属性设置为 false
2. 退出全屏模式时，组件会将该属性重置为 true
3. 但问题在于，原始值可能并不总是 true，导致退出全屏后系统错误地添加了额外的空白区域

解决方案

针对这个问题，社区开发者提出了一个有效的修复方案，通过修改 ReactExoplayerView.java 文件中的相关逻辑：

1. 在全屏操作前保存原始的 decorFitsSystemWindows 值
2. 退出全屏时恢复这个原始值，而不是简单地设置为 true

这个修复方案的核心思想是保持系统窗口适配状态的正确性，确保全屏操作不会破坏应用原有的布局行为。

实现细节

具体实现需要修改 ReactExoplayerView 类的以下部分：

1. 添加一个成员变量来存储原始的系统窗口适配状态
2. 在进入全屏前保存当前状态
3. 退出全屏时恢复保存的状态

这种修改方式既解决了问题，又保持了代码的健壮性，不会对其他功能产生负面影响。

临时解决方案

对于需要立即解决问题的开发者，可以考虑以下临时方案：

1. 使用自定义控制条替代默认控制条
2. 手动实现全屏逻辑，避免使用内置的全屏功能
3. 等待官方发布包含修复的新版本

总结

React Native Video 作为流行的视频播放组件，在实际使用中可能会遇到各种平台特定的问题。这个全屏模式退出后的空白区域问题是一个典型的 Android 平台适配问题，通过理解其根本原因并应用正确的修复方案，开发者可以确保视频播放体验的完整性。

对于长期维护的项目，建议关注官方更新，及时升级到包含此修复的版本。同时，理解这类问题的解决思路也有助于开发者更好地处理类似的技术挑战。