Apply the correct transform for videos with different orientations

Author: AlexV525

packages/video_player/video_player_avfoundation/CHANGELOG.md

@@ -1,3 +1,7 @@
+## 2.3.2
+
+* Apply the correct transform for videos with different orientations.
+
 ## 2.3.1
 
 * Renames internal method channels to avoid potential confusion with the

packages/video_player/video_player_avfoundation/example/ios/RunnerTests/VideoPlayerTests.m

@@ -10,6 +10,7 @@
 
 @interface FLTVideoPlayer : NSObject <FlutterStreamHandler>
 @property(readonly, nonatomic) AVPlayer *player;
+@property(readonly, nonatomic) CGAffineTransform preferredTransform;
 @end
 
 @interface FLTVideoPlayerPlugin (Test) <FLTAVFoundationVideoPlayerApi>
@@ -121,6 +122,41 @@ - (void)testHLSControls {
   XCTAssertEqualWithAccuracy([videoInitialization[@"duration"] intValue], 4000, 200);
 }
 
+- (void)testTransformFix {
+  NSObject<FlutterPluginRegistry> *registry =
+      (NSObject<FlutterPluginRegistry> *)[[UIApplication sharedApplication] delegate];
+  NSObject<FlutterPluginRegistrar> *registrar = [registry registrarForPlugin:@"TestTransformFix"];
+  FLTVideoPlayerPlugin *videoPlayerPlugin =
+      (FLTVideoPlayerPlugin *)[[FLTVideoPlayerPlugin alloc] initWithRegistrar:registrar];
+
+  FlutterError *error;
+  [videoPlayerPlugin initialize:&error];
+  XCTAssertNil(error);
+
+  FLTCreateMessage *create = [FLTCreateMessage
+      makeWithAsset:nil
+                uri:@"https://flutter.github.io/assets-for-api-docs/assets/videos/bee.mp4"
+        packageName:nil
+         formatHint:nil
+        httpHeaders:@{}];
+  FLTTextureMessage *textureMessage = [videoPlayerPlugin create:create error:&error];
+  XCTAssertNil(error);
+  XCTAssertNotNil(textureMessage);
+  FLTVideoPlayer *player = videoPlayerPlugin.playersByTextureId[textureMessage.textureId];
+  XCTAssertNotNil(player);
+  XCTestExpectation *initializedExpectation = [self expectationWithDescription:@"initialized"];
+  [player onListenWithArguments:nil
+                      eventSink:^(NSDictionary<NSString *, id> *event) {
+                        if ([event[@"event"] isEqualToString:@"initialized"]) {
+                          [initializedExpectation fulfill];
+                        }
+                      }];
+  [self waitForExpectationsWithTimeout:30.0 handler:nil];
+  CGAffineTransform transform = player.preferredTransform;
+  XCTAssertEqual(transform.tx, 0.0f);
+  XCTAssertEqual(transform.ty, 0.0f);
+}
+
 - (NSDictionary<NSString *, id> *)testPlugin:(FLTVideoPlayerPlugin *)videoPlayerPlugin
                                          uri:(NSString *)uri {
   FlutterError *error;

packages/video_player/video_player_avfoundation/ios/Classes/FLTVideoPlayerPlugin.m

@@ -187,27 +187,46 @@ - (instancetype)initWithURL:(NSURL *)url
   return [self initWithPlayerItem:item frameUpdater:frameUpdater];
 }
 
+// Fix the transform for the given track.
+// Each fix case corresponding to `UIImage.Orientation`,
+// with 8 cases in total.
 - (CGAffineTransform)fixTransform:(AVAssetTrack *)videoTrack {
-  CGAffineTransform transform = videoTrack.preferredTransform;
-  // TODO(@recastrodiaz): why do we need to do this? Why is the preferredTransform incorrect?
-  // At least 2 user videos show a black screen when in portrait mode if we directly use the
-  // videoTrack.preferredTransform Setting tx to the height of the video instead of 0, properly
-  // displays the video https://github.com/flutter/flutter/issues/17606#issuecomment-413473181
-  if (transform.tx == 0 && transform.ty == 0) {
-    NSInteger rotationDegrees = (NSInteger)round(radiansToDegrees(atan2(transform.b, transform.a)));
-    NSLog(@"TX and TY are 0. Rotation: %ld. Natural width,height: %f, %f", (long)rotationDegrees,
-          videoTrack.naturalSize.width, videoTrack.naturalSize.height);
-    if (rotationDegrees == 90) {
-      NSLog(@"Setting transform tx");
-      transform.tx = videoTrack.naturalSize.height;
-      transform.ty = 0;
-    } else if (rotationDegrees == 270) {
-      NSLog(@"Setting transform ty");
-      transform.tx = 0;
-      transform.ty = videoTrack.naturalSize.width;
-    }
+  CGAffineTransform t = videoTrack.preferredTransform;
+  CGSize size = videoTrack.naturalSize;
+  if (t.a == 1 && t.b == 0 && t.c == 0 && t.d == 1) {
+    // Orientation.up
+    t.tx = 0;
+    t.ty = 0;
+  } else if (t.a == -1 && t.b == 0 && t.c == 0 && t.d == 1) {
+    // Orientation.upMirrored
+    t.tx = size.width;
+    t.ty = 0;
+  } else if (t.a == -1 && t.b == 0 && t.c == 0 && t.d == -1) {
+    // Orientation.down
+    t.tx = size.width;
+    t.ty = size.height;
+  } else if (t.a == 1 && t.b == 0 && t.c == 0 && t.d == -1) {
+    // Orientation.downMirrored
+    t.tx = 0;
+    t.ty = size.height;
+  } else if (t.a == 0 && t.b == -1 && t.c == 1 && t.d == 0) {
+    // Orientation.left
+    t.tx = 0;
+    t.ty = size.width;
+  } else if (t.a == 0 && t.b == -1 && t.c == -1 && t.d == 0) {
+    // Orientation.leftMirrored
+    t.tx = size.height;
+    t.ty = size.width;
+  } else if (t.a == 0 && t.b == 1 && t.c == -1 && t.d == 0) {
+    // Orientation.right
+    t.tx = size.height;
+    t.ty = 0;
+  } else if (t.a == 0 && t.b == 1 && t.c == 1 && t.d == 0) {
+    // Orientation.rightMirrored
+    t.tx = 0;
+    t.ty = 0;
   }
-  return transform;
+  return t;
 }
 
 - (instancetype)initWithPlayerItem:(AVPlayerItem *)item

packages/video_player/video_player_avfoundation/pubspec.yaml

@@ -2,7 +2,7 @@ name: video_player_avfoundation
 description: iOS implementation of the video_player plugin.
 repository: https://github.com/flutter/plugins/tree/master/packages/video_player/video_player_avfoundation
 issue_tracker: https://github.com/flutter/flutter/issues?q=is%3Aissue+is%3Aopen+label%3A%22p%3A+video_player%22
-version: 2.3.1
+version: 2.3.2
 
 environment:
   sdk: ">=2.14.0 <3.0.0"