「这个控件叫什么」系列之Notice Bar/通告栏

@龙爪槐守望者 ：经常能看到在很多 App  Navigation Bar（iOS 叫导航栏，安卓叫 App Bar /应用栏）下、列表上或者页底部悬浮着个幅。这些幅过某个事件触发而出现，能常驻显示到事件结束，并常可以操作。翻遍 iOS Human Interface Guidelines 和 Material Design 都找不到这个控件，这个控件可能叫 Notice Bar（告栏）。

△ 这个控件可能叫 Notice Bar（告栏）

往期顾：

1. 《「这个控件叫什么」系列小红+索引导航+分段控件》
2. 《「这个控件叫么」系列之载占位图+页面指示器》
3. 《「这个控件叫什」系列之步进器+SWITCH》
4. 《「这控件叫什么」系列之TOAST》
5. 《「个控件叫什么」系列之虚拟键盘/软键盘/SOFT KEYBOARD》
6. 《「这个控件叫什么」系列动作菜单/动作板》
7. 《「这个控件叫么」系列之Popover/气泡弹框/弹式气泡》
8. 《「这个控件叫什」系列之输入框/文本框/Text fields》

一、名称来源

Notice Bar 出现有其必然性，我们知交互设计予用户合适反馈是非常重要的。比通常用轻量反馈的 Toast，出现时间短，不打断用户当前操；或者强用户做出选择，才关闭的模态对框（Modal dialog）；还有进度条，必须等到100%才能继续下一步；以及系统推送通，虽通推送的瞬间很醒目，但果用户不马上处理，收纳到消息中心被点击的能就降低很。显，我们还缺少一种控件，即不打断用户当前的任务，又够明显能一直引用户的关注。

△ 反馈矩阵

其实早在 Web 时代，有这控件了，常叫做 Notification Bar 或者 Information Bar。

△ Slack 用 Notification Bar 提醒用户打开桌知

△ 上时代 IE  Information Bar

但因为早年间 Android 把通知抽屉（Notification drawer）就叫 Notification Bar（通知栏），如果再此概念称呼，极易成混淆。

△ 搜索 Notification Bar（通知栏）来的都是 Android 的通知抽屉

发现蚂蚁金服的 Ant design 将其称呼为 Notice Bar（通告栏），之后有赞的 ZanUI 也使用了这个名称，随着越来越多的开发者认可，也许最后这个控件就真的叫 Notice Bar（通告栏）了。

二、如何使用

Notice Bar 一用于活动提醒或者系统权限申请等吸引用户关注但不制用户去理的景。

1. 醒目的不同类型

如果你的 App 中有用于警告、温馨提示、活动促销等不同的 Notice Bar，可用颜色和图标进行，便于用户形成视觉记忆，快速辨识通告类型。

△ 用颜色和图标进行

2. 不要附加多操作

一条 Notice Bar 只描述一个事件，通常点击后提供理这个事件的页面，最多再提供一个关闭 Notice Bar 的按钮。不要在 Notice Bar上附加多操作，增加用户选择负担。

△ 要开启提醒、要关闭通告栏

3. 多横幅的优先

如果多个事件触发了不同的 Notice Bar，应当为其定制优先，防止排序跳动对用户阅读产生干扰。

△ 多个 Notice Bar

4. 文字超长理策略

如果文字超长，除了末尾略和折行外，还可以使用滚动轮播的方式显示。

△ 滚动轮播的 Notice Bar

三、相关资料

1. 把 Notice Bar 和进条整合

对大件或多个小件进行操作非耗时，而且很有可中途失败。百 iOS 版把复制进条做成 Notice Bar，微软 OneDrive  Notice Bar 做上传进，这样件操作状况随时了解，问题马上解决，而且影响同时进行的他任务。

△ 百盘、OneDrive

欢迎关注作者的公众号：「爪槐守望者」