rive-react-native
rive-react-native copied to clipboard
requireNativeComponent: "RiveReactNativeView" was not found in the UIManager
<-- Thanks for using Rive!
If something isn't working like you expected, please:
- Make sure you've updated rive-react-native to the latest version: https://www.npmjs.com/package/rive-react-native
- Check out our help center https://help.rive.app/
- You can file a new feature request at https://feedback.rive.app/
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<RiveRef>(null); return isLoaded ? ( <LogIn /> ) : ( <SafeAreaView style={styles.container}> <SafeAreaView> <Rive resourceName="truck_v7" ref={riveRef} />{" "} </SafeAreaView> <SafeAreaView> <TouchableOpacity style={styles.button} onPress={() => setIsLoaded(true)} > <Text style={styles.buttonText}>Sign In</Text> </TouchableOpacity> </SafeAreaView> </SafeAreaView> ); };
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 [email protected].
-->
Expected behavior
<-- A clear and concise description of what you expected to happen. -->
Screenshots
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 --versione.g.:7.10.2]
Additional context
<-- Add any other context about the problem here. -->
Any solutions?
docs: https://help.rive.app/runtimes/overview/react-native/adding-rive-to-expo
What fixed for me was that i cleared the Derived Data and close xCode and run the project again