Human Interface Guidelines — Wid

自上次参加完回音分享会后，我下定决心要洗心革面乖乖打基础，于是开启了这个part，争取两个月不间断更新，写完Material Design与iOS中的组件（顺便学学英语），以便今后在使用的时候完全不虚

Widgets

Human Interface Guidelines链接：Widgets

Widget 是一种扩展，可及时显示少量并且有用的信息或app的特定功能。

 例如，“新闻” widget 显示最重要的标题。 “日历”提供了两个 widget ，一个显示当前的事件，另一个显示下一个事件。 “Notes”可让您预览最近的笔记并快速创建新的笔记、提醒、照片和绘图。 Widget 的高度是可定制的，并且可以包含按钮、文本、定制布局、图像等。

使用3D Touch将压力施加到主屏幕上的 app 图标时，widget 会出现在快速操作列表的上方。 人们还将他们关心的窗口 widget 添加到搜索屏幕，通过在主屏幕和锁定屏幕上向右滑动来访问搜索屏幕。 你的目标应该是设计一个人们想要添加到搜索屏幕的 widget。

左：搜索屏幕上的widgets    右：主屏幕上的快速操作widget

·设计一个可快速浏览的体验

人们使用 widget 来获得快速的更新并执行非常简单的任务，因此提供适量的信息和交互非常重要。可能的话，提供可以一次点击就能完成的任务。在 widget 中不支持平移和滚动。

·快速显示内容

人们花很少的时间来查看 widget，并且不需要等待内容加载。本地缓存信息，以便在更新时始终显示最新信息。

·提供充足的 margins 和 padding

避免将内容扩展到 widget 的边缘。通常，在每个边缘与内容之间提供至少几个像素的 margin。使用 widget 顶部的 app 图标进行对齐指导。当与这个图标的中心对齐时，内容往往能展示良好。如果 app 提供了网格式布局，请确保在网格项之间提供了足够和相等的 padding 。如果可能，将图标和按钮的网格限制为每行四个。

·有适应能力

Widget 的宽度被设备与其方向影响而有所不同。 Widget 显示的高度和信息取决于窗口是否折叠或展开（并非所有 widget 都支持展开）。折叠的 widget 是大约两个半 table rows 的高度。理想情况下，扩展的 widget 不会高于屏幕的高度。快速操作列表仅显示处于折叠状态的 widget 。当展开时，一个 widget 显示可以独立存在的重要信息。展开后， widget 会显示增强主要信息的其他信息。例如，“天气” widget 折叠时会显示的当前天气状况，但会在展开时添加小时预测。

·避免自定义 widget 的背景

系统提供的浅色，模糊的 widget 背景旨在保持一致性和清晰度。请使用系统背景，不要使用照片作为背景，因为它可能与锁定和主屏幕壁纸发生冲突。

·通常，使用黑色或深灰色的系统字体作为文本

系统字体的设计更加清晰，且深色字体与标准 widget 背景配合良好。

·适当时，让用户跳转到app进行更多操作

您的 widget 应该独立于您的 app 运行。但是，如果人们需要的比 widget 提供的操作更多，让人们可以很轻易的做到。不要包含一个占空间的“打开app”按钮，而是让用户自己点击内容后即可在 app 中查看或修改内容。例如，在日历 widget 中，您可以点击事件以在日历 app 中打开它。切勿使用 widget 打开其他 app。

 ·为 widget 起一个好名字

每个 widget 的内容上方都会显示 app 图标和标题。一般来说，widget 的名称应该与 app 的名称相匹配。如果您的 app 提供多个 widget ，请考虑使用您 app 名称作为最重要的一个 widget 的名称，并为其他 widget 提供简洁明了的名称。如果您使用自定义标题，请考虑在 app 名称前加上前缀。例如，用于显示附近位置的Map 的 widget 标题为“Maps Nearby”。包含 app 名称会让用户确信该 widget 实际上是由对应 app 提供的。

·让用户知道认证何时增加价值

如果您的 widget 在某人登录您的 app 时提供了其他功能，请确保人们知道这一点。例如，显示即将到来的预订的 app 可能会包含一条消息，说明未登录时“登录 app 以查看您的预订”。

·为快速操作列表选择一个 widget 

如果 app 有多个 widget ，请选择一个出现在使用3D Touch在主屏幕上向 app 图标施加压力时显示的快速操作菜单中。