Unable to disable ons-splitter-side Gesture Detector
-
Hi Friends,
I want to disable Gesture Detector of ons-splitter-side on a specific screen as I need to provide drag and drop feature. I have done similar implementation in older version of Onsen UI by calling dispose() of gesture detector of body and ons-splitter-side BUT that’s not working in Onsen UI 2.7.0.
I have setup two Codepen samples to make this clear. Both the samples uses same CSS and JS libraries.
Sample 1 - **WORKING ** - The text can be dragged. It is directly inside the body. Have disposed Gesture Detector of body in controller.
Sample 2 - **NOT WORKING ** - The text can’t be dragged. It placed inside splitter side. Have tried disposing Gesture Detector of splitter side using ons.GestureDetector(document.getElementById(‘splitterMenuDemo’)).dispose() BUT it’s not working…
In older version of Onsen UI, it was done using document.getElementById(‘splitterMenuDemo’)._gestureDetector.dispose() BUT that’s throwing an error in new version.
I tried various other properties and functions but couldn’t find the solution.
A help here would be much appreciated.
Thanks & Regards,
CNaik.
-
@CNaik The one you are looking for is probably
document.getElementById(‘splitterMenuDemo’)._swipe.gestureDetector
.
-
Thank you for your quick reply.
Yes, the solution worked in Codepen. BUT didn’t work in the actual application which has content with more hierarchy of ons-splitter -> ons-splitter-content -> few navigation controller -> ons-page.
I have double checked the library linking and other such things. In fact OnDrag event is being called in controller. So I guess something else in Onsen UI might be blocking drag effect?
Can you give me advise what else could be preventing drag effect?
Regards,
CNaik.
-
@CNaik Oh! The navigator also has a GestureDetector now for the swipe-to-pop functionality. You can access it the same way as the splitter:
myNavigator._swipe.gestureDetector
.Hmm, maybe we should remove the gesture detector if the
swipeable
attribute is removed…
-
Moved one step closer.
I can make DIV draggable which directly on the page.But still DIVs under ons-list can’t be dragged. I tried getting list’s gesture detector without luck. What else in ons-list or ons-list-item can be preventing drag?
Regards,
CNaik.
-
@CNaik Can you try without
tappable
and ripple effects? I’m not really sure why :confused: