原则

适应网络连接状态
考虑当用户网络缓慢、间歇性中断或完全无法连接时,你的功能或应用应如何表现。

说明功能
使用元素的设计来说明离线功能的工作原理。

显示可用内容
加载一些内容总比什么都不加载要好,同时可以说明互联网连接受限的情况。

考虑当用户网络缓慢、间歇性中断或完全无法连接时,你的功能或应用应如何表现。

使用元素的设计来说明离线功能的工作原理。

加载一些内容总比什么都不加载要好,同时可以说明互联网连接受限的情况。
你的应用应指明当前是在线还是离线状态,特别是当部分功能可离线使用而部分功能必须联网时。
如果适用,还应提供管理离线文件的位置。
要表明某项操作可在离线状态下工作,请显示离线图钉图标和文本标签“离线”。

用户执行离线操作时会显示离线图标。

离线访问网站时,网址旁边会显示离线图标。
离线时,不可用的功能应使用“云关闭”图标表示。仅在产品离线时显示此图标。尽可能将文本标签“无网络”与此图标配合使用。

离线状态指示以及用户在离线时可执行操作的有用提示。

连接到互联网时,提供下载操作以供将来离线使用。
为用户提供一个管理离线设置的位置。如果适用,用离线图钉图标标记此位置。

此导航菜单中提供了离线区域。
离线功能让用户能够访问之前下载的文件,例如视频和网站。要离线访问这些文件,用户必须在有互联网连接时将它们下载到设备上。
要表明文件可以下载,需要同时显示下载图标和“下载”字样。包括文件大小以帮助用户判断文件是否过大。
离线时,允许用户选择在连接到互联网后需要下载的文件。

推荐做法
将下载图标与“下载”字样配合使用。

不推荐做法
不要使用切换控件来下载单个文件。切换控件表示状态为“开”或“关”,而不是一次性下载。
文件下载完毕后,显示离线图钉图标以表示可离线使用。

下载和离线图钉图标可在Material 图标库中找到。
要表明已下载的项目可离线访问,可以显示下载图标转换为离线图钉图标的动画。详见进度与活动状态。
进度指示器在两个图标之间切换。
为了腾出空间,用户可能会删除设备上的文件。你的应用应允许用户删除任何已下载的文件。

为已下载的文件显示带有删除图标的移除操作。

显示删除文件可节省多少空间。