feat: refactor resize prop handler (#3286)

android/src/main/java/com/brentvatne/exoplayer/ReactExoplayerViewManager.java

@@ -119,16 +119,6 @@ public class ReactExoplayerViewManager extends ViewGroupManager<ReactExoplayerVi
         return builder.build();
     }
 
-    @Override
-    public @Nullable Map<String, Object> getExportedViewConstants() {
-        return MapBuilder.<String, Object>of(
-                "ScaleNone", Integer.toString(ResizeMode.RESIZE_MODE_FIT),
-                "ScaleAspectFit", Integer.toString(ResizeMode.RESIZE_MODE_FIT),
-                "ScaleToFill", Integer.toString(ResizeMode.RESIZE_MODE_FILL),
-                "ScaleAspectFill", Integer.toString(ResizeMode.RESIZE_MODE_CENTER_CROP)
-        );
-    }
-
     @ReactProp(name = PROP_DRM)
     public void setDRM(final ReactExoplayerView videoView, @Nullable ReadableMap drm) {
         if (drm != null && drm.hasKey(PROP_DRM_TYPE)) {
@@ -212,8 +202,23 @@ public class ReactExoplayerViewManager extends ViewGroupManager<ReactExoplayerVi
 
 
     @ReactProp(name = PROP_RESIZE_MODE)
-    public void setResizeMode(final ReactExoplayerView videoView, final String resizeModeOrdinalString) {
+    public void setResizeMode(final ReactExoplayerView videoView, final String resizeMode) {
-        videoView.setResizeModeModifier(convertToIntDef(resizeModeOrdinalString));
+        switch (resizeMode) {
+            case "none":
+            case "contain":
+                videoView.setResizeModeModifier(ResizeMode.RESIZE_MODE_FIT);
+                break;
+            case "cover":
+                videoView.setResizeModeModifier(ResizeMode.RESIZE_MODE_CENTER_CROP);
+                break;
+            case "stretch":
+                videoView.setResizeModeModifier(ResizeMode.RESIZE_MODE_FILL);
+                break;
+            default:
+                DebugLog.w("ExoPlayer Warning", "Unsupported resize mode: " + resizeMode + " - falling back to fit");
+                videoView.setResizeModeModifier(ResizeMode.RESIZE_MODE_FIT);
+                break;
+        }
     }
 
     @ReactProp(name = PROP_REPEAT, defaultBoolean = false)
@@ -430,12 +435,4 @@ public class ReactExoplayerViewManager extends ViewGroupManager<ReactExoplayerVi
                 || lowerCaseUri.startsWith("file://")
                 || lowerCaseUri.startsWith("asset://");
     }
-
-    private @ResizeMode.Mode int convertToIntDef(String resizeModeOrdinalString) {
-        if (!TextUtils.isEmpty(resizeModeOrdinalString)) {
-            int resizeModeOrdinal = Integer.parseInt(resizeModeOrdinalString);
-            return ResizeMode.toResizeMode(resizeModeOrdinal);
-        }
-        return ResizeMode.RESIZE_MODE_FIT;
-    }
 }

ios/Video/RCTVideo.swift

@@ -56,7 +56,7 @@ class RCTVideo: UIView, RCTVideoPlayerViewControllerDelegate, RCTPlayerObserverH
     private var _playWhenInactive:Bool = false
     private var _ignoreSilentSwitch:String! = "inherit" // inherit, ignore, obey
     private var _mixWithOthers:String! = "inherit" // inherit, mix, duck
-    private var _resizeMode:String! = "AVLayerVideoGravityResizeAspectFill"
+    private var _resizeMode:String! = "cover"
     private var _fullscreen:Bool = false
     private var _fullscreenAutorotate:Bool = true
     private var _fullscreenOrientation:String! = "all"
@@ -429,12 +429,32 @@ class RCTVideo: UIView, RCTVideoPlayerViewControllerDelegate, RCTPlayerObserverH
     // MARK: - Prop setters
 
     @objc
-    func setResizeMode(_ mode: String?) {
+    func setResizeMode(_ mode: String) {
-        if _controls {
+        var resizeMode: AVLayerVideoGravity = .resizeAspect
-            _playerViewController?.videoGravity = AVLayerVideoGravity(rawValue: mode ?? "")
+        
-        } else {
+        switch mode {
-            _playerLayer?.videoGravity = AVLayerVideoGravity(rawValue: mode ?? "")
+        case "contain":
+            resizeMode = .resizeAspect
+            break
+        case "none":
+            resizeMode = .resizeAspect
+            break
+        case "cover":
+            resizeMode = .resizeAspectFill
+            break
+        case "stretch":
+            resizeMode = .resize
+            break
+        default:
+            resizeMode = .resizeAspect
         }
+        
+        if _controls {
+            _playerViewController?.videoGravity = resizeMode
+        } else {
+            _playerLayer?.videoGravity = resizeMode
+        }
+        
         _resizeMode = mode
     }
 

ios/Video/RCTVideoManager.swift

@@ -84,15 +84,6 @@ class RCTVideoManager: RCTViewManager {
         })
     }
 
-    override func constantsToExport() -> [AnyHashable : Any]? {
-        return [
-            "ScaleNone": AVLayerVideoGravity.resizeAspect,
-            "ScaleToFill": AVLayerVideoGravity.resize,
-            "ScaleAspectFit": AVLayerVideoGravity.resizeAspect,
-            "ScaleAspectFill": AVLayerVideoGravity.resizeAspectFill
-        ]
-    }
-
     override class func requiresMainQueueSetup() -> Bool {
         return true
     }

src/Video.tsx

@@ -8,9 +8,8 @@ import React, {
   type ComponentRef,
 } from 'react';
 import {View, StyleSheet, Image, Platform} from 'react-native';
-import NativeVideoComponent, {RCTVideoConstants} from './VideoNativeComponent';
+import NativeVideoComponent from './VideoNativeComponent';
 import type {
-  NativeVideoResizeMode,
   OnAudioFocusChangedData,
   OnAudioTracksData,
   OnPlaybackStateChangedData,
@@ -150,19 +149,6 @@ const Video = forwardRef<VideoRef, ReactVideoProps>(
       };
     }, [source]);
 
-    const _resizeMode: NativeVideoResizeMode = useMemo(() => {
-      switch (resizeMode) {
-        case 'contain':
-          return RCTVideoConstants.ScaleAspectFit;
-        case 'cover':
-          return RCTVideoConstants.ScaleAspectFill;
-        case 'stretch':
-          return RCTVideoConstants.ScaleToFill;
-        default:
-          return RCTVideoConstants.ScaleNone;
-      }
-    }, [resizeMode]);
-
     const _drm = useMemo(() => {
       if (!drm) {
         return;
@@ -476,7 +462,7 @@ const Video = forwardRef<VideoRef, ReactVideoProps>(
           src={src}
           drm={_drm}
           style={StyleSheet.absoluteFill}
-          resizeMode={_resizeMode}
+          resizeMode={resizeMode}
           fullscreen={isFullscreen}
           restoreUserInterfaceForPIPStopCompletionHandler={
             _restoreUserInterfaceForPIPStopCompletionHandler

src/VideoNativeComponent.ts

@@ -4,7 +4,6 @@ import type {
   ViewProps,
 } from 'react-native';
 import {NativeModules, requireNativeComponent} from 'react-native';
-import {getViewManagerConfig} from './utils';
 
 // -------- There are types for native component (future codegen) --------
 // if you are looking for types for react component, see src/types/video.ts
@@ -233,15 +232,13 @@ export type OnVideoErrorData = Readonly<{
 export type OnAudioFocusChangedData = Readonly<{
   hasFocus: boolean;
 }>;
-
-export type NativeVideoResizeMode = unknown;
 export interface VideoNativeProps extends ViewProps {
   src?: VideoSrc;
   drm?: Drm;
   adTagUrl?: string;
   allowsExternalPlayback?: boolean; // ios, true
   maxBitRate?: number;
-  resizeMode?: NativeVideoResizeMode;
+  resizeMode?: 'none' | 'cover' | 'contain' | 'stretch';
   repeat?: boolean;
   automaticallyWaitsToMinimizeStalling?: boolean;
   textTracks?: TextTracks;
@@ -364,22 +361,9 @@ export interface VideoDecoderPropertiesType {
   isHEVCSupported: () => Promise<'unsupported' | 'hardware' | 'software'>;
 }
 
-export type VideoViewManagerConfig = {
-  Constants: {
-    ScaleNone: unknown;
-    ScaleToFill: unknown;
-    ScaleAspectFit: unknown;
-    ScaleAspectFill: unknown;
-  };
-  Commands: {[key: string]: number};
-};
-
 export const VideoManager = NativeModules.VideoManager as VideoManagerType;
 export const VideoDecoderProperties =
   NativeModules.VideoDecoderProperties as VideoDecoderPropertiesType;
-export const RCTVideoConstants = (
-  getViewManagerConfig('RCTVideo') as VideoViewManagerConfig
-).Constants;
 
 export default requireNativeComponent<VideoNativeProps>(
   'RCTVideo',

src/utils.ts

@@ -1,5 +1,5 @@
 import type {Component, RefObject, ComponentClass} from 'react';
-import {Image, UIManager, findNodeHandle} from 'react-native';
+import {Image, findNodeHandle} from 'react-native';
 import type {ImageSourcePropType} from 'react-native';
 import type {ReactVideoSource} from './types/video';
 
@@ -35,11 +35,3 @@ export function getReactTag(
 
   return reactTag;
 }
-
-export function getViewManagerConfig(name: string) {
-  if ('getViewManagerConfig' in UIManager) {
-    return UIManager.getViewManagerConfig(name);
-  }
-
-  return UIManager[name];
-}