React Native Video 在 Android 平台上的 ResizeMode 渲染问题解析

在 React Native Video 6.0.0 版本中，Android 平台上出现了一个关于视频缩放模式的渲染问题。这个问题主要影响了视频在加载时的显示效果，导致用户体验下降。

问题现象

开发者在实现视频列表功能时发现，当使用 FlatList 滑动浏览视频时，Android 平台上会出现明显的视频缩放效果变化。具体表现为：

1. 视频在初始加载时会先以默认尺寸渲染
2. 随后才会应用开发者指定的 resizeMode 属性
3. 这种延迟应用导致了视觉上的"跳跃"效果

三种主要的 resizeMode 模式（contain、cover、none）都受到了影响，只有 stretch 模式能够保持稳定。

技术背景

这个问题源于 React Native Video 6.0.0 版本中对 ExoPlayer 的弃用和替换。在之前的 Alpha 版本中，视频能够同时应用 resizeMode 和样式属性，渲染过程是同步的。但在 Beta 版本中，渲染流程发生了变化：

1. 视频首先以原始尺寸渲染
2. 然后才应用 resizeMode 属性
3. 最后应用样式属性

这种分步渲染导致了视觉上的不连贯，特别是在视频列表快速滑动时更为明显。

解决方案

React Native Video 团队在 6.0.0 正式版中修复了这个问题。开发者可以采取以下措施：

1. 升级到 6.0.0 或更高版本
2. 如果暂时无法升级，可以使用 stretch 模式并手动控制视频尺寸
3. 对于需要精确控制视频显示的场景，建议通过计算视频宽高比来实现自定义布局

最佳实践

为了确保视频在不同平台上的显示一致性，建议开发者：

1. 始终使用最新版本的 React Native Video
2. 在实现视频列表时，考虑添加加载状态指示器
3. 对于关键视频内容，可以预先加载视频元数据以确定正确的显示尺寸
4. 在样式定义中明确指定视频容器的尺寸，避免依赖自动缩放

这个问题在 6.0.0 版本中已得到修复，Android 平台现在能够像 iOS 一样同步应用 resizeMode 和样式属性，确保了跨平台的一致性。