[video_player] Incorrect colors in HDR playback on iOS

Hi,

Video player plugin is not supporting HDR videos. When you try to play HDR video, it plays like SDR and different color.
You can try it video_player plugin's example, simply try to play any HDR video, you will notice different color video.

Video Player is top of AVPlayer and AVPlayer should play HDR videos automatically, but it didn't. I tried everything to find a workaround but no luck. Maybe https://developer.apple.com/news/?id=rwbholxw this helps.

Thanks,

@jmagman

Hey @jmagman , I suspect about "kCVPixelFormatType_32BGRA" in FLTVideoPlayerPlugin.m > createVideoOutputAndDisplayLink() function. But I'm not sure which value should be there.

@ibrahimdevs

Hi @ibrahimdevs,

Can you please provide a link to any HDR videos so that I may confirm this behaviour?

Thank you

@danagbemava-nc

Hi @danagbemava-nc ,

Thanks for your interest. I'm really stuck in this issue and very surprise that nobody even mentioned it until now.
Example HDR video link: https://drive.google.com/file/d/12plWrjPfp1Hh1G7LHHTBXaOAi8ki7m5d/view?usp=sharing

I'm getting lots of complaints about this issue from my app. If you provide any workaround, it will be great.
I moved video_player package files to locale, so I can try your workarounds.

Screenshots:

Thank you so much again,

@ibrahimdevs

Hi @ibrahimdevs, thanks for the sample. I can reproduce this with the video_player: ^2.2.5.
I haven't looked dived deep into the source code of the plugin so I can't suggest a work around at the moment, I will however label it so that someone with more experience can offer some more insight.

screenshots

AVPlayer iOS	video_player ios

flutter doctor -v

[✓] Flutter (Channel stable, 2.5.2, on macOS 11.5.1 20G80 darwin-arm, locale en-GB)
    • Flutter version 2.5.2 at /Users/nexus/dev/sdks/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 3595343e20 (5 days ago), 2021-09-30 12:58:18 -0700
    • Engine revision 6ac856380f
    • Dart version 2.14.3

[✓] Android toolchain - develop for Android devices (Android SDK version 31.0.0)
    • Android SDK at /Users/nexus/Library/Android/sdk
    • Platform android-31, build-tools 31.0.0
    • Java binary at: /Applications/Android Studio.app/Contents/jre/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7249189)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 12.5.1, Build version 12E507
    • CocoaPods version 1.11.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2020.3)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7249189)

[✓] VS Code (version 1.60.2)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.27.0

[✓] Connected device (3 available)
    • M2007J20CG (mobile) • 5dd3be00 • android-arm64  • Android 11 (API 30)
    • macOS (desktop)     • macos    • darwin-arm64   • macOS 11.5.1 20G80 darwin-arm
    • Chrome (web)        • chrome   • web-javascript • Google Chrome 94.0.4606.61

• No issues found!

code sample

import 'package:video_player/video_player.dart';
import 'package:flutter/material.dart';

void main() => runApp(const VideoApp());

class VideoApp extends StatefulWidget {
  const VideoApp({Key? key}) : super(key: key);

  @override
  _VideoAppState createState() => _VideoAppState();
}

class _VideoAppState extends State<VideoApp> {
  late VideoPlayerController _controller;

  @override
  void initState() {
    super.initState();
    _controller = VideoPlayerController.asset('assets/hdr_video.MOV')
      ..initialize().then((_) {
        // Ensure the first frame is shown after the video is initialized, even before the play button has been pressed.
        setState(() {});
      });
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Video Demo',
      home: Scaffold(
        body: Center(
          child: _controller.value.isInitialized
              ? AspectRatio(
                  aspectRatio: _controller.value.aspectRatio,
                  child: VideoPlayer(_controller),
                )
              : Container(),
        ),
        floatingActionButton: FloatingActionButton(
          onPressed: () {
            setState(() {
              _controller.value.isPlaying
                  ? _controller.pause()
                  : _controller.play();
            });
          },
          child: Icon(
            _controller.value.isPlaying ? Icons.pause : Icons.play_arrow,
          ),
        ),
      ),
    );
  }

  @override
  void dispose() {
    super.dispose();
    _controller.dispose();
  }
}

video asset

hdr_video.MOV.zip

I recently published a fork of video_player called video_player_hdr. It allows you to specify the desired viewType (either platform views or textures) in the initialize method. I've also added support methods to retrieve video metadata and check the device's HDR capabilities.
Feel free to try it out and suggest any improvements, thank you!

You can find it here: https://pub.dev/packages/video_player_hdr

I keep experiencing the same issue

Same, shows desaturated version of video on mobile (ios, android), web is fine.

[video_player] Fix washed-out HDR video playback on iOS

[video_player] Fix washed-out HDR video playback on iOS (flutter#11569)

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.

Navigation Menu

Repository navigation

[video_player] Incorrect colors in HDR playback on iOS #91241

37 remaining items

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

[video_player] Incorrect colors in HDR playback on iOS #91241

Description

Activity

ibrahimdevs commented on Oct 4, 2021

danagbemava-nc commented on Oct 5, 2021

ibrahimdevs commented on Oct 5, 2021

danagbemava-nc commented on Oct 5, 2021

37 remaining items

ibrahimdevs commented on Mar 21, 2025

rubengmlp commented on May 25, 2025

Sk8er22 commented on Aug 23, 2025

acheronian-flame commented on Sep 25, 2025

github-actions commented on Jul 14, 2026

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions