《iOS Human Interface Guidelines》——Popover

弹出框


弹出框是当人们点击一个控件或屏幕上一个区域时显示的一个临时的界面。




API NOTE

在iOS 8及以后的系统中,你可以使用UIPopoverPresentationController来显示一个弹出框。UIPopoverPresentationController定义了一个协议来让你调整你的弹出内容的显示风格去适应当前的显示环境。比如说,在水平常规环境下,你的内容可以在弹出框中显示;在水平紧凑环境下,你的内容可以在一个全屏的模态视图中显示。


一个弹出框:

  • 是一个自包含的模态视图
  • 在水平常规环境下,显示一个箭头指向它出现的点
  • 有半透明的背景显示背后的模糊内容
  • 可以包含大范围的对象和视图,比如:
列表、图片、地图、文本、网页或自定义的视图
导航栏、工具栏或标签栏
与当前app视图中的对象交互的控件或对象
(默认情况下,弹出框中的列表视图、导航栏和工具栏使用半透明的背景来让弹出框的模糊层显出。)

在水平常规环境下,操作表单总是在弹出框中显示的。

使用弹出框来显示额外的信息或者一系列与关注的或者选中的对象有关的元素。

NOTE
本指南包含显示在水平常规环境下的弹出框的UI和用户体验。如果你在全屏显示的水平紧凑环境下显示弹出框,查看 Modal View来获取其他全屏模态视图的指南。

不要提供“消除弹出框”的按钮。当弹出框的显示已经不必要的时候它应该自动关闭。考虑下面的情节来确定何时弹出框是不必要的:

如果弹出框这样做
提供影响主视图的选项,但不实现观察者当人们做出一个选择或当他们点击弹出框以外的任何地方时,包括显示弹出框的控件,尽快地关闭弹出框。
实现观察者当人们点击弹出框以外的任何地方时,包括显示弹出框的控件,就关闭弹出框。
在这种情况下,不要在人们做出选择时尽快地关闭弹出框,因为他们可能想要做出额外的选择或者改变当前选择的属性。
完成一个任务当人们通过点击弹出框中的按钮,比如完成或取消,来完成或取消一个任务时关闭弹出框。
在这种情况下,你可能不想在人们点击弹出框以外的地方的时候关闭弹出框,因为人们完成——或放弃——任务可能很重要。或者,当人们点击弹出框以外的地方的时候保存他们的输入,就像在点击完成时做的一样。

一般来说,当人们点击弹出框以外的区域时保存用户的工作。不是所有弹出框都要求明确的退出,所以人们可能错误地关闭了它。只在人们点击取消按钮时抛弃人们做的工作。


让弹出框的按钮尽可能直接指向显示它的元素。这样做有助于人们记住弹出框的来源以及有关的任务或对象。


确保人们可以在看不到其背后的app内容的情况下使用弹出框。弹出框会模糊其背后的内容,并且人们无法拖拽弹出框到别的位置。


确保同一时间只有一个弹出框在屏幕上。你不应该在同一时间显示超过一个弹出框(或者自定义的外观和行为类似弹出框的视图)。特别是,你不应该同时显示一个谈出啊匡从另一个中出现的串联或层级的弹出框。


不要在弹出框的顶部显示模态视图。除了警告框,都不应该显示在弹出框的顶部。


可能的话,允许人们通过一次点击关闭一个弹出框并打开一个新的弹出框。这个行为会在有多个不同的打开弹出框的栏按钮时很合适,因为这让人们避免了很多额外的点击。


不要使用太大的弹出框。弹出框不应该占据全部的屏幕。它应该刚好能显示它的内容并且能指向它出现的地方。弹出框的高度不是固定的,所以你可以使用它来显示一长列的清单。不过一般来说,你应该尝试避免在弹出框中滚动来完成任务。注意系统可能调整弹出框的高度和宽度来让它适应屏幕。


在弹出框内使用标准UI控件和视图。一般来说,弹出框使用标准控件和视图的时候会看起来更好、更易于用户理解。


确保自定义的弹出框看起来像一个弹出框。即使通过使用UIPopoverBackgroundView API可以很容易地自定义弹出框的很多视觉部分,不要创建一个用户认识不到是弹出框的设计。如果你改变太多弹出框的外观,用户就不能依赖他们以前的经验来帮助他们理解如何在你的app中使用它。


当弹出框依然可见时改变其尺寸要谨慎。你可能在使用它显示同样信息的最小视图和扩展视图时想要改变弹出框的尺寸。当你调整可见的弹出框的尺寸时,使用动画来表示改动通常是个好主意,因为这不会给人们一种新弹出框代替了旧弹出框的印象。



本文翻译自 苹果官方开发文档

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值