四种App弹窗设计：Toast、Dialog、Actionbar 和 Snackbar.pdf

四种App弹窗设计 ：Toast 、Dialog、Act ionbar 和 Snackbar 弹窗又称为对话框 ，是A pp与用户进行交互的常见方式之一 弹窗分为模态弹窗和非模态弹窗两种 ，两者的区别在于需不需要用户对其进行回应。 模态弹窗会打断用户的正常操作 ，要求用户必须对其进行回应 ，否则不能继续其它操作 ；非模态弹 窗则不会影响用户的操作 ，用户可以不对其进行回应 ，非模态弹窗通常都有时间限制 ，出现一段时 间后就会自动消失 非模态弹窗一般 设计成用来告诉用户信息内容 ，而模态弹窗除了告诉用户信息内容外还需要用户 进行功能操作。 无论是模态还是非模态 ，弹窗都是位于当前页面的最顶层 模态弹窗常常都还会伴随半透明的遮罩 来吸引用户的视觉焦点 ，以突出弹窗的信息内容 随着开发技术的发展 ，弹窗的方式和样式多种多样 ，弹窗也被定制化设计成很多种风格和版本 最 常见的基本弹窗有以下四种 ： Toast 、Dialog、A ct io nbar 和 Snackbar Toast 提示框 Toast 提示框是一种非模态弹窗 ，它弹出一个小信息 ，作为提醒或消息反馈来用 ，一般用来显示操 作结果 ，或者应用状态的改变 例如你发出了一条短信 ，A pp弹出一个Toast 提示你消息已发出 最常见的Toast 提示框为一句简短的描述性文字 这种样式的弹窗可以出现在页面的任何位置 ，可 设置成在页面顶部、中部或者在底部出现 （但一般都是出现在页面的中轴线上 ），具体的显示位置 根据页面的整体设计进行设置 该种Toast 在安卓A pp上十分常见 还有一种Toast 弹窗由简单的图形和简短的文字组成 ，显示位置一般位于页面正中央 这种Toast 在iO S和安卓上都可以经常见到 iO S中建议 ，设计一种引人注目但又和A pp 的界面协调融合的方式去展示信息 这种展示信息的方 式和安卓纯文本的Toast 相似 ，只是界面交互有所不同 ，它一般在内容页顶部向下推动出现 ，然后 向上推动消失 这种展示信息的方式现在也在安卓平台上使用 例如腾讯新闻A pp的iO S版和安卓 版均采用了这种形式的Toast 弹窗进行刷新功能的操作提醒 考虑到Toast 提示框显示的时间较短 （几秒种 ）、占用区域不大 ，它容易被用户忽略 ，所以Toast不 适合承载过多的文字和重要信息 Dialog 对话框 Dialog对话框是一种模态弹窗 当用户进行了敏感操作 ，或者当A pp内部发生了较为严重性的状态 改变 ，这种操作和改变会带来影响性比较大的行为结果 ，在该结果发生前以Dialog对话框的弹窗形 式告知用户且让用户进行功能选择 比如退出A pp、进行付费下载等功能操作 一般情况下Dialog由标题、信息内容和功能按钮组成 ，只有当用户点击了某个功能按钮后弹窗才会 消失 ，A pp随即执行该功能操作 ，进入相应的功能流程 Dialog的标题和信息内容的文字描述都要设计成尽可能的简洁和无异义 ，也可以选择省略标题只保 留内容描述和功能按钮 （实际上大多数Dialog都被设计成没有标题的样式 ） 使用Dialog ，功能按钮最好只有两个 ，让用户选择“是”或“非”的功能操作 （“是”指对内容描述的确认 操作 ，比如确认删除、确认付费 ；“非”一般指取消操作 ，然后关闭弹窗 ）；也常被设计成只有一个“ 确认”按钮 ，目的是让用户阅读内容后点击关闭弹窗 （这种样式的Dialog ，信息内容必须非常有必要 性以至于需要打断用户的操作进行信息内容阅读确认 ，否则请用Toast 进行非模态弹窗提示 ） 若Dialog对话框出现三个或以上的功能按钮 ，将会增加用户的功能选择负担 ，所以需要使用多个功 能按钮选择的时候请考虑使用A ct io nbar Act io nbar 功能框 A ct io nbar功能框可以看成是Dialog的一种延伸设计 ，两者都是模态弹窗 ，用户必须进行回应 ，否则 弹窗不会消失 ，用户无法继续其它操作 A ct o inbar比Dialog拥有更多的功能按钮 ，提供给用户更多 的功能选择 ，A cio nbar一般都设计有一个默认的“取消”功能按钮 ，点击该按钮后关闭弹窗 ，用户点 击弹窗以外的区域时相当于进行了点击“取消”功能按钮的默认回应 A ct io nbar一般 设计用来向用户展示多个功能按钮选择。 在iO S中 ，A ct io nbar的样式比较常见的是文字列表框 ，它出现在页面底部 ，以简洁的功能描述性文 字展示功能按钮 ，敏感的功能操作一般用红色字体标出 （也可以设计其它颜色以突出某个功能 按钮 ） 当功能按钮数