产品交互设计:iPhone和Android的控件对比

　　一、前言

　　开发者在产品上同时覆盖iOS平台和Android平台时，则会遇到同一个功能在不同平台中界面和交互如何展现的问题。

　　了解两个平台间的控件对应关系和异同点，对同时面向两个平台的产品和交互设计是有帮助的。

　　此部分就两个平台的控件进行对应，并辅以一定的描述，更详细的控件说明和适用的场合请直接参阅参考资料中的相关文档。

　　说明：Android中的系统控件会根据不同的ROM和操作系统版本有所变化，本文中Android控件以《Android Design》为主要参考。

　　二、目的

　　本文期望表达的含义，集中于如下三个方面：

　　√ iOS和Android的的控件在目标上是趋同的，但形式则有较大区别，因此Android产品符合Android本身的风格，不建议直接沿用iOS风格。

　　√ 了解iOS和Android控件的对应关系，有助于在产品设计时，既能利用现有的思路，又能符合相应平台的风格

　　√ Android因为各设备商自定义ROM、不同系统版本之间的不同、设备物理属性的多样化等原因，造成Android本身的风格有多种，设计优秀的Android应用，是一件不容易的事情。

　　三、功能栏

　　3.1 状态栏(Status Bar)

　　iPhone的状态栏系统提供了3种样式，分别为浅色、深色、深色半透，高度固定。

　　Android的状态栏根据各个手机厂商自定义的ROM不同，会有多种样式，在MIUI中还可以根据主题不同也会变化。

　　

 

　　3.2导航栏(Navigation Bar)

　　iPhone的导航栏高度固定，放置在界面顶部，导航栏中部一般放置标题，但也可以被用来放置其他内容，左侧一般放置导航或者其他按钮，右侧一般放置按钮。

　　Android的导航栏会根据情况不同而承担导航、操作栏(Acton Bar)、情景操作栏(Contextual Action Bars)的功能。

　　当承担导航功能时，出现的元素包含标题，左箭头(代表上一级)，这些元素联合界面、系统返回键(硬返回键或软返回键)一起构成了导航。

　　当其承担操作栏功能是，出现的元素有操作图标(有时候是平面的纯文字，包括更多图标)、Spinners下拉菜单、选项卡等，如果操作栏图标过多，会在界面最下方提供另外一条操作栏。

　　情景操作栏的出现场景包括文本选择、内容的选择等，一般是通过对当前内容长按出现。此控件是Android 4.0，用来一定程度上代替长按的弹出菜单。

　　

 

　　3.3工具栏(Tool Bar) vs 操作栏(Action Bar)

　　iPhone的工具栏高度固定，放置在界面底部，界面上一般放置图标或者按钮。

　　Android的当顶部操作栏空间不够无法放置更多按钮时，会出现在底部，但在有菜单键的手机上，会通过菜单弹出放不下的操作栏按钮。

　　另外，底部操作栏是在Android 4.0中引入的。

　　

 

　　3.4标签栏

　　iPhone的标签栏放置在底部，样式固定。

　　Android的标签栏包括位置可变和固定的两种，在Android 2.x的系统中，还有图文并排的标签，在Google自身的应用中，就有多种标签风格。

　　在Android 4.0中的标签，基本上都是可以左右拖动切换标签的，也可以直接点击切换。

　　

#p#

 

　　四、 列表

　　4.1列表

　　iOS的列表包括普通的表格、带索引的表格、分组的表格。

　　Android的列表则也普通的表格、带分组的表格，有横线占满和不占满的区别，不占满的和iOS的分组表格比较类似。

　　

 

　　

 

　　4.2 表格控件

　　在这些iOS的表格控件中:

　　ü Android的单选多选通过右侧的复选框和Radio Box来实现;

　　ü Android无展开指示符;

　　ü 其他的“详情指示按钮、添加、删除”等操作，可以以下方类似Spinners的标记点击后通弹出操作列表来完成。

　　Android因为本身没有提供这样的表格控件，但因为有类似有需要的场合，所以即使是google官方的应用，也扩展出不少非标准的控件，比如表格空间中Google Doc右侧的按钮、Google Music右侧的Spinners等等。

　　

 

　　4.1 开关

　　iPhone中的开关只有一种样式。

　　Android 则提供了类似iOS的开关、复选、单选 等开关。

　　

#p#

 

　　五、对话框、动作列表

　　5.1 对话框

　　这点主要是风格不同，作用比较类似。

　　另外Android 4.0之前，确定一般在左侧，Android 4.0中，确定变到了右侧。

　　

 

　　5.2 带文本输入框的对话框

　　

 

　　5.3 动作列表

　　iOS上的动作列表，Android中没有直接对应的元素，但有类似的元素

　　

 

　　六、其他系统控件

　　6.1 选择器

　　iPhone和Android分别提供了不同样式的选择器。

　　Android中的选择器不同ROM和不同系统版本风格不同。

　　

 

　　6.2页面指示器

　　iPhone页面指示器在应用和主界面一致。

　　Android的页面指示器主要用于桌面页面的切换， 不同ROM和不同系统版本风格不同。

　　

 

　　6.3滑块

　　iOS滑块一种风格，Android不同ROM和不同系统版本风格不同。

　　

 

　　6.4进度条

　　Android的进度条依然因为不同ROM和不同系统版本风格不同

　　

 

　　6.5单选和复选

　　iOS的单选和复选都可以通过列表中的“对号”来处理，也有类似右图的样式。

　　Android的基本上是Radio Box和Checkbox的风格，当然，风格一如既往的和ROM以及系统版本号有关系。

　　

#p#

 

　　七、特有控件

　　7.1 Android特有的控件

　　此处只列出了部分Android特有的控件。

　　左侧是Spinners，在iOS中没有直接原生对应的，但会有应用会尝试使用类似的，比如新浪微博的客户端有类似用法。

　　右侧是toast，会显示几秒钟消失，常用来做某些没有重要到直接通过对话框来程度的提示，此控件在iOS中也没有原生对应的，但一样会有应用尝试使用，比如不少应用的网络错误提示。

　　

 

　　7.2 iOS特有的控件

　　分段控制器，是在Android中缺失的控件。

　　分段控制器在Android中没有太好的替代选择，google原生应用中会用标签栏或九宫格来一定程度上达到分段控制的作用。

　　

 

　　(完)

　　版权声明：转载时请以超链接形式标明文章原始出处和作者信息

　　本文链接：http://www.penddy.com/%e6%b5%85%e8%b0%88ios%e5%92%8candroid%e7%9