用户使用一根手指,将内容从一个位置拖拽到另一个位置,然后抬起手指将其放置,以此完成移动或复制选中的照片、文本或其他内容。

DragDrop.mp4 (1.66MB) 长按选中的内容,使其看起来会上升并附着在用户的手指上。当内容被拖动,动画和视觉提示将识别可能的目标位置。系统还会显示一个标记,指示何时不能放置,或者放置将导致内容被复制而不是被移动。 有关开发人员指南,请参阅 UIKit 中的拖放

来源与目的地

拖放涉及将所选内容从源位置移动到目标位置。这两个位置可以位于同一容器中,比如文本视图;也可以位于不同的容器中,例如拆分视图中位于另一侧的文本视图。例如,在「便签」中,用户可以将所选文本拖动到同一便签中的新位置。在「提醒事项」中,用户可以将单个提醒从一个列表中拖出,然后放入另一个列表中。

屏幕快照 2019-10-02 02.56.46.png

在 iPad 上,源位置和目标位置也可以是位于不同的应用程序中,从而实现跨应用交互,例如将照片从 Safari 中的网页拖动到「邮件」中的新邮件。在拖动内容时,用户可以通过多任务处理、退出主屏幕,或者从屏幕底部向上轻扫以显示 Dock 来访问其他应用程序。

提醒 在应用程序之间拖放内容,一般结果是复制内容,而不是移动内容。

支持拖放

拖放是一种高效、直观的功能,用户希望可以在整个系统中普遍使用。如果你的应用包含或可以生成人们可能想要移动、复制或插入的文本、照片、视频、音频等内容,则应用应支持拖放操作。

拖放可用于所有可选择、可编辑的内容。可选择的内容应可被拖动,可编辑内容应接受拖动来的内容。还要确保你的应用支持在这些区域中复制和粘贴。

适用时,允许内容被拖动到控件上。通常,输入、选择数据的配置控件,如文本字段,可以接受拖拽来的内容。

尽可能使用标准文本视图和文本字段。这些系统提供的元素包括对拖放的内置支持。有关相关指导,请参阅文本字段文本视图。有关开发人员指南,请参阅 UITextFieldUITextView

屏幕快照 2019-10-02 03.07.13.png

为了提高效率,请考虑支持多项目拖放。在许多应用中,用户可以用一根手指拖动单个项目,在拖动时,通过用另一根手指点击其他项目来选择其他项目。所选项目一起移动,并堆叠在拖动原始项目的手指下方。然后,用户将项目作为一个组拖动,并将其拖放到所需的目标上。例如,主屏幕允许同时选择多个应用图标并拖动到文件夹中。某些应用如「相册」提供选择模式,可在拖动之前选择多个项目。

屏幕快照 2019-10-02 03.09.25.png

确定在应用中拖放的内容,应当被移动还是被复制。通常,当源容器和目标容器相同时(在文档中拖动文本),应当为移动,而当它们不同时(在文档之间或应用之间拖动),应当为复制。然而,情况并非总是如此。最重要的是,拖放应该直观。「提醒事项」中,在列表之间拖动项目则是移动它们,而不是复制它们,因为这是人们的期望。在应用之间拖放内容始终是被复制。

只要有可能,就让人们撤消拖放。通常,当用户无意中将内容放置在错误的目标位置时,他们应该能够使用「撤消」将应用返回到其以前的状态。也就是说,应删除放置的内容,如果是从应用的其他位置移动过来的,则还原到其原始位置。

请考虑使用弹性加载。使用弹性加载,用户可以通过将选定的内容拖动到这些控件上并短暂停留,来激活某些控件,如按钮和分段控件,同时内容不会被放置。例如,在「邮件」中,所选邮件可以拖到导航栏的「后退」按钮上,以到达邮箱中的其他层级位置。切勿将弹性加载作为激活控件的唯一方法。将它作为一个可以被发现的点缀。在大多数情况下,弹性加载的控件还应响应点击手势。有关开发人员指南,请参阅 UISpringLoadedInteraction

提供拖放内容

如有必要,自定义拖动项目的预览。通常,显示在用户手指下的预览应该是所拖动内容的半透明表示形式。此样式提供上下文,指示拖动正在进行,并使用户能够查看拖动内容下的目的位置。

尽可能提供从高保真度到低保真度的,多种拖动数据的表示形式。例如,在提供线条图时,你的应用可以提供 PDF 矢量表示、具有透明度的无损 PNG 图像以及没有透明度的有损的 JPEG 图像。这样,目标位置可以选择导入的最高质量表示形式。

在适用的情况下,将自定义对象的原始版本作为数据最丰富的形式。例如,允许用户拖动图表的应用,应将原始图标对象作为首要的展示对象。然后,它应该为不支持图表对象的应用提供替代方案,如图表的图像版本。

当应用内容的传输耗时或资源密集时,请使用 File Provider 扩展。File Provider 扩展管理传输过程,并确保传输的完成,即使你的应用不再运行。请注意,在用户拖放内容之前,传输过程不会开始。有关开发人员指南,请参阅 NSFileProviderExtension

在应用的内容传输需要时间时,提供相关进度信息。如果必须下载内容或大型文件需要时间进行复制,请提供进度信息。至少提供内容的总大小,以便目标位置可以计算剩余时间,并显示适当的进度指示器。有关开发人员指南,请参阅 NSProgress

接收拖放内容

使用视觉提示来识别潜在目标位置,并预览拖放内容的效果。高亮、插入点指示器、动画都是确定可能目标位置的好方法。当内容被拖动到视图上时,视图可能会轻微的闪烁或更改颜色,又或者段落被分开,为拖动的图像腾出空间。当屏幕上有多个可能的目标位置时,请一次标识一个。如果源容器和目标容器相同,则可能不需要高亮显示,除非内容完全拖出源容器,然后重新进入。当内容被拖放或不再位于目标位置上方时,确保高亮不再显示。

适当地自动滚动目标位置的内容。当内容拖出目标位置的边界时,你的应用可能需要确定是滚动目标位置的内容还是允许用户继续拖动到完全不同的目标位置。如果应用允许用户继续拖动,当拖动的项目位于其上方时,请考虑定义自动滚动的区域。例如,当内容拖动到正文区域的顶部或底部时,「邮件」中的长草稿邮件会自动滚动。标准文本视图和文本字段会自动采用此行为。

提取并显示拖放内容最丰富的可能表示形式。例如,可能会为你的应用提供图表的多个表示形式。如果你的应用支持图表,它可以提取和显示原始图表对象。如果应用不支持图表,则可以提取并显示图表的图像版本。

如果可以,仅提取拖放内容的相关部分。例如,如果用户将联系人从「联系人」拖动到「邮件」中的收件人字段,则仅使用姓名和电子邮件地址,而不是联系人的地址信息。

放置内容后,在表视图和集合视图中显示占位符。占位符会暂时指示内容传输完成后的位置。

当放置内容需要时间时,显示传输的进度。默认情况下,在应用之间发生耗时的传输时,系统会显示应用模式的弹窗。请考虑自定义进度的显示方式,例如,在表视图或集合视图中的占位符上显示进度指示器,以防阻碍用户使用你的应用。请注意,在用户放置内容之前,传输过程不会开始。

当放置的内容启动进程时,提供反馈。如果用户将内容放置到启动任务的控件上,例如将视频上载到共享网站,请显示该任务已启动,并随时告知用户其进度。

放置失败时要告知用户。如果无法插入放置的内容,可能是因为文件传输中断,请告知用户放置失败。

对放置的文本使用适当的样式。当源位置和目标位置支持相同样式的文本属性时,放置的文本应保持其原始字形、字体、大小和其他属性。否则,放置的文本应采用目标位置的样式。

当用户无法立即撤消拖放时,考虑提供一种细微、直观的退出方式。例如,共享应用在展示放置的内容前,可能会显示中间状态的共享工作表。此共享表提供了一种给出附加内容的方式,如状态消息,同时还提供取消按钮。当照片被拖入共享的照片流时,照片会表现出此行为。