How can I check the version of a Lottie file? - react-native

I am building a react native app using expo and trying to use a couple lottie files using the lottie-react-native library. When I use the iOS simulator the files load fine, but when I try to run the app on my actual iPhone I get this warning:
"ReactNative.NativeModules.LottieAnimationView.pause did not have a corresponding prop defined
in the mock provided to SafeModule"
I know that expo relies on Lottie v2 so v3 files will cause the app to crash, but is it normal for the Lottie animations to work on the simulator but not the phone? And is there a way for me to check if an animation is v2? I can't seem to find any kind of indication of version when browsing the animations.
Thanks to anyone who can help!

Related

How do I implement Google Maps to work on Web, Andriod and iOS in React Native?

I am fairly new to React Native and I am trying to implement a map that can be used in Web, Android and iOS.
The resources I have found online, are for implementing Android and iOS with react-native-maps or just in Web with react-native-web-maps. Is there an easy way to incorporate all of them in React Native?
I am also using the Expo CLI to run the server. I have not run npm run eject to create the OS-specific files as I am trying to make the code as cross-platform as possible.
I don't know if any package works straight away for all environments but you can conditionally render map component for mobile and for web.
I have used these following packages in mobile and web versions of Expo app, they work pretty similarly and are easy to use and implement:
-mobile: #react-navigation/native
-web: #react-google-maps/api

Lottie Performance expo (react native)

I’m having problems with the performance of a composition at the expo (react native), I tried to change the image to vector but I couldn’t solve the problem. Could someone help me with this problem?
https://lottiefiles.com/28372-world27
There are known issues with Lottie working on expo, check the docs below
“ The Lottie SDK is currently considered to be under Expo's "DangerZone" because it's implementation is still in Alpha.
Importing Lottie 3 files causes the previewer to crash without a visible error, because Expo relies on lottie-react-native v2.”
https://docs.expo.io/versions/latest/sdk/lottie/

Using native modules like Google Maps in a React Native app and Expo

Relatively new to React Native, I’m using AirBnb’s react native maps package in my app, and all the tutorials talk about getting Google Maps (rather than Apple Maps) to work in iOS by going into my iOS folder and managing the cocoapods dependencies etc.
I don’t completely remember, but I created my app with expo init, or maybe with create-react-native-app, and I don’t have an iOS folder. From what I’ve read it looks like I can get the separate folders by ejecting my app.
Here is what my actual question is about: The question is basically “Can I use Google Maps in an iOS MapView and still code my app in React Native and run it in Expo in both Xcode simulator and Android emulator, and still have hot/live loading?”
You could abstract the question just a bit and phrase it as “Can I follow the instructions on, say, a MapView tutorial, to use native dependencies, having iOS and Android folders, and still write my app in React Native and run it in both simulators with hot/live loading?”
(Or, once I’m using the native stuff do I have to code in Swift/Java and Xcode/Android Studio?)
As noted in the expo documentation, expo already contains a google maps map view.
https://docs.expo.io/versions/latest/sdk/map-view/
if you didn't create your app with expo but just with the create-react-native-app command you can use this package maintained by the RN community:
https://github.com/react-native-community/react-native-maps
This package uses native components so you need to link it (only if you don't use expo) and then you can just use it in your screens as a normal component.

When React-Native generates an ios and android folder, what part can I change?

So currently, I'm working on moving my React Native project outside of Expo and using regular React Native.
As I expect, it generates an ios and Android folder. However, there are about 5k+ worth of files and folders being generated here.
I know that React Native allows you to write your hybrid code in JSX which generates native code in your android and ios folder. You can also write custom native code in the android and ios folders.
My question, how do I know what exactly React Native generates in those folders and which of those files won't be clobbered if I make changes to it?

Heatmap.js in expo react native application

Looking into using a heatmap with my react native application using the expo sdk- really do not wish to detach the app from expo, so i was wondering if there was a way to get heatmap.js into my application without linking library to xcode?
I've seen this, and get the approach of creating a webview to display the heatmap in but you still need to link heatmap.min.js to xcode bundle