iOS-HIG 用户交互-模态

Modality

Modality creates focus by preventing people from doing other things until they complete a task or dismiss a message or view. Action sheets, alerts, and activity views provide modal experiences. When a modal view appears onscreen, the user must make a choice by tapping a button or otherwise exiting the modal experience. Some apps implement modal views, such as while editing an event in Calendar or choosing a bookmark in Safari. A modal view can occupy the entire screen, an entire parent view, such as a popover, or a portion of the screen. A modal view typically includes completion and cancel buttons that exit the view.

模态通过阻止用户去做其他事直到他们完成一个任务或解散一条信息或视图来创建一个关注。操作面板、提醒和活动视图提供模态体验。当一个模态视图在屏幕上出现,用户必须通过敲击一个按钮或者其他令人兴奋的模态体验来做出一个选择。一个app实现模态视图,例如在日历上编辑一个事件或者在Safari选择一个书签。一个模态视图可以占据整个屏幕,整个父窗口,例如一个popover,或者屏幕的一部分。一个模态视图一般包括完成和取消按钮来离开视图。

Minimize the use of modality.

减少使用模态

Generally, people prefer to interact with apps in nonlinear ways. Consider creating a modal context only when it’s critical to get someone’s attention, when a task must be completed or abandoned to continue using the app, or to save important data.

一般,用户期望用非线性的方式来与app交互。考虑只有当一定要取得用户注意时才考虑创建一个模态环境,当一个任务必须完成或者放弃,然后才能继续使用app,或者来保存重要数据。

Provide an obvious and safe way to exit a modal task.Make sure people always know the outcome of their action when they dismiss a modal view.

同一个明显的和安全的方式来离开模态任务。确保当用户解除一个模态视图时清楚他们操作的结果。

Keep modal tasks simple, short, and narrowly focused.Don’t create an app within your app. If a modal task is too complex, people can lose sight of the task they suspended when they entered the modal context. Be especially wary of creating modal tasks that involve a hierarchy of views because users can get lost and forget how to retrace their steps. If a modal task must contain subviews, provide a single path through the hierarchy and a clear path to completion. Avoid using Done buttons for things other than completing the task.

保持模态任务简单,短小,高度聚焦。不要在你的app里再创建一个app。如果一个模态任务太复杂了,当用户进入模态环境时,可能无法聚焦悬浮在他们前面的任务。特别关注包含层级视图的创建模态任务因为用户可能丢失和忘记怎么重复他们的步骤。如果一个模态任务必须包含子视图,提供一个单一和清晰的途径去完成它。除了完成任务的地方,避免使用完成按钮。

Display a title that identifies a task, if appropriate.You might also provide text in other portions of the view that more fully describes the task or provides guidance.

如果合适,显示一个标题来标示一个任务。你也许在这个视图的其他部分提供文本来更全面的描述这个任务和提供指导。

Reserve alerts for delivering essential—and ideally actionable—information.An alert interrupts the experience and requires a tap to dismiss, so it’s important for people to feel that the intrusion is warranted. To learn more, seeAlerts.

用提醒来传递关键信息-最好是可操作的-信息。一个提醒打断体验和需要一个敲击来解散,所以感觉侵入是被批准的对用户来说很重要。

Respect notification preferences.In Settings, people specify how they want to receive notifications from your app. Abide by these preferences so they aren’t tempted to turn off your app’s notifications entirely.

遵守通知偏好。在设置中,用户设定从你的app怎么接收通知。遵守这些偏好,这样他们就不会想整个关掉你的通知。

Don’t display a modal view above a popover.With the possible exception of an alert, nothing should appear over a popover. In rare cases when you need to present a modal view after action is taken in a popover, close the popover before displaying the modal view.

不要在一个弹出框上显示模态视图。除了异常提醒,不要在弹出框上显示任何东西。在你在弹出框执行一个操作,很少情况你需要显示一个模态 视图,在显示模态视图前关掉弹出框。

Coordinate modal view appearance with your app.A modal view may include a navigation bar, for example. When this is the case, use the same appearance as the navigation bar in your app.

你的app与模态视图外观风格一致。一个模态视图也许包括一个导航条,例如。当发生这种情况时,使用你的app导航栏相同的外观。

Choose an appropriate modal view style.You can use any of these styles:

选择一种合适的模态视图样式。你可以选择使用以下样式:

全屏。覆盖整个屏幕。用于展示一个可能复杂的任务,可以在模态视图环境完成的。

页面sheet。在大设备上覆盖部分内容当设备是横放方向时。那些没覆盖的区域是无效来防止与它们交互。在小设备覆盖全部屏幕或者处于直立方向。用于展示一个可能复杂的任务,可以在模态视图环境完成的。

表单sheet。在屏幕正中间出现,如果一个键盘出现可能重定位。那些没覆盖的区域是无效来防止与它们交互。在小设备覆盖全部屏幕。用于收集信息。

当前环境。出现时和它的父视图一样大。用于显示在一个分隔视图窗格里、弹出框,或者其他不是全屏的视图的模态内容

Choose an appropriate transition style for revealing a modal view.Use a transition style that coordinates with your app and enhances the awareness of the temporary context shift. The default transition vertically slides the modal view up from the bottom of the screen and back down once dismissed. The flip-style transition appears to flip a view horizontally to reveal the modal view. Visually, the modal view looks like the back of the current view. It flips back once dismissed. Use consistent modal transition styles throughout your app.

为展示一个模态视图选择一个合适的转场。用一个与你的app风格相符的转场样式,增强临时环境变换的意识。初始转场从下到上垂直滑动模态视图,一旦解散从上到下出现。水平轻弹一个视图显示轻弹样式转场来显示模态视图。可见的,模态视图看起来像当前视图的背面。It flips back once dismissed. Use consistent modal transition styles throughout your app.

For modal view developer guidance, seeUIViewControllerandUIPresentationController.

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 212,080评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,422评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 157,630评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,554评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,662评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,856评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,014评论 3 408
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,752评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,212评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,541评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,687评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,347评论 4 331
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,973评论 3 315
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,777评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,006评论 1 266
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,406评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,576评论 2 349

推荐阅读更多精彩内容