最全總結！iOS與Android最新原生設計規(guī)范差異
系統(tǒng)版本
? ? Andriod 9.0? VS? ? iOS 12.1.4
分析思路：
? ? 不管是面對哪個平臺的交互設計任務，在確定業(yè)務流程及功能需求的前提下。需要解決的問題，主要涉及以下幾個方面：導航、內容布局、頁面關系、操作、反饋。因此，本文在閱讀了iOS 及Andriod官方設計指南的情況，希望從上述幾個維度，對于指南中提及的內容，進行劃分，希望對日常的交互設計工作起到一定幫助。
差異點概述：
1.導航：
Andriod：頂部導航（多用文字/圖文/可滑動形式）
iOS：頂部導航（分段控制器）
2.布局：
Andriod：多出圖片、卡片的相關規(guī)范
iOS：僅對列表有規(guī)定
3.頁面關系：
Andriod：Bcakdrop、底部表單（本頁）
iOS：滾輪選擇器、模態(tài)
4.操作
Andriod：長按手勢、標簽（chips)
iOS：滑動手勢
5.反饋
Andriod：Snackbar、橫幅（Banner）
iOS：Toast
系統(tǒng)級差異：
1.應用間切換：
Andriod：由底部向上滑動/應用切換按鈕
iOS：連續(xù)按兩次home鍵/向上滑動并停止
2.控制中心：
Andriod:由底部向上滑動
iOS:由頂部向下滑動
3.激活小部件
Andriod:通過長按激活
iOS：通過3Dtouch激活，且小部件可選
4.刪除
Andriod:長按并拖拽
iOS:長按
4.文件管理
Andriod: 1.可選擇圖片、最近、網盤、本機所有文件；2.多層文件夾，可任一層級返回
iOS：1.僅能選擇icloud/iphone/應用中文件；2.多層文件夾，需逐級返回；3.可新建文件夾
導航
1.頂級導航間切換
Andriod:頁面內容被重置（允許修改）
iOS: 頁面內容保留
2.頂部應用欄/導航欄
Android：1.本頁標題居左；2.一級頁面多含抽屜；
iOS：1.本頁標題多居中；2.上級標題多居左；
3.底部應用欄（僅Andriod)
用于：1.需在底部設置「抽屜導航」；2.操作項（2-5）；3.僅移動端
4.抽屜導航（僅Andriod)
1.適用：5+導航項
2.滑出位置：（1）抽屜位于左上：從左至右滑出；（2）抽屜位于左下：從下至上滑出；
4.頂部導航
Andriod:
1.適用：2+導航項
2.形式：固定/滑動&文字/圖形，四者相互組合
3.行為：向上滾動時，可選項卡吸頂，僅顯示狀態(tài)欄
iOS：
1.分段控制器—適用：（1）表單中單選；（2）視圖中切換/分割同類數(shù)據(jù)
2.分段控制器—屬性：（1）<5個；（2）文本/圖像二選一；（3）大小一致；（4）僅點擊
3.行為：向上滾動頁面時，可切換「大標題」至「標準標題」
5.底部導航
Andriod:
1.適用：3-5個導航項
2.行為：（1）頁面向上滾動時，底部導航可消失；（2）子頁面可保留底部導航
iOS：
1.行為：子頁面，底部導航消失；
布局
1.列表：
Andriod:
1.單行：（1）純文本：選項；（2）圖標+文字：選項、通訊錄；
2.兩行：（1）圖標+元圖標：文件列表；（2）縮略圖+元文本：商品列表；
3.三行：（1）形象+文本：郵件列表；（2）縮略圖+文本+元文本：食物列表；
iOS: 1.基本：選項/導航項；2.含詳情：單個已選；3.含輔助信息：多個已選；4.組合式：列表歸類
2.圖片列表（僅Android）：
1.規(guī)則：各項同等重要；2.非規(guī)則：強調某些項；3.編織：瀏覽對等對象；4.砌體：瀏覽原比例對象；
3.卡片（僅Android）：
1.規(guī)則型：快速瀏覽； 2.儀表盤：多功能+多主題； 3.差別型：凸顯卡片；
頁面關系
1.本頁關系：
Andriod:
1.Backdrop：多用于底層（多操作）與頂層（內容多于操作）產生聯(lián)動關系；2.模態(tài)底部表單(sheet:bottom): 用于替換菜單；
iOS：
1.滾輪選擇器：用于選擇（時間、日期、地址…)；2.模態(tài)（用于操作）：提醒、操作表單、活動視圖、模態(tài)視圖（整屏/部分）；
注：通常模態(tài)會提供「取消」、「完成」
背景?。˙ackdrop)
結構：底層 、頂層
用法：1.底層(隱藏):展示與頂層相關的內容； 2.底層(顯示):提供與頂層相關的操作(導航、更改內容、篩選）
注：一次僅能激活一層
頂層：
1.內容形式：列表行、圖片、卡片、文本
2.行為：(1)內容支持橫/豎向滾動 ；(2)底層出現(xiàn)，頂層淡出； (3)底層滾動，頂層模態(tài)； (4)頂層滾動，標題懸??；
底層：
1.內容形式：導航、步驟條、文本框、選擇控件
2.底層高度：取決于內容
3.被關閉： (1)點擊「關閉」 ；(2)點擊頂層； (3)頂層展開箭頭；
4.被展現(xiàn)： (1)點擊菜單/輸入區(qū)域
注：不能通過滑動前層
2.跨頁關系：
Andriod:
1.返回：用于頁面層級遞進關系；2.關閉：僅用于編輯狀態(tài)；
iOS：
1.返回：同上；2.關閉：僅全頁面模態(tài)；
增、改操作
1.按鈕：
Andriod:
1.文字按鈕：非強調；
2.帶邊框按鈕：中強調；
3.帶背景按鈕：最強調；
4.FAB：(1)角色：界面中主操作；（2）用法：觸發(fā)操作/發(fā)起界面；（3）用于：創(chuàng)建/關注/分享/發(fā)起；
iOS：
1.文字按鈕：默認；
2.帶邊框按鈕：僅必要時用（撥號鍵）；
3.帶背景按鈕：僅必要時用（呼叫鍵）；
2.文本框：
Andriod:
1.類型：（1）填充型；（2）線框型；
2.輔助信息：替換原有幫助信息
iOS：
1.類型：無具體規(guī)定；
3.標簽：
Andriod:
1.結構：容器*、文字*、圖標、移除按鈕；
2.類型：
（1）輸入標簽：文本輸入—標簽；單行/折行顯示；
（2）選擇標簽：僅單選；可替換單選；多水平放置；橫向滑動/折行顯示；
（3）篩選標簽：可替換按鈕/復選框；多位于搜索框下/右側；橫向滑動/折行顯示；
（4）操作標簽：與內容相關操作，以動態(tài)/關聯(lián)關系出現(xiàn)；可替換按鈕；多位于卡片下方/界面底部；
3.1 輸入標簽：
3.2 選擇標簽：
3.3 篩選標簽：
3.4 操作標簽：
4.鍵盤：
Andriod:
1.類型（原生）：默認；電話；數(shù)字；鏈接；郵箱；密碼；英文輸入；數(shù)字和符號；計算；
2.命令（原生）：完成；前往；上一項；下一項；搜索；發(fā)送；回車；
注：各廠商定制系統(tǒng)，難確?！赴l(fā)送」一定存在，故一般輸入框后，緊跟「發(fā)送」
3.命令（H5）：下一項&完成，不可調起
特例：輸入框字符為數(shù)字時，按鍵可為“下一項”
iOS：
1.類型（原生）：默認；ASCii碼；數(shù)字和符號；鏈接；數(shù)字；電話；名字和電話；郵箱地址；小數(shù)；推特；網頁搜索；字母；
2.命令（原生）
鍵盤類型：
1.默認：常規(guī)鍵盤
2.文本鍵盤：默認鍵盤-表情符號(密碼輸入）
3.整數(shù)鍵盤：僅輸入數(shù)字0-9。
4.小數(shù)鍵盤：整數(shù)鍵盤+小數(shù)點。
5.電話鍵盤：數(shù)字鍵盤+“*” 和 “#” 。
6.郵箱鍵盤：默認鍵盤+“@”和“.”。
7.鏈接鍵盤：默認鍵盤上+“.com”、“.”和“/”（網址輸入）
8.數(shù)字和符號：數(shù)字鍵盤+標點符號
鍵盤命令：
1.回車（return/enter）：換行
2.搜索（search）：執(zhí)行搜索
3.下一項（next）: 多輸入框，切換至下一個
4.發(fā)送（send): 內容發(fā)送(通訊App)
5.前往（go): 任務過程中,執(zhí)行下一步驟（eg:輸入網址后，前往打開的網頁)
6.完成（done）: 提交
刪除操作
1.手勢
Andriod:
1.點擊：通過點擊，進行導航；執(zhí)行操作/元素交互；
2.拖動：滑動超出閾值，「默認視圖」變?yōu)椤溉烈晥D」/「關閉視圖」；
3.滾動&平移/輕坲：垂直/水平/全方向移動；
4.滑動：（1）左滑/右滑動列表>閾值，可完成操作；（2）一級頁面，可右滑喚出導航；
5.連續(xù)點擊：縮放
6.捏：（1）縮放進行導航；（2）圖形縮放：
7.長按：可顯示其他模式和特性（eg:編輯）；
8.拾取&移動：長按并拖動，可對內容重新排序；
9.復合手勢：用戶可在不同手勢（縮放、旋轉、平移）間無縫切換；
iOS：
1.點擊：激活操作/選擇條目；
2.拖動：進入編輯狀態(tài)后，從一側移動至另一側，屏幕內拖動；
3.輕坲：快速滾動/平移：
4.滑動：（1）左滑列表行；（2）單手右滑，回到上頁；（3）單手滑動，展示被隱藏分割視圖；（4）四指滑動：應用間切換（僅iPad）；
5.連續(xù)點擊：縮放
6.捏：僅圖像縮放；
7.觸摸&按住：可放大文本；3D touch;
8.旋轉：旋轉圖片/視圖；
1.1 點擊
1.2 拖動
1.3 滑動
1.4 長按
1.5 拾取&移動
2.操作
Andriod:
1.操作菜單：獨有；
2.底部表單：無取消按鈕；
3.簡易對話框：（1）中間彈出；（2）無「取消」；（3）選擇操作，會關閉；（4）操作非遮罩區(qū)域，直接關閉；
iOS：操作表單/活動視圖
1.關閉：取消/遮罩區(qū)域
2.使用：（1）單任務，多選項；（2）危險操作，二次確認；（3）可連續(xù)彈出；（4）操作表單，避免滾動；
注：如危險情況，非用戶觸發(fā)，則使用「提醒」；
2.1 操作菜單
2.2底部表單/操作表單
2.3 簡易對話框
3.選擇控件
Andriod:
1.日期選擇—對話框；2.時間選擇—對話框；3.單選/多選—區(qū)分；4.其他選擇—下拉菜單；
iOS
1.日期選擇—滾輪選擇器；2.時間選擇—滾動選擇器（多出現(xiàn)下方/附近）；3.單選/多選—不區(qū)分；4.其他選擇—滾輪選擇器；
3.1 日期選擇
3.2 時間選擇
3.3 其他
反饋
Andriod:
1.輕打斷：Snackbar
（1）操作（非必須）；（2）自動消失（4-10S）；（3）操作項（0-1）；（4）位置：底部部導航；
2.中打斷：橫幅
（1）操作/圖標（可選）；（2）隨內容滾動，需用戶消除；（3）操作項（1-2）；（4）位置：導航欄/固定搜索之下；
3.重打斷：對話框
（1）操作（必須）；（2）需用戶忽略；（3）操作項（1-2）；
注：操作項位于右側
iOS:
1.輕打斷：Toast
（1）無操作；（2）自動消失；
2.重打斷：對話框
（1）操作（必須）；（2）需用戶忽略；（3）操作項（1-2）；
注：操作項位于居中
1.輕打斷：
2.中打斷：
3.重打斷：
參考文章及來源：
1.這個控件叫：Soft Keyboard/Virtual Keyboard/軟鍵盤/虛擬鍵盤
http://www.itdecent.cn/p/0c210c8ec5a0
2.交互稿中「鍵盤類型」的標注
https://mp.weixin.qq.com/s/ii7iTwT7B-SmHkC_7bcUbQ?
3.深度基礎 | 交互中的Android鍵盤詳解
https://mp.weixin.qq.com/s/nQx2CpEHCycwyunEgI-m2w?
4.Human Interface Guidelines
https://developer.apple.com/design/human-interface-guidelines/ios/overview/themes/
5.Material Design
