rive-app / rive-app/rive-react-native

requireNativeComponent: "RiveReactNativeView" was not found in the UIManager

Open
#200 3 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
783
Forks
81
Avg merge
3d 6h
Merged PRs (30d)
3

Description

<-- Thanks for using Rive!

If something isn't working like you expected, please:

If you think you found a bug or if you can't find what you're looking for
in our docs, fill out the template below.

-->

Description

When I launch my app i faced this issu
"require NativeComponent: "RiveReactNativeView" was not found in the UIManager

Provide a Repro

<--
Please provide the most minimal repro you can:
`
import {
StyleSheet,
Text,
View,
SafeAreaView,
TouchableOpacity,
} from "react-native";
import React from "react";
import Rive, { RiveRef } from "rive-react-native";
import { useState } from "react";
import { colors } from "../../styles/colors";
import LogIn from "./LogIn";

const STATE_MACHINE_NAME = "State Machine 1";

const url =
"https://public.uat.rive.app/community/runtime-files/148-325-tape.riv";

const styles = StyleSheet.create({
animation: {
width: "100%",
height: 400,
marginVertical: 20,
},
container: {
width: "100%",
height: "100%",
backgroundColor: colors.pink,
display: "flex",
justifyContent: "flex-end",
alignItems: "center",
},
button: {
position: "relative",
bottom: 77,
width: 330,
height: 60,
backgroundColor: colors.white,
borderRadius: 40,
display: "flex",
justifyContent: "center",
alignItems: "center",
},
buttonText: {
color: colors.blue,
fontWeight: "500",
fontSize: 20,
},
});

const SignIn = () => {
const [isLoaded, setIsLoaded] = useState(false);
const riveRef = React.useRef(null);
return isLoaded ? (

) : (


{" "}


<TouchableOpacity
style={styles.button}
onPress={() => setIsLoaded(true)}
>
Sign In



);
};

export default SignIn;
`
-->

Source .riv/.rev file

<--
Attaching runtime-exported .riv file that reproduces the issue is immensely helpful for our team to identify the problem as fast as possible and fix it.
Please also include the source (.rev) by downloading a backup from the Editor.

N.B. Because GitHub only supports certain file types use a ZIP archive to upload .riv/.rev files to this issue.

You can also privately share the .riv/.rev file with us at hello@rive.app.
-->
Screenshot 2023-09-05 at 10 33 56

Expected behavior

<-- A clear and concise description of what you expected to happen. -->

Screenshots

Screenshot

Device & Versions (please complete the following information)
  • Device: [e.g. Android Emulator, iOS Simulator]
  • OS: [e.g. Android SDK API Level 30, iOS 14.5]
  • NPM Version: [Copy-paste the output of npm --version e.g.: 7.10.2]
Additional context

<-- Add any other context about the problem here. -->

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the reported error with the provided SignIn example and the Rive component using resourceName="truck_v7". Check the package and native setup described by the issue; done means the component is registered in UIManager and the app launches without this error.

Written by the indexing model from the issue text.

Assessment

Tech stack
react-native, typescript
Domain
mobile
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
20/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.