发布时间：2021-11-14 分类： 电商动态
对话框是弹出视图，叠加在应用程序的主视图上，通常需要用户做出反应。对话框可分为模态对话框和无模式对话框。
模态防止用户在当前视图上完成任务，允许用户专注于模态视图中的新任务;只有在模态视图终止后，用户才能继续完成上一个任务。
在下面的示例中，提示框阻止用户继续查看地图，允许用户专注于提示;只有在用户点击确定后，用户才能继续查看地图。提示框是iOS中常见的模式视图之一。
什么是常规对话框？
大多数对话框由标题，按钮和描述文本组成。如果对话框允许用户键入或选择，则还需要相关控件。
标题：对话框的标题应该简单易懂，一目了然。
按钮：模态对话框中通常有两个按钮。一个是默认按钮（例如，“确认”，“打印”，“清空回收箱”），另一个是“取消”按钮。他们应该给用户明确的选择。当用户单击任何按钮时，模式对话框将关闭。为了提高熟练用户的效率，我们应该允许用户按下Esc键来终止对话框（与“取消”按钮的效果相同）。
解释性文本：解释性文本可以向用户解释对话框中的任务，这些任务应该清晰并避免重复信息。
什么是模态对话框？
打开模态对话框时，除非模态对话框终止，否则用户无法继续执行上一个任务。
在设计交互式界面时，我们应该注意模态对话框的设计。精心设计的模态对话框可以帮助用户更好地完成工作，而糟糕的模态对话框可能会让用户感到沮丧。 Alan Cooper将模态对话框与“支持角色”进行比较。在界面设计中。由于模态对话框会中断用户的流程，因此主要内容和相关控件应放在主视图中，而不是分布在不同的模式对话框中。此外，当对话框分层放在另一个对话框之上时，它们通常会令人困惑。
△级联对话通常令人困惑
为什么要使用模态对话框？
如果使用得当，模态对话框可以帮助用户完成任务并创建良好的用户体验。当您有以下要求时，请考虑使用模态对话框：
1.引起用户的注意
当您希望用户专注于重要任务时，您可能需要使用模态对话框。虽然用户将被中断，但很少有其他组件像模式对话框一样得到用户的全部注意。模态对话框通常位于界面最顶层的中间。用户必须先处理模态对话框中的任务，然后才能处理其他任务。因此，用户不太可能错过它们。
在下面的示例中，当用户删除项目时，应用程序启动模式对话框以确认删除给用户。
2.显示辅助内容
从本质上讲，应用程序旨在帮助用户访问特定内容。例如，Evernote的内容是一个注释，Spotify的内容是音乐。尽管有时难以清楚地区分主要内容和次要内容，但我们可以假设用户最感兴趣，最关注，并且最常访问的是主要内容，而其他内容是次要内容。
用户来找内容。因此，主要内容和相关控件不应出现在模态对话框中。对于桌面应用程序，它们属于应用程序的主窗口（主窗口）;对于移动应用程序，它们属于应用程序的屏幕;对于Web应用程序，它们属于应用程序的页面。在精心设计的信息架构中，用户可以轻松找到他们关心的内容。
在屏幕尺寸有限的情况下，辅助内容可以出现在模态对话框中。在特定上下文中，用户将有机会打开这些对话框。例如，如果用户选择AWS EC2实例列表中的实例并从上下文菜单中单击“添加/编辑标签”，则会打开一个模态对话框。用户可以在此对话框中查看和编辑实例的标记。如果用户不想继续查看和编辑标签，他可以关闭对话框并返回上一界面。
有时用户需要在多个上下文中打开相同的模式对话框。例如，除了上面提到的右键单击菜单，用户还可以单击底部选项卡面板上的“添加/编辑标签”按钮以打开相同的模式对话框。无论哪种方式，用户都可以快速回到他们关心的主要内容—— AWS EC2的实例列表。
3.隐藏复杂性
我们希望为用户创建简单，功能强大的应用程序。在设计应用程序时，我们需要仔细平衡这两个目标。与移动用户相比，桌面用户更习惯于使用各种专业应用程序，如PowerPoint，Photoshop，SourceTree。但除非他们已经有经验的老用户;否则，充满按钮和专业词汇的应用界面就像一个充满地雷的战场，这将使新手气馁。如果我们希望新用户入门并更快地掌握基本功能，我们必须找到隐藏不常用的高级功能的方法，并帮助新用户专注于主要内容。
我们可以在模态对话框中隐藏这些高级功能。对于新用户，模态对话框的好处主要体现在：
容易明白。模态对话框通常简短易懂，新用户可以快速完成对话框中的任务。
容易撤销。如果新用户通过按钮或菜单意外打开模式对话框，他们可以随时单击“取消”。
易于导航。由于用户仍然可以在模态对话框下方看到主视图的一部分，因此他不知道他在哪里。如果他不想继续，他可以随时关闭对话框并返回上一个视图。
什么是非模态对话框？
打开无模式对话框时，用户可以关注对话框中的辅助任务，也可以继续主视图中的主要任务。
如果用户需要频繁地在主视图和对话框，主要任务和辅助任务之间切换，则无模式对话框比模态对话框更合适。但是，非模态对话框可能会让用户感到困惑。这是因为，尽管它们看起来非常相似，但它们的行为却不同，难以预测。
例如，在模式对话框中，当用户单击下面的按钮时，对话框将关闭。但是，在无模式对话框中，当用户单击该按钮时，该对话框不会立即关闭。 （除非用户主动点击无模式对话框上的关闭控件。）
此外，由于无模式对话框不会随着辅助任务的结束而自动关闭，因此未及时关闭的无模式对话框可能会浪费屏幕空间。在Page中，用户可以使用无模式对话框查找当前打开的文档中的内容。如果用户没有主动关闭它，即使他不想继续搜索，该对话框仍将出现在屏幕上。 （当用户打开第二个文档时，Page关闭无模式对话框。用户可以再次打开它。此时，此无模式对话框的搜索范围是当前活动窗口的内容。）
为了避免这些问题，我们可以考虑使用其他非模态组件而不是非模态对话框，例如面板，侧边栏和工具栏。例如，Ulysses用面板替换非模态对话框。
