X数码驿站
新浪微博
微信
当前位置:X数码驿站网 » 历史

【iOS12人机交互指南】3.6-拖拽

该系列是iOS12人机交互指南的翻译,翻译的过程中加深自己的理解。

通过一个手指,用户可以移动或复制选定的照片、文本或其他内容,方法是将内容从一个位置拖动到另一个位置,然后抬起手指将其放下。

点击并按住选定的内容会让它看起来上升并附着在用户的手指上。当内容被拖动时,动画和视觉线索识别可能的目的地。系统还会显示一个标记,指示何时不能删除内容,何时会复制内容而不是移动内容。

源位置和目标位置

拖拽包含将选定内容从源位置移动到目标位置。这些位置可以位于相同的容器中,如文本视图,也可以位于不同的容器中,如分屏视图两侧的文本视图。例如,在Notes中,用户可以将选中的文本拖动到相同Notes中的新位置。在Reminders中,用户可以将单个提醒从一个列表中拖出,并将其拖放到另一个列表中。

在iPad上,源位置和目标位置也可以存在于不同的应用程序中,从而实现跨应用程序的交互,比如将照片从Safari网页拖放到邮件中的新消息中。在拖动内容时,用户可以通过多任务处理、退出到主屏幕或从屏幕底部向上滑动以显示Dock来访问另一个应用程序。

请注意:在应用程序之间拖拽内容总是会复制内容,而不是移动。

支持拖拽

拖拽是一种高效、直观的特性,用户希望在整个系统中广泛应用。如果你的应用程序包含用户可能想要移动、复制或插入的文本、照片、视频、音频或其他内容,你的应用应该支持拖拽。

为所有可选择和可编辑的内容提供拖拽功能。可选择的内容应该是可拖动的,可编辑的内容应该接受放置的内容。还要确保你的应用支持在这些区域复制和粘贴。

适当情况下允许在控件上拖放内容。通常情况下,可以对控件进行配置,使数据输入或选择(如文本区域)能够接受拖放的内容。

尽可能使用标准文本视图和文本字段。这些系统提供的元素包括对拖放的内置支持。

为了获得更高的效率,请考虑支持多项目拖拽。在许多应用中,用户可以用一根手指拖动一项内容,在拖动的同时,用另一根手指轻击选择其他内容,选中的项一起移动并显示在拖动原始项的手指下方。然后,用户将这些项作为一个组拖放到所需的目的地。例如,主屏幕允许同时选择多个应用程序图标并拖放到一个文件夹中。有些应用,比如照片,提供了一种选择模式,允许在拖动之前选择多个项目。

确定在应用中拖放内容应该导致移动还是复制。一般来说,当源容器和目标容器相同(在文档中拖动文本)时,拖拽代表着移动;当源容器和目标容器不同(在文档之间或应用程序之间拖动)时,拖拽则代表复制。然而,情况并非总是如此。最重要的是,拖拽操作应该直观。在提醒应用中,在列表之间拖拽提醒只是移动,而不是复制,因为这是人们所期望的。在应用之间拖拽内容总是会产生一个副本。

只要可能,让人们可以撤销拖拽操作。通常,当用户无意中将内容放到错误的目的地时,他们应该能够使用撤销操作将应用返回到以前的状态。也就是说,拖进来的内容应该被删除,如果它是从应用的其他地方移动的,那么应该恢复到原来的位置。

考虑启用弹簧加载。通过弹簧加载,用户可以激活某些控件,比如按钮和分段控件,方法是将选定的内容拖放到这些控件上,并在不释放内容的情况下短暂暂停。例如,在邮件中,可以将选中的消息拖到导航栏的返回按钮上,以到达邮箱层次结构中的其他位置。永远不要让弹簧加载成为激活控件的唯一方法。把它当作一种可以发现的点睛之笔。在大多数情况下,加载了弹簧的控件还应该响应点击手势。

提供可拖拽的内容

如果需要,自定义拖动项预览。通常,用户手指下显示的预览应该是拖动内容的半透明表示。此外观提供一种情景,表示正在进行拖动,并允许用户查看拖动内容下的目标位置。

可能的情况下,提供从高质量到低质量的多个表示形式作为拖拽数据。例如,在提供线条艺术时,应用程序可以按此顺序提供PDF矢量图、具有透明度的无损PNG图像和没有透明度的有损JPEG图像。这样,目标就可以选择它可以导入的最高质量。

适当情况下,将自定义对象的原始版本作为最高数据形式呈现。例如,一个允许人们拖动图表的应用应该首先显示原生图表对象。其次,它应该为不支持图表对象的应用提供类似图表的图像版本。

当应用的内容传输耗时或资源密集型时,提供延期。文件传输延期管理传输过程并确保它完成,即使你的应用不再运行。注意,在用户置入内容之前,传输过程不会开始。

当应用的内容需要时间传输时,提供进度信息。如果必须下载内容或复制大型文件需要时间,则提供进度信息。至少,提供内容的总大小,以便目标位置可以计算剩余的时间,并显示适当的进度指示器。

接受拖进来的内容

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

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

提取并显示已置入内容的最高表示形式。例如,你的应用可能会提供一些图表的表示形式。如果你的应用支持图表,它可以提取并显示本机图表对象。如果你的应用不支持图表,它可以提取并显示图表的图像版本。

适当时,只提取置入内容的相关部分。例如,如果用户在邮件消息中将联系人从联系人拖到收件人字段,则只使用名称和电子邮件地址,而不使用联系人的地址信息。

置入内容后,在表格视图和集合视图中显示占位符。占位符临时指示内容在传输完成后将驻留在何处。

当置入的内容需要时间传输时显示进度。默认情况下,当应用之间发生耗时的传输时,系统会显示一个应用程序模式提醒。考虑自定义显示进度的方式——例如在表格视图或集合视图中的占位符上显示进度指示器——这样用户在使用应用时就不会受阻。

在置入的内容启动流程时提供反馈。如果用户将内容放置到启动任务的控件上(例如,将视频上传到共享站点),则显示任务已经开始,并将其进度告知用户。

当置入失败时通知用户。如果置入的内容无法插入,可能是因为文件传输中断,在置入失败时提醒用户。

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

考虑提供一种微妙、直观的方式,在用户无法立即撤消拖拽时选择退出。例如,一个共享的应用可能在发布置入的内容之前显示一个中间状态。这个中间状态可以提供一种方式来提供额外的内容,比如状态信息,同时还提供一个取消按钮。当将照片拖放到共享照片流中时,照片就会显示该行为。


相关文章

【iOS12人机交互指南】1.1-iOS设计主题

【iOS12人机交互指南】1.2-界面要点

【iOS12人机交互指南】2.1-无障碍设计

【iOS12人机交互指南】2.2-加载

【iOS12人机交互指南】2.3-模态

【iOS12人机交互指南】2.4-导航

【iOS12人机交互指南】2.5-新手引导

【iOS12人机交互指南】2.6-请求许可

【iOS12人机交互指南】2.7-设置

【iOS12人机交互指南】3.1-3D Touch

【iOS12人机交互指南】3.2-Apple Pencil

【iOS12人机交互指南】3.3-音频

【iOS12人机交互指南】3.4-身份验证

【iOS12人机交互指南】3.5-数据输入


·END·