9

I notice that touch apps rarely make use of the "drag n drop" (dnd) idiom, and instead dragging is almost always used for scrolling.

Is there a reason for this? Is it confusing or "wrong" to use dnd on touch? What about where scrolling is also required: can they be mixed effectively?

7

I think there are several reasons for it.

  1. First and foremost, it is tricky to do if you already have scrolling implemented. It is possible to do, but it would require solutions like lists where you can scroll in one direction (say, vertical), and then use the other direction to 'detach' the item from the list, after which you can drag it in any direction. That is not a trivial action to do, to learn, or (off topic here) to implement.
  2. Lots of touch interfaces have been geared towards small screens. Drag & drop often doesn't make sense on those screens, as it usually works by showing two or more containers of items you can drag & drop items between. However, these small screens are usually designed in a way that there only is one such container visible at any time. Still, on tablets or other larger-screen touch enabled systems, it could be used.
  • 6
    Part of the problem with small screens is that your finger is in the way, making it difficult to see what you are dropping on. – Brian Aug 6 '12 at 13:18
  • @Andre +1 and congo for 1K mark :) – sree Aug 6 '12 at 18:00
  • Issues we have encountered implementing this have pretty much all been covered: 1 - hare to implement on screens that already scroll. 2 - cant fit many options on screen so makes drag and drop undesireable. 3 you cant see what you are doing because your finger is in the way – Sheff Aug 7 '12 at 10:44
3

Another aspect that hasn't been mentioned is the loss of Long Press functionality by using a drag and drop field. Especially in Android, long press has come to represent the Right-Click of the touch world. Where a mouse has left and right, touch only has short and long.

  • 1
    So you are saying that by using long-press to invoke drag-drop on an object, you can't also have a context menu? Good point. – aaaidan Aug 6 '12 at 22:59
0

You can use event.preventDefault when draging and dropping or a touchHold so that way you can have both scrolling and dragging/dropping.

Trick is to bind mouse events with touch events.

https://mobiforge.com/design-development/touch-friendly-drag-and-drop

Double tap is tricky, but totally doable, here is one that worked for me.

https://gist.github.com/attenzione/7098476

When you use a double click event just add a doubletap event for that.

This way you can use doubletap, drag/drop and enable scrolling when not touchHold or drag and drop.

UPDATE: If you have a .draggable element, you can easily get the drag to initiate auto scroll by using a scroll option of scroll: true.

Example:

$('.className').draggable({
                helper: 'clone',
                scroll: true 
            });
  • this is very interesting, but it doesn't answer the question at all – Devin Oct 20 '16 at 21:12
  • It was my attempt to address the interplay of drag/drop & scrolling on touch enabled devices. I am learning about it currently and will update when I learn more. It seems that they are a bit tricky to implement together, I wouldn't say it's wrong, I would say it's error-prone. The reason drag/drop and scrolling aren't mixed often is due to the complexity of implementation. In regards to implementing it effectively, I don't yet have a perfect answer but the above is what I have tried and it has worked, somewhat. I'll update later. Also, I do think I answered the question, at least a little bit. – Dmitri Larionov Oct 20 '16 at 21:38
  • the question is about terminology, not implementation as in your answer. Again, your answer is very interesting, just not addressing what was asked – Devin Oct 20 '16 at 22:29

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.