Description
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