requireNativeComponent: "R2RTouchThroughWrapper" was not found in the UIManager.

[KirDontsov]

I did all the installation instructions, but get this error, what could it be?

My MainActivity.java:

package com.onlinerecordtypescript;
package com.reactnativetouchthroughviewexample;

import com.facebook.react.ReactActivity;
import com.facebook.react.ReactActivityDelegate;
import com.facebook.react.ReactRootView;
import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;

import android.view.MotionEvent;
import com.rome2rio.android.reactnativetouchthroughview.TouchThroughTouchHandlerInterface; 
import com.rome2rio.android.reactnativetouchthroughview.TouchThroughTouchHandler;

public class MainActivity extends ReactActivity implements TouchThroughTouchHandlerInterface {
    
    private TouchThroughTouchHandler touchThroughTouchHandler = new TouchThroughTouchHandler();
    /**
     * Returns the name of the main component registered from JavaScript.
     * This is used to schedule rendering of the component.
     */
    @Override
    protected String getMainComponentName() {
        return "onlineRecordTypeScript";
    }
    public TouchThroughTouchHandler getTouchThroughTouchHandler() {
        return touchThroughTouchHandler;
    }
    @Override
    protected ReactActivityDelegate createReactActivityDelegate() {
        return new ReactActivityDelegate(this, getMainComponentName()) {
            @Override
            protected ReactRootView createRootView() {
                return new RNGestureHandlerEnabledRootView(MainActivity.this);
            }
        };
    }
    @Override
    public boolean dispatchTouchEvent(MotionEvent ev) {
        touchThroughTouchHandler.handleTouchEvent(ev);

        return super.dispatchTouchEvent(ev);
    }
}

I'm using TypeScript.

I declared module in index.d.ts file:

/// <reference types="node" />

declare module "react-native-touch-through-view" {
  export const TouchThroughView = {} as any;
  export const TouchThroughWrapper = {} as any;
}

my component is:

const HomeScreen = (props: HomeScreenProps): JSX.Element => {
  return (
    <SafeAreaView
      style={props.darkTheme ? styles.containerDark : styles.containerLight}
    >
      <LightStatusBar />
      <TouchThroughWrapper style={styles.scrollWrapper}>
        <LoadAssets {...{ assets }}>
          <LinearGradient
            colors={
              props.darkTheme
                ? [blackColor, activeColor]
                : [activeColor, passiveColor]
            }
            style={styles.gradient}
          >
            <TouchThroughView
              style={{
                flex: 2,
                marginTop: 100,
                backgroundColor: "transparent"
              }}
            >
              <AppButton
                style={{ zIndex: 0 }}
                title="Записаться"
                onPress={() => props.navigation.navigate("Record")}
              />
            </TouchThroughView>

            <ScrollView style={{ zIndex: 2 }}>
              <Cities navigation={props.navigation} />
            </ScrollView>
          </LinearGradient>
        </LoadAssets>
      </TouchThroughWrapper>
    </SafeAreaView>
  );
};

[simonhoss]

Hi

Did you add it also inside the getPackages() in MainApplication.java?

Like this:

    @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
          new MainReactPackage(),
          new TouchThroughViewPackage()
      );
    }

[simonhoss]

Also in this repo it's working: https://github.com/AndresAltomobile/TouchThroughViewAndroidIssueDemo