如何讓你的iOS與Android應用與眾不同

lum發表於2014-07-02

我們現在仍能看到很多的Android應用程式是直接從其他平臺(即iOS)遷移過來的。這裡有一些設計UI的簡單方法,可以讓你的Android應用看起來很地道。為了更容易找出區別,我會對一些模式(Android上的說法)和讓Android和iOS不一樣的構建模組並排進行比較。

注:我將使用Android術語。

操作欄

iOS

Android

01_actionbar_ios 01_actionbar_adr
  1. 返回前一頁按鈕
  2. 應用名稱或者頁面名稱居中
  3. 操作按鈕經常位於這裡:編輯、刪除等
  1. 向上插入符號。這不是後退按鈕。導航到當前頁面的上一級。
  2. 徽標
  3. 應用名稱或者頁面名稱
  4. 操作按鈕。多出的按鈕在最右邊

列表

iOS

Android

02_list_ios 02_list_adr
  1. 最顯著的區別是:在Android中,螢幕右側沒有向右的插入符號。
  2. 條目的分節佈局不一樣。

取消/完成按鈕

iOS

Android

03_yesno_ios 如何讓你的iOS與Android應用與眾不同
  1. 取消在左,完成在右,由頁面名稱分隔。
  1. 取消(非啟用)在左,完成(啟用)在右,由垂直分隔符分隔。

表單和搜尋欄

iOS

Android

04_forms_ios 04_forms_adr
  1. 表單元素都是圓角。
  2. 搜尋欄被包在一個圓角框裡,通常為透明的。
  3. 選擇列表與日期/時間選擇器相同。
  1. 按鈕和開關都是尖角。
  2. 搜尋欄與文字域基本一樣,一個前面帶有搜尋圖示的單行。
  3. Android中有下列列表或者網頁術語上的下列或者選擇選單。這種模式通常不用作日期/時間選擇器。

對話方塊

iOS

Android

05_dialog_ios 05_dialog_adr
  1. 同樣,iOS實現了圓角。
  1. Android的是尖角。頭部和主體通過線條分開。

固定標籤

iOS

Android

06_tab_ios 06_tab_adr
  1. 標籤頁看起來像一個分段的膠囊。
  2. 選中的條目背景顏色會變化。
  1. 標籤頁佔用螢幕的整個水平寬度。
  2. 選中的條目下面有一個較粗的線條。

當然,這些不是iOS和Android所有的差異。我認為最明顯的區別是Android中向上插入符和回退按鈕的使用與iOS相反,iOS使用返回插入符按鈕返回或向上到前一畫面。

要了解Android中向上插入符和回退按鈕的區別,請點選這裡


相關文章