33:
293:, a programming environment for kids, introduced the modern notion of drag and drop blocks programming providing 4 core affordances: 1) Blocks that are end-user composable, 2) blocks are end-user editable, 3) blocks can be nested to represent tree structures, 4) blocks are arranged geometrically to define syntax. Drag and drop is also featured in many shader editing programs for graphics tools, such as
169:, extending "click and drag" to common clipboard operations like copying or moving textual content within a document. Content could also be dragged into the filesystem to create a "clipping file" which could then be stored and reused. Files could also be dropped on application windows, for example to enclose a document in an email, or add an image to a word processor document.
133:
Another problem is that the target of the dropping can be hidden under other objects. The user would have to stop the dragging, make both the source and the target visible and start again. In classic Mac OS the top-of-screen menu bar served as a universal "drag cancel" target. This issue has been
123:). However, drag-and-drop operations have the advantage of thoughtfully chunking together two operands (the object to drag, and the drop location) into a single action. Extended dragging and dropping (as in graphic design) can stress the mousing hand.
230:
Based on needed action, one of the above types can be used. Note that when an HTML element is dragged for moving its current position, its ID is sent to the destination parent element; so it sends a text and can be considered as the first group.
288:
systems. In contrast to more traditional, text-based programming languages, many end-user programming languages are based on visual components such as tiles or icons that are manipulated by end users through drag-and-drop interfaces.
82:, though it is sometimes a fast and easy-to-learn technique. However, it is not always clear to users that an item can be dragged and dropped, or what command is performed by the drag and drop, which can decrease usability.
479:
119:
Dragging requires more physical effort than moving the same pointing device without holding down any buttons. Because of this, a user cannot move as quickly and precisely while dragging (see
354:
or window for viewing or processing. For instance, dropping an icon that represents a text file into a
Microsoft Word window signifies "Open this document as a new document in Word"
71:
it to a different location or onto another virtual object. In general, it can be used to invoke many kinds of actions, or create various types of associations between two
572:
176:
with the button covering a large portion of the top surface of the mouse. This may mitigate the ergonomic concerns of keeping the button pressed while dragging.
272:
implements a drag-and-drop feature which allows the user to touch items (and tap with other fingers to drag more) within an app or between apps on
608:
216:
working draft specification includes support for drag and drop. HTML5 supports different kinds of dragging and dropping features including:
493:
521:
583:
547:
644:
457:
162:
added the ability to open a document in an application by dropping the document icon onto the application's icon.
130:
and drags items. Imprecise movement can cause an attempt to select an object to register as a dragging motion.
258:
Touch screen interfaces also include drag and drop, or more precisely, long press, and then drag, e.g. on the
17:
263:
127:
276:. On iPhones, the functionality is only available within the same app that the user started the drag.
616:
423:
372:
95:
52:
60:
246:(5.x). Google Images permits users to drag and drop image files into a browser to perform a
285:
247:
243:
201:
522:"iPad Drag and Drop, Multitasking, and Split View in iOS 11: Everything you need to know!"
443:
196:, leaving the primary one for selection and clicking. Its use like that of other advanced
139:
8:
322:
310:
400:
368:
294:
197:
351:
348:
329:
302:
64:
573:"Moving Beyond Syntax: Lessons from 20 Years of Blocks Programing in AgentSheets"
418:
185:
106:
72:
507:
284:
Drag and drop is considered an important program construction approach in many
155:
102:
638:
413:
358:
344:
333:
298:
239:
120:
396:
Most word processors allow dragging selected text from one point to another.
378:
Dragging an attribute onto an object to which the command is to be applied,
193:
173:
112:"Drag" the object to the desired location by moving the pointer to this one
465:
158:
to manipulate files (for example, copying them between disks or folders).
306:
290:
41:
386:
Dragging a tool to a canvas location to apply the tool at that location,
32:
166:
390:
297:. Drag and drop also features in some video game engines, including
326:
159:
135:
79:
49:
458:"Chunking and Phrasing and the Design of Human-Computer Dialogues"
381:
e.g. dragging a color onto a graphical object to change its color,
40:
is dragged onto a web browser icon, which opens the image in the
269:
259:
238:
supports drag-and-drop of images and attachments in the latest
235:
213:
37:
273:
189:
393:
from one location or word to another location or document.
78:
As a feature, drag-and-drop support is not found in all
444:
http://www.useit.com/alertbox/application-mistakes.html
548:"The iPhone is also getting drag and drop with iOS 11"
442:
Jakob
Nielsen, "Top-10 Application-Design Mistakes,"
200:
features distinguished native OS/2 applications from
364:
Adding objects to a list of objects to be processed,
321:A common example is dragging an icon on a virtual
90:The basic sequence involved in drag and drop is:
636:
580:Journal of Visual Languages and Sentient Systems
192:uses dragging and dropping extensively with the
462:Proceedings of the IFIP World Computer Congress
126:A design problem appears when the same button
67:selects a virtual object by "grabbing" it and
399:Dragging a series of code blocks such as in
455:
279:
172:For most of its history Mac OS has used a
27:Action in computer graphic user interfaces
494:"The Grand Unified Model (2): The Finder"
165:Apple added "Macintosh Drag and Drop" to
115:"Drop" the object by releasing the button
101:Press, and hold down, the button on the
31:
545:
14:
637:
234:Google's web-based e-mail application
403:for designing shaders and materials.
253:
609:"Render – Blender Reference Manual"
361:to a new location/directory/folder,
24:
464:. pp. 475–480. Archived from
220:Drag and Drop texts and HTML codes
25:
656:
601:
565:
546:Vincent, James (7 June 2017).
539:
514:
500:
486:
472:
449:
436:
13:
1:
429:
154:at the time, was used in the
145:
7:
407:
316:
223:Drag and Drop HTML elements
10:
661:
375:to customize their layout,
339:Further examples include:
207:
179:
85:
645:User interface techniques
508:"HTML5 W3C Working Draft"
138:with the introduction of
53:graphical user interfaces
424:Snap (computer graphics)
373:graphical user interface
280:In end-user programming
61:pointing device gesture
480:"Disk Swapper's Elbow"
194:secondary mouse button
150:Drag and drop, called
109:, to "grab" the object
45:
309:and, with expansion,
35:
286:end-user development
248:reverse image search
242:browser and Apple's
202:platform-independent
456:Buxton, W. (1986).
446:(19 February 2008).
226:Drag and Drop files
174:single button mouse
357:Moving or copying
198:Common User Access
156:original Macintosh
46:
254:On a touch screen
16:(Redirected from
652:
629:
628:
626:
624:
619:on 23 March 2015
615:. Archived from
605:
599:
598:
596:
594:
589:on 28 April 2019
588:
582:. Archived from
577:
569:
563:
562:
560:
558:
543:
537:
536:
534:
532:
518:
512:
511:
504:
498:
497:
490:
484:
483:
476:
470:
469:
453:
447:
440:
343:Dragging a data
303:GameMaker Studio
73:abstract objects
21:
660:
659:
655:
654:
653:
651:
650:
649:
635:
634:
633:
632:
622:
620:
607:
606:
602:
592:
590:
586:
575:
571:
570:
566:
556:
554:
544:
540:
530:
528:
520:
519:
515:
506:
505:
501:
496:. folklore.org.
492:
491:
487:
482:. folklore.org.
478:
477:
473:
468:on 7 June 2004.
454:
450:
441:
437:
432:
419:Point and click
410:
319:
282:
256:
210:
186:Workplace Shell
182:
148:
107:pointing device
88:
28:
23:
22:
15:
12:
11:
5:
658:
648:
647:
631:
630:
600:
564:
538:
513:
499:
485:
471:
448:
434:
433:
431:
428:
427:
426:
421:
416:
409:
406:
405:
404:
397:
394:
387:
384:
383:
382:
376:
365:
362:
355:
318:
315:
281:
278:
266:home screens.
255:
252:
228:
227:
224:
221:
209:
206:
181:
178:
152:click and drag
147:
144:
134:dealt with in
117:
116:
113:
110:
99:
87:
84:
26:
9:
6:
4:
3:
2:
657:
646:
643:
642:
640:
618:
614:
610:
604:
585:
581:
574:
568:
553:
549:
542:
527:
523:
517:
509:
503:
495:
489:
481:
475:
467:
463:
459:
452:
445:
439:
435:
425:
422:
420:
417:
415:
414:Mouse gesture
412:
411:
402:
398:
395:
392:
388:
385:
380:
379:
377:
374:
370:
366:
363:
360:
356:
353:
350:
346:
342:
341:
340:
337:
335:
331:
328:
325:to a special
324:
314:
312:
308:
304:
300:
299:Unreal Engine
296:
292:
287:
277:
275:
271:
267:
265:
261:
251:
249:
245:
241:
240:Google Chrome
237:
232:
225:
222:
219:
218:
217:
215:
205:
203:
199:
195:
191:
187:
177:
175:
170:
168:
163:
161:
157:
153:
143:
141:
137:
131:
129:
124:
122:
114:
111:
108:
104:
100:
98:to the object
97:
93:
92:
91:
83:
81:
76:
74:
70:
66:
63:in which the
62:
58:
57:drag and drop
54:
51:
43:
39:
34:
30:
19:
18:Drag-and-drop
621:. Retrieved
617:the original
612:
603:
591:. Retrieved
584:the original
579:
567:
555:. Retrieved
551:
541:
529:. Retrieved
525:
516:
502:
488:
474:
466:the original
461:
451:
438:
367:Rearranging
338:
332:to delete a
320:
283:
268:
257:
233:
229:
211:
183:
171:
164:
151:
149:
132:
125:
118:
89:
77:
68:
56:
47:
29:
613:blender.org
593:29 November
389:Creating a
307:Construct 2
291:AgentSheets
42:web browser
623:24 January
531:10 October
430:References
167:System 7.5
121:Fitts' law
552:The Verge
510:. w3.org.
391:hyperlink
146:In Mac OS
105:or other
94:Move the
639:Category
408:See also
327:trashcan
317:Examples
160:System 7
136:Mac OS X
80:software
69:dragging
50:computer
557:23 June
401:Blender
369:widgets
349:program
347:onto a
323:desktop
295:Blender
264:Android
208:In HTML
204:ports.
180:In OS/2
128:selects
96:pointer
86:Actions
270:iOS 11
260:iPhone
244:Safari
140:Exposé
587:(PDF)
576:(PDF)
526:iMore
371:in a
359:files
311:Unity
274:iPads
236:Gmail
214:HTML5
103:mouse
59:is a
38:image
625:2014
595:2018
559:2017
533:2017
352:icon
345:file
334:file
330:icon
212:The
190:OS/2
184:The
65:user
262:or
188:of
48:In
36:An
641::
611:.
578:.
550:.
524:.
460:.
336:.
313:.
305:,
301:,
250:.
142:.
75:.
55:,
627:.
597:.
561:.
535:.
44:.
20:)
Text is available under the Creative Commons Attribution-ShareAlike License. Additional terms may apply.
