Skip to content

[Android] createShadowNodeInstance function is not called  #34416

Description

@troZee

Description

In my library, I would like to update native parent view (probably it is called HostView), when react native child dimensions changed. I implemented it using onLayoutChange method but I would like to do it in synchronous manner. I just wanted to use shadow nodes for it, but for some reason it does not work, when fabric is enabled.

I checked all versions of RN from 68 and this issue occurs on all of them

Versions

68,69,70

Output of npx react-native info

System:
OS: macOS 12.1
CPU: (10) arm64 Apple M1 Pro
Memory: 128.70 MB / 32.00 GB
Shell: 5.8 - /bin/zsh
Binaries:
Node: 16.16.0 - ~/.nvm/versions/node/v16.16.0/bin/node
Yarn: 1.22.19 - ~/.nvm/versions/node/v16.16.0/bin/yarn
npm: 8.11.0 - ~/.nvm/versions/node/v16.16.0/bin/npm
Watchman: Not Found
Managers:
CocoaPods: 1.11.2 - /opt/homebrew/bin/pod
SDKs:
iOS SDK:
Platforms: DriverKit 21.2, iOS 15.2, macOS 12.1, tvOS 15.2, watchOS 8.3
Android SDK:
Android NDK: 24.0.8215888
IDEs:
Android Studio: 2021.2 AI-212.5712.43.2112.8815526
Xcode: 13.2.1/13C100 - /usr/bin/xcodebuild
Languages:
Java: 11.0.15 - sdkman/candidates/java/current/bin/javac
npmPackages:
@react-native-community/cli: Not Found
react: Not Found
react-native: Not Found
react-native-macos: Not Found
npmGlobalPackages:

Steps to reproduce

Apply below diff into RNTester

diff --git a/packages/rn-tester/android/app/src/main/java/com/facebook/react/uiapp/component/MyNativeViewManager.java b/packages/rn-tester/android/app/src/main/java/com/facebook/react/uiapp/component/MyNativeViewManager.java
index d8c8b731acb..d4de933f629 100644
--- a/packages/rn-tester/android/app/src/main/java/com/facebook/react/uiapp/component/MyNativeViewManager.java
+++ b/packages/rn-tester/android/app/src/main/java/com/facebook/react/uiapp/component/MyNativeViewManager.java
@@ -8,6 +8,8 @@
 package com.facebook.react.uiapp.component;
 
 import android.graphics.Color;
+import android.util.Log;
+
 import androidx.annotation.NonNull;
 import androidx.annotation.Nullable;
 import com.facebook.react.bridge.ReadableArray;
@@ -19,6 +21,11 @@ import com.facebook.react.uimanager.ViewProps;
 import com.facebook.react.uimanager.annotations.ReactProp;
 import com.facebook.react.viewmanagers.RNTMyNativeViewManagerDelegate;
 import com.facebook.react.viewmanagers.RNTMyNativeViewManagerInterface;
+import com.facebook.react.uimanager.LayoutShadowNode;
+import com.facebook.yoga.YogaMeasureFunction;
+import com.facebook.yoga.YogaMeasureMode;
+import com.facebook.yoga.YogaMeasureOutput;
+import com.facebook.yoga.YogaNode;
 
 /** View manager for {@link MyNativeView} components. */
 @ReactModule(name = MyNativeViewManager.REACT_CLASS)
@@ -27,6 +34,25 @@ public class MyNativeViewManager extends SimpleViewManager<MyNativeView>
 
   public static final String REACT_CLASS = "RNTMyNativeView";
 
+  public static class ExampleShadowNode extends LayoutShadowNode implements
+    YogaMeasureFunction {
+
+    public ExampleShadowNode() {
+      Log.d("", "ExampleShadowNode: ");
+    }
+    @Override
+    public long measure(
+      YogaNode node,
+      float width,
+      YogaMeasureMode widthMode,
+      float height,
+      YogaMeasureMode heightMode) {
+
+      return YogaMeasureOutput.make(width, height);
+    }
+
+  }
+
   private final ViewManagerDelegate<MyNativeView> mDelegate;
 
   public MyNativeViewManager() {
@@ -51,6 +77,16 @@ public class MyNativeViewManager extends SimpleViewManager<MyNativeView>
     return new MyNativeView(reactContext);
   }
 
+  @Override
+  public LayoutShadowNode createShadowNodeInstance() {
+    return new ExampleShadowNode();
+  }
+
+  @Override
+  public Class getShadowNodeClass() {
+    return ExampleShadowNode.class;
+  }
+
   @Override
   public void receiveCommand(
       @NonNull MyNativeView view, String commandName, @Nullable ReadableArray args) {

Current State:

ExampleShadowNode is not called

Expected State:

ExampleShadowNode should have been called

Snack, code example, screenshot, or link to a repository

callstack/react-native-slider#410

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions