一、前言

開發(fā)者在產(chǎn)品上同時覆蓋iOS平臺和Android平臺時，則會遇到同一個功能在不同平臺中界面和交互如何展現(xiàn)的問題。

了解兩個平臺間的控件對應(yīng)關(guān)系和異同點，對同時面向兩個平臺的產(chǎn)品和交互設(shè)計是有幫助的。

此部分就兩個平臺的控件進行對應(yīng)，并輔以一定的描述，更詳細的控件說明和適用的場合請直接參閱參考資料中的相關(guān)文檔。

說明：Android中的系統(tǒng)控件會根據(jù)不同的ROM和操作系統(tǒng)版本有所變化，本文中Android控件以《Android Design》為主要參考。

二、目的

本文期望表達的含義，集中于如下三個方面：

√ iOS和Android的的控件在目標(biāo)上是趨同的，但形式則有較大區(qū)別，因此Android產(chǎn)品符合Android本身的風(fēng)格，不建議直接沿用iOS風(fēng)格。

√ 了解iOS和Android控件的對應(yīng)關(guān)系，有助于在產(chǎn)品設(shè)計時，既能利用現(xiàn)有的思路，又能符合相應(yīng)平臺的風(fēng)格

√ Android因為各設(shè)備商自定義ROM、不同系統(tǒng)版本之間的不同、設(shè)備物理屬性的多樣化等原因，造成Android本身的風(fēng)格有多種，設(shè)計優(yōu)秀的Android應(yīng)用，是一件不容易的事情。

三、功能欄

3.1 狀態(tài)欄(Status Bar)

  iPhone的狀態(tài)欄系統(tǒng)提供了3種樣式，分別為淺色、深色、深色半透，高度固定。

  Android的狀態(tài)欄根據(jù)各個手機廠商自定義的ROM不同，會有多種樣式，在MIUI中還可以根據(jù)主題不同也會變化。

 

3.2導(dǎo)航欄(Navigation Bar)

   iPhone的導(dǎo)航欄高度固定，放置在界面頂部，導(dǎo)航欄中部一般放置標(biāo)題，但也可以被用來放置其他內(nèi)容，左側(cè)一般放置導(dǎo)航或者其他按鈕，右側(cè)一般放置按鈕。

  Android的導(dǎo)航欄會根據(jù)情況不同而承擔(dān)導(dǎo)航、操作欄(Acton Bar)、情景操作欄(Contextual Action Bars)的功能。

當(dāng)承擔(dān)導(dǎo)航功能時，出現(xiàn)的元素包含標(biāo)題，左箭頭（代表上一級），這些元素聯(lián)合界面、系統(tǒng)返回鍵（硬返回鍵或軟返回鍵）一起構(gòu)成了導(dǎo)航。

當(dāng)其承擔(dān)操作欄功能是，出現(xiàn)的元素有操作圖標(biāo)（有時候是平面的純文字，包括更多圖標(biāo)）、Spinners下拉菜單、選項卡等，如果操作欄圖標(biāo)過多，會在界面最下方提供另外一條操作欄。

情景操作欄的出現(xiàn)場景包括文本選擇、內(nèi)容的選擇等，一般是通過對當(dāng)前內(nèi)容長按出現(xiàn)。此控件是Android 4.0，用來一定程度上代替長按的彈出菜單。

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

     iPhone的工具欄高度固定，放置在界面底部，界面上一般放置圖標(biāo)或者按鈕。

     Android的當(dāng)頂部操作欄空間不夠無法放置更多按鈕時，會出現(xiàn)在底部，但在有菜單鍵的手機上，會通過菜單彈出放不下的操作欄按鈕。

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

3.4標(biāo)簽欄

    iPhone的標(biāo)簽欄放置在底部，樣式固定。

    Android的標(biāo)簽欄包括位置可變和固定的兩種，在Android 2.x的系統(tǒng)中，還有圖文并排的標(biāo)簽，在Google自身的應(yīng)用中，就有多種標(biāo)簽風(fēng)格。

在Android 4.0中的標(biāo)簽，基本上都是可以左右拖動切換標(biāo)簽的，也可以直接點擊切換。

四、 列表

4.1列表

   iOS的列表包括普通的表格、帶索引的表格、分組的表格。

   Android的列表則也普通的表格、帶分組的表格，有橫線占滿和不占滿的區(qū)別，不占滿的和iOS的分組表格比較類似。

4.2 表格控件

在這些iOS的表格控件中:

ü Android的單選多選通過右側(cè)的復(fù)選框和Radio Box來實現(xiàn);

ü Android無展開指示符;

ü 其他的“詳情指示按鈕、添加、刪除”等操作，可以以下方類似Spinners的標(biāo)記點擊后通彈出操作列表來完成。

Android因為本身沒有提供這樣的表格控件，但因為有類似有需要的場合，所以即使是google官方的應(yīng)用，也擴展出不少非標(biāo)準(zhǔn)的控件，比如表格空間中Google Doc右側(cè)的按鈕、Google Music右側(cè)的Spinners等等。

4.1 開關(guān)

   iPhone中的開關(guān)只有一種樣式。

   Android 則提供了類似iOS的開關(guān)、復(fù)選、單選 等開關(guān)。

五、對話框、動作列表

5.1 對話框

這點主要是風(fēng)格不同，作用比較類似。

另外Android 4.0之前，確定一般在左側(cè)，Android 4.0中，確定變到了右側(cè)。

5.2 帶文本輸入框的對話框

5.3 動作列表

iOS上的動作列表，Android中沒有直接對應(yīng)的元素，但有類似的元素

六、其他系統(tǒng)控件

6.1 選擇器

iPhone和Android分別提供了不同樣式的選擇器。

   Android中的選擇器不同ROM和不同系統(tǒng)版本風(fēng)格不同。

6.2頁面指示器

   iPhone頁面指示器在應(yīng)用和主界面一致。

  Android的頁面指示器主要用于桌面頁面的切換， 不同ROM和不同系統(tǒng)版本風(fēng)格不同。

6.3滑塊

   iOS滑塊一種風(fēng)格，Android不同ROM和不同系統(tǒng)版本風(fēng)格不同。

 

6.4進度條

  Android的進度條依然因為不同ROM和不同系統(tǒng)版本風(fēng)格不同

6.5單選和復(fù)選

    iOS的單選和復(fù)選都可以通過列表中的“對號”來處理，也有類似右圖的樣式。

    Android的基本上是Radio Box和Checkbox的風(fēng)格，當(dāng)然，風(fēng)格一如既往的和ROM以及系統(tǒng)版本號有關(guān)系。

七、特有控件

7.1 Android特有的控件

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

左側(cè)是Spinners，在iOS中沒有直接原生對應(yīng)的，但會有應(yīng)用會嘗試使用類似的，比如新浪微博的客戶端有類似用法。

右側(cè)是toast，會顯示幾秒鐘消失，常用來做某些沒有重要到直接通過對話框來程度的提示，此控件在iOS中也沒有原生對應(yīng)的，但一樣會有應(yīng)用嘗試使用，比如不少應(yīng)用的網(wǎng)絡(luò)錯誤提示。

 ，

7.2 iOS特有的控件

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

分段控制器在Android中沒有太好的替代選擇，google原生應(yīng)用中會用標(biāo)簽欄或九宮格來一定程度上達到分段控制的作用。

（完）

原文：http://www.penddy.com/%E6%B5%85%E8%B0%88ios%E5%92%8Candroid%E7%9A%84%E4%BA%A7%E5%93%81%E4%BA%A4%E4%BA%92%E8%AE%BE%E8%AE%A1%E4%B8%89iphone%E5%92%8Candroid%E7%9A%84%E6%8E%A7%E4%BB%B6%E5%AF%B9%E6%AF%94.html