i created simple app in react native ,everything works fine
but when the app go to background then active again
Scrollview not working smoothly
can some one have solution?
Probably not the direct solution, but did you consider using <FlatList> instead of <ScrollView> given the former is more performant when it comes to rendering long lists.
i find the solution
i Uninstalled react-native-fbsdk and everything works fine
Related
I was trying to implement a WhatsApp like cancelling recording button.
Everything was working fine, all animations lauching correctly, start and stop recording too.
But after a few seconds (could be 10 seconds or 1 minute) pressing the gesture handler, the app freeze, all animations start to lags and FPS drop to 0.
After trying many things, I found out that it is linked with a Flatlist I have in my view. When this Flatlist is inverted, that is when everything crash.
Here is the link of the Snack https://snack.expo.dev/#mikelh997/animationtest
Just try to move the mic for at least 30 seconds on a physical device and you will see the app freeze
I am doing my tests on Android emulator and on Samsung S21 Ultra. On iOS everything seems to work fine
Thinking it was may be my packages version, I started a new project and put inside my view only a Flatlist with text items and my PanGestureHandler. All packages are up to date, even though the behavior is the same. If I remove "inverted" from my Flatlist, everything work fine.
I also tried to use Animated.Flatlist but no change (actually it's worse because inverted in Animated.Flatlist is not working correctly)
I also tried to reproduce it on Snack Expo, on my phone it crashes.
I noticed also that it is not linked to PanGestureHandler or Reanimated, because if I just create an animation with React Animated (with Animated.timing), and loop it, it does the same.
Edit : it seems like it is happening only on Android 13
After research, it is linked to Android 13, more and more people are facing this issue.
Only solution I found on Github was here, it is the only way to make it worked while waiting for a fix
style={{transform: [{rotate: '180deg'}]}} seems to be the best workaround for the time being.
I have an app that I am developing in React Native, using Expo. When I make a change to a deeply nested screen, I have to navigate back to that screen to check my changes.
Is it possible to configure React Native or Expo to go back to that screen after a reload?
I'm not sure if it matter, but I'm also using React-Navigation.
What I usually do is just switch the routes in the navigator config so that deeply nested screen is the first route... then you can work on it and make changes, and when you’re done just reset the routes to what they’re supposed to be. Does that make sense?
Try Running the app on a live device , Changes will be reflected directly on screen rather than going to root
How can we justify text in react native for both android and iOS without using webView, since webView is not visible in android after placing it inside another view.
The following option only works for iOS.
textAlign='justify'
https://facebook.github.io/react-native/docs/text.html#style
As it s written here, justify for android is not available... Most of the tricks suggest to use left or then a webview as you said...
Using webView resolved the issue. To show webView inside the ScrollView I just had to add height to webView.
https://github.com/jsdf/react-native-htmlview/issues/7
React Native Victory charts : onPress or onPressIn is not triggered in android. however it is OK in iOS.
Can anyone help me regarding this.
I found out (by reading other stackoverflow issues addressing similar problems) that wrapping the whole VictoryChart in an <Svg>...</Svg> solves this issue on Android and on the other hand keeps the onPress functionality on iOS. The only thing I realized on top was that I had to give the Svg a style={{height: XXX}} where XXX is the same height than the VictoryChart has. Otherwise the wrapping Svg would be gigantic high.
I'm interested in using a slide-out vertical navigation in an app using react-native. Is there a trick to this, or is it just a matter of creating a View and adding CSS that makes it respond to a button-tap or a swipe motion?
I've gone through the UIExplorer example in the Github repo, and did not see this style of navigation within it. I am new to react (and react-native, of course). I'm not having trouble with the tutorials I've gone through, just curious if there's a "React Way" to do this, or if I ought to just hack along until I get something working. Thanks.
I work on the <Navigator> component for React Native, and I think it might fit your needs.
Check out the documentation here: http://facebook.github.io/react-native/docs/navigator.html
And the example code in UIExplorer: https://github.com/facebook/react-native/blob/master/Examples/UIExplorer/Navigator/NavigatorExample.js
The navigator is still a work in progress, so feedback is welcome! (you can file an issue on Github and tag me, #ericvicenti)