
使用场景
用于展示可被忽略且不会打断用户当前操作的消息提示(不含操作)。
如回复成功提示,网络异常导致信息发送失败提示等。
注意事项
1.不要滥用,在操作有直观反馈的情况下不要使用Toast & HUD。
2.不要在Toast上添加图标或操作按钮,因为会很快消失。
3.不要在Toast上显示过长文案,因为会很快消失。
交互
一、样式类型
HUD加载样式:用于展示异步加载状态。

HUD状态样式:用于展示图文结合的反馈信息。

Toast样式:用于展示简短文本信息。

二、显示与消失
HUD通常展示于页面中间,用于加载样式时,在加载结束(成功或失败)时消失;用于状态样式时,持续至少4S后自动消失。
Toast通常展示于页面中间(仅iOS)或页面底部(仅Android),持续4S后自动消失。

范例
竞品:飞猪的加载中HUD提示
用于表示页面正在加载中的状态,加载成功后立即消失。

竞品:脉脉的分享成功提示
用于提示分享接口已调起。


网友评论