hammer js mousedown or tap down? - hammer.js

I want to create slider drag functionality which should initiate on mousedown of the handle. Right now, I don't see any event in hammer js that would fire once the element is touched. Is there something built in or do I use plain javascript to detect it?

The version 1.1 had inbuilt touch event.
However, after the rewrite newer version seems to be missing any such event, But you can create such a custom event as shown here, by modifying the tap gestures options.
Something like
var myOptions = { };
var mc = new Hammer.Manager(myElement, myOptions);
mc.add(new Hammer.Tap({ event: 'touch', taps: 1, interval:15, time:10 }));
mc.on("touch", handleTaps);
Or you can use the native touchstart event to detect a touch. However not that you don't have much control over this and will be triggered every time a touch occurs, for eg, like when the user is trying to scroll.

Related

MAUI CarouselView: how to imitate swipe effect in code? Swipe animation does not happen

.NET Maui CarouselView. In certain situations I want my app to take the user to the next card automatically. If I update CarouselView.Position or CarouselView.CurrentItem in code behind, it "jumps" to the next card immediately, no animation. Is it possible to imitate user's swipe? Or as a workaround, maybe somehow apply non-native-CarouselView animation manually to the CarouselView. Please advise.
The CarouselView contains a ScrollTo method that will animate the scroll for you. You either scroll to an index or a specific item.
Give your CarouselView a name in the XAML, and then in the code behind call the ScrollTo.
To scroll to an index:
carouselView.ScrollTo(6);
To scroll to a specific item:
var viewModel = BindingContext as MyViewModel;
var item = viewModel.Items.FirstOrDefault(m => m.Name == "TheBest");
carouselView.ScrollTo(item);
These methods have to be called from the code behind, so if you're using a MVVM approach, you'll need to fire an event or command from your VM for your code behind to act on.
For additional info, take a look at the ScrollTo method docs from Microsoft.

Detect double-click mouse event in a MKMapView (not iOS touch event)

I am writing a custom app using a MKMapView, and I need add a place mark in the map by clicking in the map view, but the mouseDown method is never called. I can not find any doc in the apple developer help.
Place a MKAnnotation is not problem.
Any one can help me with this
You'll need to disable mouse interaction with the MKMapView, by setting the scrollEnabled and zoomEnabled properties to No.
Once those are set the mouseDown and other mouse events fire as expected.

MonoDroid Click Delegate and Swipe Detection

I have a checkbox with a custom image for the button. I used the click delegate to perform an action whenever the button is clicked:
box.Click += { //do some stuff... }
This is working great.
However, now I have been given the requirement to add swipe detection to this checkbox (Sounds crazy but it does actually make sense for this app).
I added the swipe detection using the standard methods I am used to with normal Android in Java: I subclassed GestureDetector.SimpleOnGestureListener and also implemented View.IOnTouchListener.
I added the swipe detection to the checkbox as follows:
/*
SwipeListener implements View.IOnTouchListener
SwipeDetector is a subclass of GestureDetector.SimpleOnGestureListener
*/
SwipeListener listener = new SwipeListener(new GestureDetector(new SwipeDetector(this)));
box.SetOnTouchListener(listener);
When I do this, the swipe works great. But the click delegate no longer gets activated. I tried moving my code for the click to my SwipeDetector class, and that seemed to work.
But then I noticed that my checkbox was no longer getting its checked/unchecked state and so my custom image for it never changed.
I know this has got to be something simple, but I'm not seeing it... What is the proper way to have a click and a swipe on a view (checkbox) in Android/MonoDroid?
My guess without seeing your code is that you are returning true from OnTouch, meaning you have consumed the event and do not wish any further processing to occur using the event. Try returning false if you want the rest of the event to fire.
http://developer.android.com/reference/android/view/View.OnTouchListener.html

When I get a mouseDragged event, how can I find out if it is dragging a window or just a file?

I want to respond to the drag event when it is dragging a file but not a window.
I got the mouseDragged event like this:
[NSEvent addGlobalMonitorForEventsMatchingMask:NSLeftMouseDraggedMask
handler: ^(NSEvent *mouseDraggedEvent){
//do something with event
}];
The drag and drop system is implemented atop the event-handling system. The event-handling system (which is what you are monitoring) has no concept of what is being dragged, just that a mouse drag is occurring.
If you want to know what is being dragged then you will need to record the location of the mouse at the start of the drag and use that to calculate what is being dragged. You could use the accessibility APIs for this.

Disable Events on Child

Im using Ext JS 4. I have a button inside a container. I want the container to receive mouseover, mouseout, and click events, but the button is causing the mouseover and mouseout event handlers to be called twice on the container. How can i disable the events on the child button?
I believe you are running to 4.0's new bubbleEvents behavior. Components now propagate some events to their parent containers. This happens in code, independent of DOM event bubbling, up the component hierarchy.
http://dev.sencha.com/deploy/ext-4.0.0/docs/api/Ext.container.Container.html
The best fix is to simply stop the event once you've handled it. That should prevent all bubbling, component or DOM. It is generally a good idea to do this for click events to make sure one and only one thing happens in response to a click, but I'm less certain it's appropriate for mouseover and mouseout.
panel.on('click', function(e) {
e.stopEvent();
// do your stuff
});
another fix you could try (I haven't) is to wipe bubbleEvents on the button.
Another, possibly less robust fix is to turn on event buffering:
el.on('click', this.onClick, this, {buffer: 10});
Buffering collapses duplicate events in a configurable time window into one and it's useful for smoothing out rapid fire or duplicate UI events, but I'm not sure how it plays with bubbling.
{
...
preventDefault: true,
...
}

Resources