活動(dòng)指示器表明任務(wù)或進(jìn)程正在進(jìn)行中,如下圖所示。
API 注釋
想要了解如何在代碼中定義活動(dòng)指示器,可以參考 UIActivityIndicatorView Class Reference.
活動(dòng)指示器:
不要使用靜止的活動(dòng)指示器。用戶會(huì)以為該進(jìn)程停滯了。
用活動(dòng)指示器來(lái)讓用戶知道進(jìn)程仍在進(jìn)行中。有些時(shí)候,告訴用戶進(jìn)程沒(méi)有停止比告訴他們何時(shí)完成更加重要。
設(shè)計(jì)一個(gè)與應(yīng)用的風(fēng)格協(xié)調(diào)的活動(dòng)指示器。可以的話,讓活動(dòng)指示器的尺寸和顏色與它所在的背景協(xié)調(diào)。
添加聯(lián)系人按鈕讓用戶將現(xiàn)有聯(lián)系人添加到文本框或者其它文字視圖中。
API 注釋
想要了解如何在代碼中定義添加聯(lián)系人按鈕,請(qǐng)參考 UIButton.
添加聯(lián)系人按鈕:
由于添加聯(lián)系人按鈕屬于鍵盤輸入聯(lián)系人方法的替代品,我們不推薦在不支持鍵盤輸入的界面中使用添加聯(lián)系人按鈕。
日期時(shí)間選擇器展示關(guān)于日期和時(shí)間的組件,比如小時(shí),分鐘,天,以及年。
API 注釋
想要了解如何在代碼中定義添加日期時(shí)間選擇器,請(qǐng)參考 UIDatePicker.
日期時(shí)間選擇器:
盡量地讓用戶在當(dāng)前內(nèi)容中使用日期選擇器。盡量地讓用戶在當(dāng)前內(nèi)容中使用日期選擇器。最好避免用戶在使用日期選擇器的時(shí)候要進(jìn)入另外一個(gè)界面。在水平方向的常規(guī)環(huán)境,日期時(shí)間選擇器可能會(huì)出現(xiàn)在一個(gè)浮層中,或者嵌入在當(dāng)前內(nèi)容里。
有必要的時(shí)候,改變分鐘滑輪的單位刻度。在默認(rèn)情況下,分鐘滑輪包含從0到59共60個(gè)值,如果你要展示一個(gè)顆粒度較大的時(shí)間,你可以讓分鐘滑輪的單位刻度變大,只要這個(gè)刻度可以整除60。比如說(shuō)你可能會(huì)設(shè)定每15分鐘為一個(gè)刻度,此時(shí)分鐘滑輪就有4個(gè)值,0、15、30、45。
詳情展開按鈕展示了與該項(xiàng)相關(guān)的更多詳細(xì)信息與功能描述。
API 注釋
想要了解如何在代碼中定義詳情展開按鈕,可以參考 UITableViewCell Class Reference 和 UIButton.
詳情展開按鈕以一個(gè)單獨(dú)的視圖展示特定項(xiàng)目的更多詳情信息與功能。
當(dāng)詳情展開按鈕在表格行中出現(xiàn)時(shí),點(diǎn)擊表格行的其它區(qū)域不會(huì)激活此按鈕,只會(huì)選中該行,或者觸發(fā) app 中其它自定義的行為。
一般來(lái)說(shuō),你會(huì)在一個(gè)表格視圖中使用詳情展開按鈕來(lái)讓用戶知道更多關(guān)于這個(gè)列表項(xiàng)的信息。當(dāng)然你也可以將這個(gè)按鈕用在其它類型的視圖中來(lái)為用戶展示更多與特定項(xiàng)目相關(guān)的信息和功能。
信息按鈕展示了 app 的配置信息,有時(shí)候它會(huì)出現(xiàn)在當(dāng)前視圖的背面。
API 注釋
想要了解如何在代碼中定義信息按鈕,可以參考 UIButton.
iOS 包含了兩種信息按鈕樣式:適用于淺色內(nèi)容上的深色按鈕,以及適用于深色內(nèi)容上的淺色按鈕。
使用信息按鈕來(lái)顯示 app 的配置信息或選項(xiàng)。你可以根據(jù)自己 app 的 UI 風(fēng)格來(lái)選擇最為協(xié)調(diào)的信息按鈕樣式。
標(biāo)簽用于放置靜態(tài)文本。
API 注釋
想要了解如何在代碼中定義標(biāo)簽,可以參考 UILabel Class Reference.
標(biāo)簽可以:
保證你的標(biāo)簽清晰易讀。最好支持動(dòng)態(tài)文本(Dynamic Type),并使用 UIFont 中的 preferredFontForTextStyle 來(lái)獲得標(biāo)簽中的展示文本。如果你要用自定義字體的話,請(qǐng)慎重選擇字體種類,不要以犧牲清晰度為代價(jià)來(lái)?yè)Q取花哨的顏色和字體效果。(想要了解關(guān)于app中字體使用的指南,可以參考 Color and Typography;想要了解更多動(dòng)態(tài)文本的內(nèi)容,可以參考 Text Programming Guide for iOS 里面 的 Text Styles 部分。)
網(wǎng)絡(luò)活動(dòng)指示器在狀態(tài)欄中出現(xiàn),表示網(wǎng)絡(luò)活動(dòng)正在進(jìn)行。
API 注釋
你可以在代碼中使用 UIApplication 的 networkActivityIndicatorVisible 來(lái)控制該活動(dòng)指示器的可見(jiàn)性。
網(wǎng)絡(luò)活動(dòng)指示器:
頁(yè)面控件告訴用戶當(dāng)前共打開了多少個(gè)視圖,還有他們正處在其中哪一個(gè)。
API 注釋
想要了解如何在代碼中定義頁(yè)面控件,可以參考 UIPageControls.
頁(yè)面控件:
不要使用頁(yè)面控件來(lái)顯示視圖中的層次結(jié)構(gòu)或其他復(fù)雜的排列。頁(yè)面控件不顯示視圖是如何相互關(guān)聯(lián)的,而且不表明哪個(gè)視圖對(duì)應(yīng)于每個(gè)點(diǎn),因此它不能幫助用戶導(dǎo)航到特定的視圖。
避免顯示太多點(diǎn)。超過(guò)10個(gè)點(diǎn)就很難讓用戶一目了然,而超過(guò)20個(gè)視圖在序列中訪問(wèn)起來(lái)非常耗時(shí)。如果用戶可以在你的應(yīng)用程序打開超過(guò)20個(gè)視圖,請(qǐng)考慮給視圖一個(gè)不同的展示方式,以提供關(guān)于視圖的詳細(xì)信息,使其支持不連續(xù)的導(dǎo)航。
在打開視圖的底部邊緣和屏幕的底部邊緣里垂直居中頁(yè)面控件。在這個(gè)位置,頁(yè)面控件是始終可見(jiàn)的,并且不會(huì)阻擋用戶的使用。
選擇器展示了一組值,用戶可以從中選擇一個(gè)。
API 注釋
想要了解如何在代碼中定義選擇器,可以參考 UIPickerView Class Reference.
選擇器:
一般來(lái)說(shuō),當(dāng)用戶對(duì)整組值都比較熟悉的時(shí)候,可以使用選擇器。由于當(dāng)滑輪靜止的時(shí)候,大部分的數(shù)值會(huì)被隱藏,最好是在用戶對(duì)所有數(shù)值均有預(yù)期的情況下才使用選擇器。當(dāng)你需要展示一大組用戶并不熟悉的選項(xiàng),此種選擇器可能不太適合。
盡可能讓讓用戶在當(dāng)前視圖中使用選擇器。不要讓他們?cè)谑褂眠x擇器時(shí)還要進(jìn)入其它的視圖。
如果你需要展示的備選項(xiàng)數(shù)量很多,考慮使用表格視圖(Table View)而不是選擇器。因?yàn)楸砀褚晥D的高度較大,內(nèi)容滾動(dòng)起來(lái)會(huì)更快。
進(jìn)度視圖展示了任務(wù)或進(jìn)程的進(jìn)度(下圖是 iOS 默認(rèn)郵件 App 的工具欄)。
API 提示:
想要了解更多如何在代碼中定義進(jìn)度視圖,可以參考 UIProgressView Class Reference.
進(jìn)度視圖:
不支持用戶交互行為 iOS 定義了兩種進(jìn)度視圖樣式:
當(dāng)一個(gè)任務(wù)存在明確的進(jìn)程,可以使用進(jìn)度條來(lái)給與用戶反饋,尤其在需要明確告訴用戶這個(gè)任務(wù)大約需要多少時(shí)間完成的時(shí)候。
可以的話,請(qǐng)根據(jù)你的 app 的風(fēng)格來(lái)設(shè)計(jì)進(jìn)度條的外觀。你可以自定義進(jìn)度條的底色以及軌跡顏色,也可以直接使用圖片。
刷新控件執(zhí)行用戶觸發(fā)的內(nèi)容刷新——一個(gè)典型的例子,它常在表格中出現(xiàn)(下圖展示的是 iOS 默認(rèn)的郵件 app 的 mailbox 列表頁(yè))。
API 提示:
想要了解更多如何在代碼中定義刷新控件,可以參考 UIRefreshControl Class Reference.
刷新控件:
就算你使用了刷新控件,也不要因此就不支持內(nèi)容自動(dòng)刷新。盡管用戶喜歡在執(zhí)行刷新操作時(shí)內(nèi)容立刻刷新,他們也同樣會(huì)喜歡內(nèi)容自動(dòng)刷新。如果過(guò)于一來(lái)用戶自己執(zhí)行所有刷新操作的話,那些不會(huì)自動(dòng)刷新的用戶就會(huì)疑惑,為何你 app 中的數(shù)據(jù)永遠(yuǎn)都不更新。一般來(lái)說(shuō),刷新控件給了用戶多一個(gè)選擇,讓他們可以立刻獲得最新的內(nèi)容,但同時(shí),你也不能奢望用戶會(huì)主動(dòng)獲取所有的更新信息。
只有在必要的時(shí)候才加短標(biāo)題。特別需要注意的是,不要使用短標(biāo)題來(lái)描述刷新控件怎么使用。
iOS7 及更新版本中已經(jīng)不再使用圓角矩形按鈕,而是使用了新的系統(tǒng)按鈕——類型為 UIButtonTypeSystem 的 UI 按鈕 (UIButton) 。使用指南可參考 System Button.
分段控件是一組分段的線性集合,每一個(gè)分段的作用類似按鈕,點(diǎn)擊之后將切換到相應(yīng)的視圖。
API 提示:
想要了解更多如何在代碼中定義分段控件,可以參考 Segmented Controls
分段控件:
保證每個(gè)分段都容易點(diǎn)擊。為了保證每個(gè)分段的大小有至少44×44像素,請(qǐng)控制分段的數(shù)量。在 iPhone 上,1個(gè)分段控件最多包含5個(gè)分段。
盡可能地保持每個(gè)分段中的文字長(zhǎng)度一致。因?yàn)槊總€(gè)分段都是等寬的,當(dāng)文本長(zhǎng)度差異很大時(shí)看上去會(huì)很不協(xié)調(diào)。
不要在同一個(gè)分段控件中混用文字和圖片。每一個(gè)分段都僅可支持純文字或純圖片。避免在同一個(gè)分段控件中,一些分段里使用純文字,另一些分段里使用純圖。
請(qǐng)?jiān)诒匾獣r(shí)調(diào)整分段控件中文本的對(duì)齊方式。如果你給分段控件添加了自定義底圖,請(qǐng)確保控件里自動(dòng)居中的文本依然清晰美觀。你可以通過(guò) bar metrics APIs 來(lái)調(diào)整分段控件內(nèi)文本的對(duì)齊方式(想要了解如何定義 bar metrics,可以參考 UISegmentedControl 中關(guān)于自定義 API 外觀(appearance-customization APIs)的描述)。
滑塊允許用戶在一個(gè)限定范圍內(nèi)調(diào)整某個(gè)數(shù)值或進(jìn)程(下圖展示的是 iOS 設(shè)置中亮度設(shè)置的滑塊,滑塊的左邊和右邊均為自定義圖形)。
API 提示:
想要了解更多如何在代碼中定義滑塊,可以參考 Sliders
滑塊:
如果合適的話,自定義滑塊的外觀。比如,你可以:
步進(jìn)器可以以常數(shù)為幅度來(lái)增減當(dāng)前數(shù)值。
API 提示:
想要了解更多如何在代碼中定義步進(jìn)器,可以參考 UIStepper.
步進(jìn)器:
當(dāng)用戶需要大幅度調(diào)整數(shù)值的時(shí)候,不要使用步進(jìn)器。用戶可能會(huì)在打印機(jī)里使用步進(jìn)器來(lái)確定打印份數(shù),因?yàn)檫@個(gè)值的變化幅度通常并不大;而當(dāng)用戶需要選擇打印的頁(yè)碼范圍時(shí),使用步進(jìn)器就會(huì)讓操作變得繁瑣,因?yàn)橛脩艉芸赡芤c(diǎn)很多下才能選定頁(yè)數(shù)。
確保步進(jìn)器所調(diào)整的值明顯可見(jiàn)。步進(jìn)器自身不展示任何數(shù)值,所以你需要保證讓用戶知道他們正在調(diào)整哪一個(gè)數(shù)值。
開關(guān)按鈕展示了兩個(gè)互斥的選項(xiàng)或狀態(tài)。
API 提示:
想要了解更多如何在代碼中定義步開關(guān),可以參考 UISwitch.
開關(guān)按鈕:
你可以使用開關(guān)按鈕來(lái)控制視圖中的其它 UI 元素。根據(jù)用戶的選擇,新的列表項(xiàng)可能出現(xiàn)或者消失,或從激活狀態(tài)變?yōu)椴患せ顮顟B(tài)。
系統(tǒng)按鈕執(zhí)行 app 中定義的行為。
API 提示:
在 iOS 7 中,UIButtonTypeRoundedRect 已經(jīng)被重新定義為 UIButtonTypeSystem. 想要了解更多如何在代碼中定義系統(tǒng)按鈕,可以參考 UIButton.
系統(tǒng)按鈕:
支持自定義樣式,如描邊或者加背景圖(想要自定義按鈕外觀,可以使用 UIButtonTypeCustom 類型的按鈕,并且提供背景圖片) 使用系統(tǒng)按鈕來(lái)執(zhí)行某個(gè)動(dòng)作。當(dāng)你為系統(tǒng)按鈕命名時(shí),請(qǐng)遵循以下方法:
合適的話,為內(nèi)容區(qū)域內(nèi)的系統(tǒng)按鈕描邊或者加入背景。大多數(shù)情況下,你可以通過(guò)定義一個(gè)清晰的按鈕名稱、選擇一個(gè)不一樣的標(biāo)題顏色或提供上下文情景提示來(lái)讓用戶知道這是一個(gè)按鈕而非普通文本。但在某些特定的內(nèi)容區(qū)域內(nèi),為按鈕描邊或者添加背景顏色,讓用戶迅速地把注意力放到按鈕上,也是必要的。Value 2 的布局中,文本和副標(biāo)題中間的垂直間距會(huì)讓用戶專注于副標(biāo)題的第一個(gè)單詞。
開關(guān)按鈕展示了兩個(gè)互斥的選項(xiàng)或狀態(tài)。
API 提示:
想要了解如何在代碼中定義文本框,以及在文本框中支持圖片和按鈕,可以參考 UITextField.
文本框
你可以自定義一個(gè)文本框,幫助用戶更好地理解如何使用它。舉個(gè)例子,你可以在文本框的左側(cè)或者右側(cè)加入自定義圖形,或者加入系統(tǒng)按鈕,如書簽按鈕等。一般來(lái)說(shuō),文本框的左側(cè)用于表述文本框的含義,而右側(cè)用于展示附加的功能,如書簽。
合適的話,在文本框右側(cè)加入清除按鈕。輕擊清除按鈕變可清空當(dāng)前框內(nèi)輸入的全部?jī)?nèi)容,無(wú)論你原本打算在這個(gè)按鈕上面展示什么其它圖片。
如果可以幫助用戶理解的話,可以在文本框中加入提示文字。當(dāng)文本框里沒(méi)有任何其它提示文字時(shí),會(huì)展示占位符文本(placeholder text),如名字、地址等。
根據(jù)輸入內(nèi)容的類型來(lái)指定不同的鍵盤類型。舉例來(lái)說(shuō),你希望用戶能更方便地輸入網(wǎng)址、密碼或者電話號(hào)碼。iOS 提供了各種不同的鍵盤類型,以便用戶輸入不同類型的文本。想要了解可用鍵盤類型,可以參考 UITextInputTraits Protocol Reference 中的 UIKeyboardType.想要了解如何在管理你的應(yīng)用中的鍵盤,請(qǐng)參考 Managing the Keyboard 部分。但請(qǐng)注意,由于鍵盤的布局以及輸入方法是由用戶的系統(tǒng)語(yǔ)言設(shè)置決定的,這是你不能控制的。
更多建議: