Fix backfaceVisibility after transform changes (#39294)

Summary:
Pull Request resolved: #39294

Because we now apply the transform property after all properties have been applied, the [custom logic we have for backfaceVisibility](https://github.com/facebook/react-native/blob/main/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/view/ReactViewGroup.java#L1004) no longer applied correctly.

Changelog: [Fixed] backfaceVisibility is correctly applied again after the transform changes.

Reviewed By: fabriziocucci

Differential Revision: D48968421

fbshipit-source-id: f94793f4c14fe0ecf686408ac41d7163c78dbc35

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/uimanager/BaseViewManager.java

@@ -481,8 +481,22 @@ public void setAccessibilityLiveRegion(@NonNull T view, @Nullable String liveReg
     }
   }
 
-  private static void setTransformProperty(
-      @NonNull View view, ReadableArray transforms, @Nullable ReadableArray transformOrigin) {
+  protected void setTransformProperty(
+      @NonNull T view,
+      @Nullable ReadableArray transforms,
+      @Nullable ReadableArray transformOrigin) {
+    if (transforms == null) {
+      view.setTranslationX(PixelUtil.toPixelFromDIP(0));
+      view.setTranslationY(PixelUtil.toPixelFromDIP(0));
+      view.setRotation(0);
+      view.setRotationX(0);
+      view.setRotationY(0);
+      view.setScaleX(1);
+      view.setScaleY(1);
+      view.setCameraDistance(0);
+      return;
+    }
+
     sMatrixDecompositionContext.reset();
     TransformHelper.processTransform(
         transforms,
@@ -554,17 +568,6 @@ private static float sanitizeFloatPropertyValue(float value) {
     throw new IllegalStateException("Invalid float property value: " + value);
   }
 
-  private static void resetTransformProperty(@NonNull View view) {
-    view.setTranslationX(PixelUtil.toPixelFromDIP(0));
-    view.setTranslationY(PixelUtil.toPixelFromDIP(0));
-    view.setRotation(0);
-    view.setRotationX(0);
-    view.setRotationY(0);
-    view.setScaleX(1);
-    view.setScaleY(1);
-    view.setCameraDistance(0);
-  }
-
   private void updateViewAccessibility(@NonNull T view) {
     ReactAccessibilityDelegate.setDelegate(
         view, view.isFocusable(), view.getImportantForAccessibility());
@@ -574,15 +577,12 @@ private void updateViewAccessibility(@NonNull T view) {
   protected void onAfterUpdateTransaction(@NonNull T view) {
     super.onAfterUpdateTransaction(view);
     updateViewAccessibility(view);
+
     Boolean invalidateTransform = (Boolean) view.getTag(R.id.invalidate_transform);
     if (invalidateTransform != null && invalidateTransform) {
       ReadableArray transformOrigin = (ReadableArray) view.getTag(R.id.transform_origin);
       ReadableArray transformMatrix = (ReadableArray) view.getTag(R.id.transform);
-      if (transformMatrix != null) {
-        setTransformProperty(view, transformMatrix, transformOrigin);
-      } else {
-        resetTransformProperty(view);
-      }
+      setTransformProperty(view, transformMatrix, transformOrigin);
       view.setTag(R.id.invalidate_transform, false);
     }
   }

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/view/ReactViewManager.java

@@ -314,8 +314,11 @@ public void setOpacity(@NonNull ReactViewGroup view, float opacity) {
   }
 
   @Override
-  public void setTransform(@NonNull ReactViewGroup view, @Nullable ReadableArray matrix) {
-    super.setTransform(view, matrix);
+  protected void setTransformProperty(
+      @NonNull ReactViewGroup view,
+      @Nullable ReadableArray transforms,
+      @Nullable ReadableArray transformOrigin) {
+    super.setTransformProperty(view, transforms, transformOrigin);
     view.setBackfaceVisibilityDependantOpacity();
   }