uni-app wgt 包的小程序播放 HDR 视频偏色问题,无法展示视频原始颜色与动态范围亮度,是否有开关可以设定?

发布于 1周前 作者 sinazl 来自 Uni-App

uni-app wgt 包的小程序播放 HDR 视频偏色问题,无法展示视频原始颜色与动态范围亮度,是否有开关可以设定?

操作步骤:

  1. uni nvue 用 <video> 标签加载播放视频;
  2. 用户上传HDR视频。

预期结果:

可以正常播放HDR视频,颜色正常,显示高动态范围

实际结果:

视频可以播放,但颜色不正常,且无法展示 HDR 内容。例如视频中有太阳,那么太阳的位置应该是屏幕最高亮度,但实际播放出来并不是

bug描述:

打包 wgt 包后,播放 HDR 视频时会偏色,无法展示视频原始影片颜色与动态范围亮度,原生基座是否有开关可以设定?小程序端用的是 <video> 标签

信息类别 详细信息
产品分类 uniapp/App
PC开发环境操作系统 Windows
PC开发环境操作系统版本号 win 11
HBuilderX类型 正式
HBuilderX版本号 3.3.11
手机系统 iOS
手机系统版本号 iOS 18
手机厂商 苹果
手机机型 iPhone 12 mini
页面类型 nvue
vue版本 vue2
打包方式 离线
项目创建方式 HBuilderX

4 回复

歪,有人吗? 客户追杀好多次了


兄弟,你解决了吗

同问,能不能解答一下

针对您提到的uni-app wgt包小程序播放HDR视频偏色问题,通常HDR(High Dynamic Range)视频处理涉及复杂的色彩管理和亮度映射,这在不同的平台和设备上可能表现不一。在uni-app框架中,直接控制HDR视频渲染的参数(如色彩空间、亮度范围等)较为有限,因为大部分底层实现依赖于小程序平台本身(如微信小程序、支付宝小程序等)的媒体播放组件。

不过,虽然uni-app本身可能没有直接的API来控制HDR视频的渲染设置,但我们可以尝试一些通用的方法来优化视频播放体验,尽管这些方法可能无法直接解决HDR偏色问题。以下是一些代码示例和思路,希望能为您提供一些启发:

1. 使用video组件并设置相关属性

首先,确保您使用的是uni-app的<video>组件,并尝试设置其属性以最佳化视频播放:

<template>
  <view>
    <video
      src="path/to/your/hdr/video.mp4"
      controls
      autoplay
      object-fit="cover"  <!-- 确保视频按比例填充容器 -->
      initial-time="0"
      danmu-list="[]"
      direction="0"
      show-center-play-btn
      show-full-screen-btn
    ></video>
  </view>
</template>

2. 尝试不同的视频编码格式

由于HDR视频对编码格式和色彩空间有特定要求,尝试将视频转换为不同的编码格式(如H.265/HEVC),并检查是否有所改善。这需要在视频制作阶段完成,而非代码中直接实现。

3. 使用平台特定的API(如果可用)

虽然uni-app追求跨平台一致性,但在某些情况下,平台特定的API可能提供更精细的控制。您可以考虑在条件编译中针对不同平台(如微信小程序)使用其提供的视频播放组件和API,查看是否有针对HDR视频的特殊设置。

// 示例:微信小程序平台特定代码(假设有相关API)
#ifdef MP-WEIXIN
wx.createVideoContext('myVideo', {
  // 尝试设置可能的HDR相关属性(假设存在)
  // 注意:此处的属性仅为示意,实际需参考微信官方文档
  hdrMode: 'auto',
}, this);
#endif

4. 联系平台支持

如果上述方法均无法解决问题,建议联系您所使用的小程序平台(如微信、支付宝等)的技术支持,询问是否有关于HDR视频播放的特殊设置或已知问题。

请注意,由于HDR视频处理涉及复杂的硬件和软件支持,最终的解决方案可能需要平台方的协助或更新。

回到顶部