从设计指南说起,详解iOS系统组件分类体系(下)

相关阅读:从设计指南说起,详解iOS系统组件分类体系(上)

滚动视图(scroll view)

滚动视图方便用户浏览尺寸超越滚动视图边界的图片(下图中知乎的一个放大的界面图片无论是长度还是宽度都超过了)。

从设计指南说起,详解iOS系统组件分类体系(下)

滚动视图可以包含以下特征

没有预定义的外观

在刚出现或者当用户对它进行操作的时候会出现滑条

当用户在视图中拖拽内容,内容随之滚动;当用户轻扫屏幕时,内容将快速滚动——直到用户再次触摸屏幕或内容已经到达底部时停止。

使用滚动视图来允许用户在固定的空间内浏览大尺寸或大量的视图。

适当地支持缩放操作。如果放大和缩小对于当前内容是有用的话,可以支持用户通过捏或者双击来对当前视图进行缩放。而若是支持了缩放操作的话,你还应当根据用户当前的任务来设定在当前情景下允许缩放的最大值和最小值。

在页模式滚动视图中,可以考虑使用页面控件(page control)。当你想要展示分页、分屏或者分块的内容,可以使用页面控件来让用户知道当前内容一共有多少块,以及他们当前浏览的是第几个。

分栏视图控制器(split view controller)

分栏视图控制器是一个用于管理两个相邻视图控制器显示的全屏视图控制器。

从设计指南说起,详解iOS系统组件分类体系(下)

在iOS 7及之前的版本里,对分视图控制器仅适用于iPad.

分栏视图控制器含有以下特性:

  • 可以在横屏环境中展示并排展示两个窗格

  • 可以让主窗格在详情窗格上方显示,也可以在不需要的时候(尤其是竖屏情况下)隐藏主窗格。

表格视图(table view)

表格视图以一个可滚动的单列多行的形式来展示数据。

表格视图可以包含以下特性:

  • 以容易进行分段或分组的单列形式展示数据

  • 用户可以通过点击来选中某行,或通过控件来添加、移除、多选、查看详情或者展开另一个表格视图

iOS定义了两种表格样式:

平铺型(Plain)。平铺型表格可被分为若干带标签的段落,表格右侧可能会出现垂直的表格索引。每行开头可以有页眉,尾部可以有页脚(也可以没有)。

从设计指南说起,详解iOS系统组件分类体系(下)

分组型(Grouped)。表格行以分组形式展示,可以有页眉和页脚。分组表格视图中至少含有一组列表,而每一组中至少包含一项内容。与平铺型不同,分组型表格没有索引。

从设计指南说起,详解iOS系统组件分类体系(下)

文本视图(text view)

文本视图可以接收和展示多行文本

从设计指南说起,详解iOS系统组件分类体系(下)

文本视图可以包含以下特性:

  • 是一个可定义为任何高度的矩形

  • 当内容太多超出视图的边框时,文本视图支持滚动

  • 支持自定义字体、颜色和对齐方式(默认情况下,文本视图会以左对齐的黑色系统字体显示)

  • 可以支持用户编辑,当用户轻击文本视图内部时,将唤起键盘(键盘的布局和类型取决于用户的系统语言设置)

页面视图控制器(page view controller)

页面视图控制器通过滚动(Scrolling)或翻页 (Page-curl transition style)两种方式来处理长度超过一页的内容。下图是iOS模拟器中的翻页样式

从设计指南说起,详解iOS系统组件分类体系(下)

页面视图控制器包含以下特性:

  • 带滚动条的页面视图控制器没有默认的外观。

  • 带翻页效果的控制器可以在两页中间增加书脊(book spine)的效果

  • 可以根据指定的转场来模拟出页面切换时的动画。

使用滚动条效果的时候,当前页面将滚动到下一页;而使用翻页效果时,页面上会出现一个模拟实体书或笔记本翻页效果的翻页动画

地图视图(map view)

地图视图呈现地理数据,同时支持系统内置地图应用的大部分功能(如下图所示)

从设计指南说起,详解iOS系统组件分类体系(下)

地图视图包含以下特性:

  • 通常以标准地图、卫星图像、或两者结合的形式来展示地理区域

  • 可以展示以单点标注的备注,以及叠加图层(绘制路径或二维区域绘制轮廓的)

  • 支持编程时定义的,或用户所控制的缩放和移动

利用地图视图可以给用户提供一个可交互的地理区域视图。一般来说,允许用户在视图中进行交互行为。

图片视图(image view)

图片视图用以展示一张单独的图片,或者一系列静动态图片。

从设计指南说起,详解iOS系统组件分类体系(下)

图片视图可以包含以下特性:

  • 不存在任何预先定义好的外观,同时在默认状态下它不支持用户的交互行为。

  • 可以检测图片本身及其父视图(parent view)的属性,并决定这个图片是否应该被拉伸、缩放、调整到适合屏幕的大小,或者固定在一个特定的位置。

容器视图控制器(container view controller)

容器视图控制器采用自定义的方式来管理和呈现它的视图控制器或一系列子视图。系统定义的容器视图控制器典型例子包括标签栏视图控制器(Tab bar view controller)、导航视图控制器(navigation view controller)和对分视图控制器(split view controller)。

用容器视图控制器来呈现内容,使用户可以通过控制器来以自定义的方式进行导航。

确保容器内容控制器在横屏与竖屏模式都可用。很重要的一点是,容器视图控制器无论在横屏还是竖屏中,体验都是一致的。

集合视图(collection view)

集合视图用于管理一系列有序的项,并以一种自定义的布局来呈现它们。

从设计指南说起,详解iOS系统组件分类体系(下)

集合视图:

  • 以从视觉上区分项的子集或者提供装饰性项目,例如自定义背景。

  • 布局切换时支持自定义转场动画。(默认情况下,当用户导入、移动或者删除项的时候,会出现系统默认的动画效果。)

  • 支持开发者额外定义手势识别来执行自定义操作。默认情况下,集合视图可以识别轻击(tap)某项以选中,和长按(touch-and-hold)某项进行编辑。

活动视图控制器(activity view controller)

活动视图控制器是一个临时视图,当中罗列了一系列可以针对页面特定内容的系统服务和定制服务。

活动视图控制器:

  • 显示了让用户可以针对当前内容执行操作的一系列的可配置服务

  • 根据所处的场景不同,可能出现在操作列表或浮出层中

原文始发于微信公众号(吴轶):从设计指南说起,详解iOS系统组件分类体系(下)

0

评论0

站点公告

 

AI创作与绘画大师,国内版chatGPT在线版本免费使用哦

点击打开: https://ai.uiya.cn

   
显示验证码
没有账号?注册  忘记密码?

社交账号快速登录

微信扫一扫关注
如已关注,请回复“登录”二字获取验证码