Comments (24)
Sorry I accidentally put MainActivity stuff to MainApplication :D
So there are really two problems only:
- When adding
createReactActivityDelegate
inside MainActivity.java it sayserror: method does not override or implement a method from a supertype
pointing atcreateReactActivityDelegate
s@Override
error: cannot find symbol
return new ReactActivityDelegate(this, getMainComponentName()) {
^
My full MainActivity looks like this now:
import com.reactnativenavigation.controllers.SplashActivity;
import com.facebook.react.ReactActivityDelegate;
import com.facebook.react.ReactRootView;
import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;
public class MainActivity extends SplashActivity {
@Override
protected ReactActivityDelegate createReactActivityDelegate() {
return new ReactActivityDelegate(this, getMainComponentName()) {
@Override
protected ReactRootView createRootView() {
return new RNGestureHandlerEnabledRootView(MainActivity.this);
}
};
}
}
from react-native-gesture-handler.
I haven't tried using these two libs together. It seems like it may not be as easy as one could think. The reason is that both react-native-navigation and gesture-handler use ReactRootView
as an extension point: RNGestureHandlerEnabledRootView and ContentView
Also it seems like react-native-navigation doesn't allow you to swap out implementation of the root view in a way react-native on its own does (this library takes advantage of that and replaces the implementation of the rootview).
So in order to make it work one need to figure out how a custom implementation of rootview can be used with react-native-navigation then extend ContentView
by adding capabilities from gesture-handler's RootView to it. The easies solution would be to change ContentView class to extend
RNGestureHandlerEnabledRootView instead of ReactRootView
from react-native-gesture-handler.
Hey @henrikra ! I ended up figuring out a solution for this library to work with react-native-navigation. Just published alpha.32 that makes it possible for these two libraries to work together.
There is a separate installation path required for this to work. I documented it here: https://github.com/kmagiera/react-native-gesture-handler/blob/master/NATIVE_NAVIGATORS.md
Essentially instead of making changes in Java, you need to wrap each of your screens with gestureHandlerRootHOC
.
If you find some time to test it out and let me know how it works for you that would be fantastic!
from react-native-gesture-handler.
I made minimum repo which uses react-native-navigation
and react-native-gesture-handler
π
It is here: https://github.com/henrikra/nativeNavigationGestureHandler
I have two screens: First and Second. On the second screen I have draggable box. Look like when I am reloading JS on second screen which has your code it gives me this red screen. But If I am reloading in first screen which has almost nothing it does not give me red screen :)
I hope this helps you with your debugging :) π
from react-native-gesture-handler.
Glad it worked for you!
I also fixed one more issue I noticed with the HOC not passing navigatorStyle constant properly. Fixed it here 1970fd2 and published alpha.35 with this update. Let me know if you encounter any other issues related or unrelated to native navigation lib.
from react-native-gesture-handler.
@kmagiera and @henrikra thanks for working on this! Iβm needing to use both of these libs in a new project and now I can! Yβall are awesome. π
from react-native-gesture-handler.
@kmagiera So you are not using native navigation library like react-native-navigation
. I am using it because JS based navigation libraries suck :/
from react-native-gesture-handler.
No, sorry. I'm afraid that there is nothing I can do as far as making changes to this library to make it work with react-native-navigation. As I mentioned earlier it would require some changes in the navigation library by itself (e.g. allowing for custom root view class to be used)
from react-native-gesture-handler.
Because both react-native-navigation and react-native-gesture-handler are made because native performance. And it would make sense to use them together? What navigation library you usually use?
from react-native-gesture-handler.
@henrikra Thanks pushing for this, I believe it would be very valuable to get it work (I personally don't use this navigation library). Let's see what maintainers of the navigation library would say about it. In my opinion it would be required to change navigation API a bit so that it allows for pluggable rootview component or at least that would help with re-routing dispatchTouchEvent calls made to the rootview.
from react-native-gesture-handler.
Good to hear! Would it make sense to open this issue then? :)
from react-native-gesture-handler.
@kmagiera For sure! I can test today!!!
from react-native-gesture-handler.
I started doing the install and ran into compilation problems :D I have problems when readme tells me to update MainApplication.java like this:
// Don't forget imports
import com.facebook.react.ReactActivityDelegate;
import com.facebook.react.ReactRootView;
import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;
public class MainActivity extends ReactActivity {
// Add the following method to your main activity class
@Override
protected ReactActivityDelegate createReactActivityDelegate() {
return new ReactActivityDelegate(this, getMainComponentName()) {
@Override
protected ReactRootView createRootView() {
return new RNGestureHandlerEnabledRootView(MainActivity.this);
}
};
}
}
- applications using react-native-navigation does not extends from
ReactActivity
but instead ofNavigationApplication
This is why I am getting errormethod does not override or implement a method from a supertype
when compiling I guess. Here is example how MainApplication and MainActivity looks with react-native-navigation: https://wix.github.io/react-native-navigation/#/installation-android - in the example code there is
getMainComponentName
function but I don't have it or I don't see implementation in the README - Also getting this kind of error:
error: not an enclosing class: MainActivity
return new RNGestureHandlerEnabledRootView(MainActivity.this);
^
from react-native-gesture-handler.
@kmagiera Do have idea how to continue testing from here? :)
from react-native-gesture-handler.
You should ignore java changes part completely and instead do this https://github.com/kmagiera/react-native-gesture-handler/blob/master/NATIVE_NAVIGATORS.md
from react-native-gesture-handler.
Just keep your java code as it was before. When you follow the other guide no java changes are required instead of adding GestureHandlerPackage in the right place
from react-native-gesture-handler.
Ahaa! I would then make super clear on docs that those are two different routes :)
Looks like it is working! π I added simple box that I can drag!
One thing I noticed that now when I am doing Javascript reload it always gives me error (image below) for few seconds and then it reloads normally. It points to this library It looks like this:
Do you have idea for this?
from react-native-gesture-handler.
Makes sense, Iβll update the docs tomorrow, also have some idea on what this redbox might be for. Will try to fix tomorrow. Would you be open to publishing a sample app using native-navigation lib and gesture handler on Github? That would be very helpful for testing it in the future. Could be done as a separate repo or as a separate Example dir under gesture handler repo
from react-native-gesture-handler.
Sweet! Thanks! Do you mind if I point to your repo as an example from the docs?
from react-native-gesture-handler.
Sure man! Can please reopen this issue btw? Also did you manage to reproduce the red screen? π
from react-native-gesture-handler.
Sorry for getting back so late. Thanks for your sample app @henrikra β I managed to repro the issue and the fix is on its way
from react-native-gesture-handler.
Landed the fix in alpha.34 and submitted henrikra/nativeNavigationGestureHandler#1 to your sample app. Thanks again for your help!
from react-native-gesture-handler.
No worries! I have update the example repo with README now too. Future PRs are welcome too :)
from react-native-gesture-handler.
Will do π
from react-native-gesture-handler.
Related Issues (20)
- react native gesture handler htmlelement is not defined error HOT 8
- Error: Unable to resolve module hoist-non-react-statics from gestureHandlerRootHOC.tsx HOT 3
- <Swipeable> conflict with react navigation fullScreenGestureEnabled HOT 5
- Gestures on react-native-svg subcomponents have the wrong touchable area on Android
- Invariant Violation: TurboModuleRegistry.getEnforcing(...): 'RNGestureHandlerModule' could not be found. HOT 31
- Tap gesture with multiple pointers fail to start on `2.15.0` HOT 7
- Updating a SharedValue in useAnimatedScrollHandler ->Β onScroll does nothing HOT 1
- ReferenceError: __DEV__ is not defined HOT 5
- iOS app crash on tap onTouchesUp/onTouchesDown HOT 6
- Svg Image pointerEvents="none" not working on Android HOT 1
- Fatal Exception: com.facebook.jni.CppException: Exception in HostFunction: [Reanimated] Attempted to extract from a HostObject that wasn't converted to a Shareable. HOT 3
- Android: touch events are executed twice when talkback is enabled HOT 6
- Privacy manifest file for ios HOT 2
- Get wrong, negative value from e.absoluteY on Android HOT 1
- Android app crashes while composing different number of pointer taps in Gesture.Exclusive HOT 6
- Android only: after installing the package the build fails, when the app already runs the package works and its great HOT 3
- Pinch gesture focalX & focalY truncated on iOS HOT 2
- GestureDetector must be used as a descendant of GestureHandlerRootView. Otherwise the gestures will not be recognized HOT 9
- Application crashing after changing component tree HOT 2
- React Native App crashes without error message when GestureDetector appears HOT 6
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. πππ
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google β€οΈ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-native-gesture-handler.