內(nèi)容視圖

內(nèi)容視圖

活動(dòng)

每個(gè)活動(dòng)表示一個(gè)系統(tǒng)提供的或自定義的服務(wù)——它可以通過(guò)訪問(wèn)活動(dòng)視圖控制器(Activity view controller)來(lái)作用于某些特定的內(nèi)容。

API 注釋

想要了解如何在代碼中定義活動(dòng)，請(qǐng)參考 UI Activity Class Reference.想要了解如何將活動(dòng)視圖控制器整合到你的應(yīng)用中，請(qǐng)參考 Activity View Controller.

動(dòng)作與分享擴(kuò)展程序也可以在活動(dòng)視圖控制器中展示。想要了解更多關(guān)于這些擴(kuò)展程序的內(nèi)容，請(qǐng)參考 Share and Action Extensions.

活動(dòng)是：

• 一種可定制對(duì)象，代表著某個(gè)可以讓用戶在 app 中執(zhí)行操作的服務(wù)
• 以圖標(biāo)的形式呈現(xiàn)，外觀與欄按鈕圖標(biāo)相似

用戶通過(guò)點(diǎn)擊活動(dòng)的圖標(biāo)來(lái)啟動(dòng)某樣活動(dòng)。點(diǎn)擊之后該項(xiàng)服務(wù)通常會(huì)立刻執(zhí)行，當(dāng)這項(xiàng)服務(wù)過(guò)于復(fù)雜時(shí)，系統(tǒng)將會(huì)進(jìn)一步索取更多的信息之后才會(huì)為用戶執(zhí)行該服務(wù)。

使用活動(dòng)來(lái)讓用戶執(zhí)行你的應(yīng)用所提供的服務(wù)。請(qǐng)注意，iOS 本身提供了若干內(nèi)置的服務(wù)，如打印，轉(zhuǎn)發(fā)到 Twitter，發(fā)送信息和 Airplay 等等，你不需要再額外為這些內(nèi)置任務(wù)創(chuàng)建活動(dòng)。

為你應(yīng)用的各種服務(wù)設(shè)計(jì)一套精簡(jiǎn)的線性模板圖標(biāo)(Template image)。后臺(tái)會(huì)將會(huì)把這種模板圖標(biāo)作為剪影遮罩，組合成用戶最終看到的圖標(biāo)效果。想設(shè)計(jì)出好看的模版圖標(biāo)，可以遵循以下原則：

• 使用透明度適當(dāng)?shù)暮谏虬咨?/li>
• 不要使用陰影
• 進(jìn)行抗鋸齒處理 一個(gè)活動(dòng)模版圖大小應(yīng)該保持在70×70像素左右(高分辨率下)，在區(qū)域里居中顯示。

為每一個(gè)活動(dòng)設(shè)計(jì)清晰簡(jiǎn)練的文字標(biāo)題。標(biāo)題將會(huì)出現(xiàn)在活動(dòng)菜單圖標(biāo)的下方。一般來(lái)說(shuō)短標(biāo)題效果最好，因?yàn)樗谄聊簧系娘@示效果更好并且更容易本地化。如果你的標(biāo)題文字過(guò)長(zhǎng)，iOS 會(huì)將縮小文本，仍然過(guò)長(zhǎng)的話則會(huì)被截?cái)唷Ｒ话愣?，最好能避免在活?dòng)標(biāo)題中提及你的公司或產(chǎn)品名稱。

活動(dòng)視圖控制器

活動(dòng)視圖控制器是一個(gè)臨時(shí)視圖，當(dāng)中羅列了一系列可以針對(duì)頁(yè)面特定內(nèi)容的系統(tǒng)服務(wù)和定制服務(wù)。

API 注釋

想要了解如何在代碼中定義活動(dòng)視圖控制器，請(qǐng)參考 UIActivityView Class Reference.想要了解如何設(shè)計(jì)一個(gè)提供自定義服務(wù)的活動(dòng)菜單，請(qǐng)參閱上文中關(guān)于活動(dòng)彩蛋的內(nèi)容。

活動(dòng)視圖控制器：

• 顯示了讓用戶可以針對(duì)當(dāng)前內(nèi)容執(zhí)行操作的一系列的可配置服務(wù)
• 根據(jù)所處的場(chǎng)景不同，可能出現(xiàn)在操作列表或浮出層中 使用活動(dòng)視圖控制器來(lái)為用戶提供一系列針對(duì)當(dāng)前內(nèi)容的服務(wù)。這些服務(wù)可以是系統(tǒng)自帶的，比如復(fù)制，分享到 twitter，打印等等，也可以是自定義的?；顒?dòng)視圖控制器通常用作讓用戶把他們選中的內(nèi)容復(fù)制到他們的社交媒體賬戶上。

不要?jiǎng)?chuàng)建一個(gè)自定義按鈕來(lái)觸發(fā)活動(dòng)視圖控制器。用戶更習(xí)慣點(diǎn)擊動(dòng)作按鈕后使用系統(tǒng)提供的服務(wù)。你應(yīng)該學(xué)會(huì)如何更好地利用用戶這一既定習(xí)慣，而不是強(qiáng)迫他們以一種全新的方式來(lái)完成同樣的事情。

確?？刂破髦械牟僮鬟m用于當(dāng)前場(chǎng)景。你可以適當(dāng)?shù)卦诨顒?dòng)視圖控制器中增減系統(tǒng)操作，或增加自定義操作。例如，如果你不希望用戶打印某張圖片，你可以把打印功能從控制器中刪除。

注意

你不能改變系統(tǒng)默認(rèn)服務(wù)在控制器中的順序。同時(shí)，所有系統(tǒng)服務(wù)都應(yīng)該出現(xiàn)在自定義服務(wù)之前。

集合視圖

集合視圖用于管理一系列有序的項(xiàng)，并以一種自定義的布局來(lái)呈現(xiàn)它們。

API 注釋

想要了解如何在代碼中定義集合視圖，請(qǐng)參考 Collection View Programming Guide for iOS.

集合視圖：

• 可包含裝飾視圖，以從視覺(jué)上區(qū)分項(xiàng)的子集或者提供裝飾性項(xiàng)目，例如自定義背景。
• 布局切換時(shí)支持自定義轉(zhuǎn)場(chǎng)動(dòng)畫。（默認(rèn)情況下，當(dāng)用戶導(dǎo)入、移動(dòng)或者刪除項(xiàng)的時(shí)候，會(huì)出現(xiàn)系統(tǒng)默認(rèn)的動(dòng)畫效果。）
• 支持開(kāi)發(fā)者額外定義手勢(shì)識(shí)別來(lái)執(zhí)行自定義操作。默認(rèn)情況下，集合視圖可以識(shí)別輕擊(tap)某項(xiàng)以選中，和長(zhǎng)按(touch-and-hold)某項(xiàng)進(jìn)行編輯。 使用集合視圖來(lái)讓用戶查看和操作一系列不適合以列表形式呈現(xiàn)的項(xiàng)。由于集合視圖的布局不是一個(gè)嚴(yán)格的線性布局，因此尤其適合用來(lái)展示一些尺寸不一致的項(xiàng)。

集合視圖支持廣泛的自定義，因此我們要盡量避免把心思都放在進(jìn)行全新的設(shè)計(jì)上。集合視圖是用來(lái)幫助用戶更好地完成任務(wù)的，視圖本身并不是用戶體驗(yàn)的焦點(diǎn)所在。以下指南可以幫助你設(shè)計(jì)出用戶體驗(yàn)更好的集合視圖：

表格視圖(table view)更適用的時(shí)候，不要使用集合視圖。有時(shí)候用戶會(huì)覺(jué)得以列表呈現(xiàn)的信息更容易閱讀和理解，例如將文本信息放在滾動(dòng)列表中的時(shí)候，用戶閱讀和處理起來(lái)會(huì)更為簡(jiǎn)單和高效。

讓視圖中的項(xiàng)更容易選中。如果用戶很難點(diǎn)中集合視圖中的項(xiàng)，他們是不會(huì)愿意用你的應(yīng)用的。跟所有用戶可以點(diǎn)擊的UI對(duì)象一樣，請(qǐng)確保你的集合視圖中每一個(gè)項(xiàng)的最小點(diǎn)擊區(qū)域有44×44pt，尤其是在 iPhone 上。

當(dāng)你要讓整個(gè)布局進(jìn)行動(dòng)態(tài)變化時(shí)，請(qǐng)務(wù)必謹(jǐn)慎。集合視圖允許你在用戶瀏覽和操作項(xiàng)的時(shí)候調(diào)整視圖的布局。但當(dāng)你決定調(diào)整它的時(shí)候，請(qǐng)確保這個(gè)動(dòng)態(tài)變化是有意義且容易跟蹤的。沒(méi)有明確目的而貿(mào)然改變集合視圖的布局會(huì)讓用戶對(duì)應(yīng)用留下難用、不符合預(yù)期等負(fù)面的印象。更有甚者，如果用戶此時(shí)關(guān)注的項(xiàng)在變化中消失了，用戶會(huì)覺(jué)得這個(gè)應(yīng)用超出了他們的控制能力。

容器視圖控制器

容器視圖控制器采用自定義的方式來(lái)管理和呈現(xiàn)它的視圖控制器或一系列子視圖。系統(tǒng)定義的容器視圖控制器典型例子包括標(biāo)簽欄視圖控制器(Tab bar view controller)、導(dǎo)航視圖控制器(navigation view controller)和對(duì)分視圖控制器(split view controller)。

API 注釋

想要了解如何在代碼中定義容器視圖控制器，請(qǐng)參考 UIViewController Class Reference.

容器視圖控制器不存在任何預(yù)先定義好的外觀或者行為。

用容器視圖控制器來(lái)呈現(xiàn)內(nèi)容，使用戶可以通過(guò)控制器來(lái)以自定義的方式進(jìn)行導(dǎo)航。

先問(wèn)問(wèn)你自己是不是必須用到容器視圖控制器。用戶會(huì)更習(xí)慣諸如對(duì)分視圖、或者是標(biāo)簽欄視圖這類他們所熟知的東西。你必須確保你設(shè)計(jì)的控制器的優(yōu)點(diǎn)不會(huì)由于用戶不熟悉、不認(rèn)識(shí)、不會(huì)用而白費(fèi)功夫。

確保你的容器內(nèi)容控制器在橫屏與豎屏模式都可用。很重要的一點(diǎn)是，你的容器視圖控制器無(wú)論在橫屏還是豎屏中，體驗(yàn)都應(yīng)該是一致的。

一般來(lái)說(shuō)，避免太過(guò)花哨的轉(zhuǎn)場(chǎng)動(dòng)畫。如果你采用了故事板(storyboard)的設(shè)計(jì)方法來(lái)設(shè)計(jì)你的視圖控制器，你往往自然而然地會(huì)為它自定義一些動(dòng)畫。但絕大多數(shù)情況下，這些花哨的轉(zhuǎn)場(chǎng)動(dòng)畫會(huì)讓用戶分心，讓他們忘記了當(dāng)前要做的事，還可能降低你的應(yīng)用整體的美感。

圖片視圖

圖片視圖用以展示一張單獨(dú)的圖片，或者一系列動(dòng)態(tài)圖片。

API 注釋

想要了解如何在代碼中定義圖片視圖，請(qǐng)參考 UIImageView.

圖片視圖：

• 不存在任何預(yù)先定義好的外觀，同時(shí)在默認(rèn)狀態(tài)下它不支持用戶的交互行為。
• 可以檢測(cè)圖片本身及其父視圖(parent view)的屬性，并決定這個(gè)圖片是否應(yīng)該被拉伸、縮放、調(diào)整到適合屏幕的大小，或者固定在一個(gè)特定的位置。 在iOS 7及以上版本里，包含了模版圖片(template image)的圖片視圖會(huì)把當(dāng)前的色調(diào)(tint color)應(yīng)用到圖片上。

請(qǐng)務(wù)必確保圖片視圖中的每一張圖片都保持相同的尺寸和比例。如果你的圖片尺寸各不相同，圖片視圖將會(huì)逐一對(duì)它們進(jìn)行調(diào)整；而當(dāng)你的圖片比例不一，渲染的時(shí)候很可能會(huì)出錯(cuò)。

地圖視圖

地圖視圖呈現(xiàn)地理數(shù)據(jù)，同時(shí)支持系統(tǒng)內(nèi)置地圖應(yīng)用的大部分功能（如下圖所示）。

API 注釋

想要了解如何在代碼中定義圖片視圖，請(qǐng)參考 MapKit Framework Reference.

地圖視圖：

• 通常以標(biāo)準(zhǔn)地圖、衛(wèi)星圖像、或兩者結(jié)合的形式來(lái)展示地理區(qū)域
• 可以展示以單點(diǎn)標(biāo)注的備注，以及疊加圖層（繪制路徑或二維區(qū)域繪制輪廓的）
• 支持編程時(shí)定義的，或用戶所控制的縮放和移動(dòng) 利用地圖視圖可以給用戶提供一個(gè)可交互的地理區(qū)域視圖。如果你在開(kāi)發(fā)一個(gè)導(dǎo)航類應(yīng)用(routing app)，可以使用地圖視圖來(lái)展示你給用戶的路徑。

一般來(lái)說(shuō)，允許用戶在視圖中進(jìn)行交互行為。用戶習(xí)慣了在系統(tǒng)內(nèi)置地圖中進(jìn)行交互，因此他們會(huì)有預(yù)期，能在你所提供的地圖中進(jìn)行類似的行為。

使用標(biāo)準(zhǔn)的地圖標(biāo)注顏色。地圖上標(biāo)注了一系列地點(diǎn)。因?yàn)橛脩袅?xí)慣了內(nèi)置地圖的各個(gè)標(biāo)注的顏色，所以最好避免在你的應(yīng)用中重新定義這些顏色的含義。定義顏色時(shí)，請(qǐng)遵循以下這些標(biāo)準(zhǔn)：

• 紅色表示目的地
• 綠色表示起點(diǎn)
• 紫色表示用戶指定的地點(diǎn)(User-Specified Point)

頁(yè)面視圖控制器

頁(yè)面視圖控制器通過(guò)滾動(dòng)(Scrolling)或翻頁(yè) (Page-curl transition style)兩種方式來(lái)處理長(zhǎng)度超過(guò)一頁(yè)的內(nèi)容。下圖是 iOS 模擬器中的翻頁(yè)樣式：

API 注釋

想要了解如何在代碼中定義圖片視圖，請(qǐng)參考 Page View Controllers.

頁(yè)面視圖控制器：

• 帶滾動(dòng)條的頁(yè)面視圖控制器沒(méi)有默認(rèn)的外觀。 帶翻頁(yè)效果的控制器可以在兩頁(yè)中間增加書脊(book spine)的效果

• 可以根據(jù)指定的轉(zhuǎn)場(chǎng)來(lái)模擬出頁(yè)面切換時(shí)的動(dòng)畫。 使用滾動(dòng)條效果的時(shí)候，當(dāng)前頁(yè)面將滾動(dòng)到下一頁(yè)；而使用翻頁(yè)效果時(shí)，頁(yè)面上會(huì)出現(xiàn)一個(gè)模擬實(shí)體書或筆記本翻頁(yè)效果的翻頁(yè)動(dòng)畫

使用頁(yè)面視圖控制器來(lái)展示那些線性的內(nèi)容（比如一個(gè)故事的文本），或者是一些可以被自然地拆分成塊的內(nèi)容（比如日歷）。

如果需要的話，設(shè)計(jì)一種自定義的方式讓用戶可以以非線性的方式來(lái)獲取內(nèi)容。頁(yè)面視圖控制器讓用戶從一頁(yè)移動(dòng)到前一頁(yè)或者后一頁(yè)，而并不支持用戶在并不相鄰的頁(yè)面間快速切換。如果你希望在頁(yè)面視圖控制器中展示一些非線性的內(nèi)容——比如說(shuō)字典，或者書籍的目錄——那么你就需要自定義一種方式，讓用戶可以隨意地到達(dá)不同的內(nèi)容區(qū)塊。

浮出層

浮出層是當(dāng)用戶輕點(diǎn)某個(gè)控件或頁(yè)面中的某一區(qū)域時(shí)浮出的，半透明的臨時(shí)視圖。

API 注釋

在 iOS 8 以及以上版本里，你可以使用 UIPopoverPresentationController 來(lái)展示一個(gè)浮出層。UIPopoverPresentationController 定義了一種委托，讓你可以調(diào)整浮出層的內(nèi)容樣式，讓它能夠更好地適應(yīng)當(dāng)前的屏幕內(nèi)容。舉個(gè)例子，在橫屏視圖中，你的內(nèi)容可能會(huì)全部承載在浮出層內(nèi)部；而在豎屏的情況下，浮出層可以以一種全屏模態(tài)視圖的樣式出現(xiàn)。

浮出層：

• 是一個(gè)自包含的模態(tài)視圖
• 在橫屏環(huán)境中，浮出層會(huì)包含一個(gè)箭頭，指向其出處
• 背景是半透明的，并且會(huì)模糊其背后的內(nèi)容（毛玻璃效果）
• 可以包含多種對(duì)象和視圖，比如：
• 表格，圖片，地圖，文本，網(wǎng)頁(yè)或者自定義視圖
• 導(dǎo)航欄，工具欄，和標(biāo)簽欄
• 可以操作當(dāng)前 app 視圖中的對(duì)象的各種控件或?qū)ο?（默認(rèn)情況下， 浮出層中的表格視圖，導(dǎo)航欄和工具欄的背景都是透明的，這樣會(huì)讓浮出層的毛玻璃效果展示出來(lái)）

在橫屏的情況下，動(dòng)作列表總是出現(xiàn)在浮出層里。

使用浮出層來(lái)展示與當(dāng)前焦點(diǎn)或被選中對(duì)象相關(guān)的額外信息，或者相關(guān)的一系列項(xiàng)。

重要

這一個(gè)部分的指引僅適用于在橫屏情況下的 UI 與用戶體驗(yàn)。如果你想在豎屏環(huán)境中展示全屏的浮出層，請(qǐng)參閱下文中的模態(tài)視圖相關(guān)內(nèi)容。

避免提供“取消浮出層”按鈕。浮出層應(yīng)當(dāng)在它不需要的時(shí)候自動(dòng)關(guān)閉。如果要決定什么時(shí)候不再需要浮出層，請(qǐng)考慮如下場(chǎng)景：

一般來(lái)說(shuō)，在用戶點(diǎn)擊浮出層以外的區(qū)域的時(shí)候，保存用戶輸入的內(nèi)容。不是每一個(gè)浮出層都會(huì)讓用戶明確地確認(rèn)取消操作，因此用戶可能會(huì)誤操作。只有當(dāng)用戶點(diǎn)擊“取消”按鈕時(shí)，才清空他們?cè)诟〕鰧又休斎氲膬?nèi)容。

讓浮出層中的箭頭盡可能直接地指向其出處。這樣有助于用戶這個(gè)浮出層是從哪里來(lái)的，以及他們與哪些任務(wù)和對(duì)象相關(guān)。

確保用戶在看不到浮出層背后的內(nèi)容的時(shí)候仍然能順利使用浮出層。浮出層會(huì)模糊背后的內(nèi)容而且用戶不能把它拖拽到其它位置。

確保同一時(shí)間內(nèi)屏幕上只有一個(gè)浮出層。你不應(yīng)該同時(shí)展示超過(guò)一個(gè)浮出層（或者外觀和行為跟浮出層很相似的模態(tài)視圖）。尤其應(yīng)當(dāng)避免同時(shí)展示一連串或者一系列浮出層，從一個(gè)浮出層中彈出另一個(gè)浮出層。

不要在浮出層上面再展示一個(gè)模態(tài)視圖。除了告警框(alert)外，浮出層中不應(yīng)當(dāng)有任何模態(tài)視圖。

可能的話，讓用戶可以僅點(diǎn)擊一下就關(guān)閉當(dāng)前浮出層并開(kāi)啟一個(gè)新的浮出層。這在若干欄按鈕每個(gè)都會(huì)喚起一個(gè)浮出層的時(shí)候尤其好用，因?yàn)樗鼫p少了用戶的額外點(diǎn)擊。

不要把浮出層設(shè)計(jì)得太大。浮出層不應(yīng)當(dāng)占據(jù)整個(gè)屏幕。相反，它的大小應(yīng)當(dāng)恰好能承載當(dāng)中的內(nèi)容，又能清楚地指向浮出層的喚起出處。浮出層的高度是不固定的，因此你可以用它來(lái)承載一個(gè)很長(zhǎng)的項(xiàng)目列表。但一般來(lái)說(shuō)，還是應(yīng)當(dāng)避免需要滾動(dòng)浮出層才能開(kāi)啟一個(gè)任務(wù)。請(qǐng)注意，系統(tǒng)可能會(huì)調(diào)整浮出層的寬高，以讓它能夠更好地適應(yīng)屏幕的尺寸。

在浮出層中使用標(biāo)準(zhǔn)的 UI 控件和視圖。一般來(lái)說(shuō)，包含標(biāo)準(zhǔn)控件和視圖的浮出層看上去最理想，而且更容易讓用戶理解。

確保自定義浮出層仍然長(zhǎng)得像一個(gè)浮出層。盡管使用 UIPopoverBackgroundView API 能夠很容易自定義浮出層的多種外觀屬性，還是應(yīng)當(dāng)避免設(shè)計(jì)出一個(gè)用戶可能無(wú)法辨識(shí)的浮出層外觀。如果你對(duì)浮出層的改動(dòng)過(guò)大，用戶就不能憑借之前的經(jīng)驗(yàn)來(lái)理解如何用你的 app 里的浮出層了。

當(dāng)浮出層可見(jiàn)的時(shí)候，想要改變它的尺寸的話請(qǐng)務(wù)必謹(jǐn)慎。當(dāng)你要在浮出層里展示同樣信息的精簡(jiǎn)或拓展視圖時(shí)，你可能需要改變浮出層的大小。當(dāng)你一定要這么做的時(shí)候，使用轉(zhuǎn)場(chǎng)動(dòng)畫往往是個(gè)好主意，因?yàn)檫@不會(huì)讓人覺(jué)得一個(gè)新的彈出窗口取代了原來(lái)的窗口。

滾動(dòng)視圖(Scroll View)

滾動(dòng)視圖方便用戶瀏覽尺寸超越滾動(dòng)視圖邊界的圖片（下圖中地球的圖片無(wú)論是長(zhǎng)度還是寬度都超過(guò)了）。

API 注釋

想要了解如何在代碼里定義滾動(dòng)視圖，請(qǐng)參考 UIScrollView.

滾動(dòng)視圖：

• 沒(méi)有預(yù)定義的外觀
• 在剛出現(xiàn)或者當(dāng)用戶對(duì)它進(jìn)行操作的時(shí)候會(huì)短暫地閃爍
• 響應(yīng)速度和對(duì)各個(gè)操作手勢(shì)的識(shí)別都應(yīng)當(dāng)讓用戶感到自然。當(dāng)用戶在視圖中拖拽內(nèi)容，內(nèi)容隨之滾動(dòng)；當(dāng)用戶輕掃屏幕時(shí)，內(nèi)容將快速滾動(dòng)——直到用戶再次觸摸屏幕或內(nèi)容已經(jīng)到達(dá)底部時(shí)停止。
• 可以應(yīng)用在頁(yè)模式(paging mode)中，在此模式下用戶可以通過(guò)拖拽和輕擊等手勢(shì)來(lái)瀏覽一頁(yè)的內(nèi)容 使用滾動(dòng)視圖來(lái)允許用戶在固定的空間內(nèi)瀏覽大尺寸或大量的視圖。

適當(dāng)?shù)刂С挚s放操作。如果放大和縮小對(duì)于當(dāng)前內(nèi)容是有用的話，你可以支持用戶通過(guò)捏或者雙擊來(lái)對(duì)當(dāng)前視圖進(jìn)行縮放。而若是支持了縮放操作的話，你還應(yīng)當(dāng)根據(jù)用戶當(dāng)前的任務(wù)來(lái)設(shè)定在當(dāng)前情景下允許縮放的最大值和最小值。如果你允許一個(gè)字符被放大到充滿整個(gè)屏幕的話，用戶會(huì)很難閱讀當(dāng)前內(nèi)容。

在頁(yè)模式滾動(dòng)視圖中，可以考慮使用頁(yè)面控件(page control)。當(dāng)你想要展示分頁(yè)、分屏或者分塊的內(nèi)容，可以使用頁(yè)面控件來(lái)讓用戶知道當(dāng)前內(nèi)容一共有多少塊，以及他們當(dāng)前瀏覽的是第幾個(gè)。

當(dāng)你在滾動(dòng)視圖中使用頁(yè)面控件的時(shí)候，最好禁用同一方向的滾動(dòng)指示器(scroll indicator)。這樣一來(lái)可以讓用戶聚焦到頁(yè)碼控件上，并讓他們有了一種唯一且清晰的方式來(lái)瀏覽當(dāng)前內(nèi)容。想要了解更多，請(qǐng)參考下文控件中的頁(yè)面控件部分內(nèi)容。

一般來(lái)說(shuō)，一次只展示一個(gè)滾動(dòng)視圖。由于用戶滾動(dòng)屏幕時(shí)動(dòng)作幅度經(jīng)常都會(huì)很大，如果在一屏中同時(shí)存在不止一個(gè)滾動(dòng)視圖，他們很容易會(huì)碰到另一個(gè)。如果你確實(shí)要在同屏中放兩個(gè)滾動(dòng)視圖，可以考慮給他們?cè)O(shè)定不同的滾動(dòng)方向，來(lái)避免用戶想要滾動(dòng)一個(gè)視圖的時(shí)候誤操作。比如 iPhone 上的股票應(yīng)用，縱向滾動(dòng)上半部分會(huì)展示股票報(bào)價(jià)，橫向滾動(dòng)下半部分時(shí)則展示該公司的特定信息。

分欄視圖控制器

分欄視圖控制器是一個(gè)用于管理兩個(gè)相鄰視圖控制器顯示的全屏視圖控制器。

API 注釋

每一個(gè)對(duì)分視圖控制器的子視圖負(fù)責(zé)管理一個(gè)窗格的展現(xiàn)。對(duì)分視圖控制器本身負(fù)責(zé)展示這些子視圖控制器與管理不同屏幕方向下對(duì)分視圖的轉(zhuǎn)場(chǎng)效果。想要了解更多如何在代碼里定義對(duì)分視圖，請(qǐng)參考 UISplitViewController Class Reference 和 SplitControllers.

在 iOS 7 及之前的版本里，對(duì)分視圖控制器僅適用于 iPad.

默認(rèn)情況下，對(duì)分視圖控制器通過(guò)當(dāng)前的尺寸來(lái)管理其子視圖。舉個(gè)例子，對(duì)分視圖：

• 可以在橫屏環(huán)境中展示并排展示兩個(gè)窗格
• 可以讓主窗格在詳情窗格上方顯示，也可以在不需要的時(shí)候（尤其是豎屏情況下）隱藏主窗格。 你可以指定特殊的展示環(huán)境下對(duì)分視圖的版式，并且通過(guò)請(qǐng)求對(duì)分視圖控制器聚焦于這個(gè)版式，以此改變窗格的排列方式。

對(duì)分視圖控制器包含廣泛的對(duì)象和視圖，諸如：

• 表格，圖像，地圖，文本，網(wǎng)絡(luò)，或自定義視圖
• 導(dǎo)航欄，工具欄，或標(biāo)簽欄 注意

即使左側(cè)窗格通常被稱為主窗格，右側(cè)窗格被稱為詳情窗格，但在代碼中并沒(méi)有強(qiáng)制固定這種從屬關(guān)系。

使用對(duì)分視圖控制器，在左側(cè)主窗格展示固定的信息，在右側(cè)詳情窗格展示相關(guān)的詳情或從屬信息。以這種設(shè)計(jì)模式，當(dāng)用戶選擇類主視圖中的某一項(xiàng)，右側(cè)詳情窗格應(yīng)當(dāng)展示相應(yīng)與這一項(xiàng)相關(guān)的內(nèi)容。（你應(yīng)當(dāng)在代碼中實(shí)現(xiàn)這個(gè)效果。）

避免創(chuàng)建一個(gè)比主窗格更窄的詳情窗格。如果右側(cè)詳情窗格比左側(cè)主窗格窄，對(duì)分視圖控制器將不能占滿整個(gè)屏幕，產(chǎn)生視覺(jué)不平衡的整體效果。

避免在兩側(cè)窗格中都同時(shí)展示導(dǎo)航欄。這樣會(huì)讓用戶很難分清這兩個(gè)窗格的從屬關(guān)系。

一般來(lái)說(shuō)，始終顯示左側(cè)主窗格中當(dāng)前選中的項(xiàng)。盡管右側(cè)窗格中的內(nèi)容會(huì)變化，但它應(yīng)當(dāng)始終保持著與當(dāng)前選中窗格的相關(guān)性。這樣的體驗(yàn)有助于用戶理解左側(cè)窗格項(xiàng)與右側(cè)窗格內(nèi)容的關(guān)系。

合適的話，給用戶提供不止一種獲取主窗格的方式。默認(rèn)情況下，豎屏方向時(shí)只會(huì)展示右側(cè)窗格，因此你需要向用戶提供一個(gè)按鈕（通常位于導(dǎo)航欄上）來(lái)讓用戶喚起和隱藏主窗格。對(duì)分視圖控制器也支持輕掃手勢(shì)來(lái)執(zhí)行呼出和隱藏的動(dòng)作。除非你的 app 有定義輕掃的手勢(shì)執(zhí)行其他功能，否則你應(yīng)當(dāng)支持用戶輕掃以喚起左側(cè)窗格。

表格視圖

表格視圖以一個(gè)可滾動(dòng)的單列多行的形式來(lái)展示數(shù)據(jù)。

API 注釋

想要了解如何在代碼中定義表格視圖，請(qǐng)參考 Tabel View Programming Guide for the iOS 以及 UITableView.

表格視圖：

• 以容易進(jìn)行分段或分組的單列形式展示數(shù)據(jù)
• 用戶可以通過(guò)點(diǎn)擊來(lái)選中某行，或通過(guò)控件來(lái)添加、移除、多選、查看詳情或者展開(kāi)另一個(gè)表格視圖 iOS 定義了兩種表格樣式：

分組型（Grouped）。表格行以分組形式展示，可以有頁(yè)眉和頁(yè)腳。分組表格視圖中至少含有一組列表，而每一組中至少包含一項(xiàng)內(nèi)容。與平鋪型不同，分組型表格沒(méi)有索引。

平鋪型（Plain）。平鋪型表格可被分為若干帶標(biāo)簽的段落，表格右側(cè)可能會(huì)出現(xiàn)垂直的表格索引。每行開(kāi)頭可以有頁(yè)眉，尾部可以有頁(yè)腳（也可以沒(méi)有）。

在這兩種樣式中，當(dāng)用戶選中某一行時(shí)，該行會(huì)短暫地高亮。當(dāng)選中某行將展開(kāi)另外一屏內(nèi)容的時(shí)候，該行會(huì)短暫地高亮，然后新一屏內(nèi)容滑入。當(dāng)用戶回到前一屏?xí)r，之前選中的那一行同樣會(huì)短暫地高亮，提醒用戶他們先前選中了什么（但并不會(huì)一直保持高亮）。 除了以上表格中列舉的元素外，iOS 定義了刷新控件，讓用戶可以刷新當(dāng)前的表格內(nèi)容。想要了解更多關(guān)于刷新控件的用法，可以參考文檔本章第三節(jié)控件中的刷新控件。iOS 提供了若干表格視圖元素(table-view elements)來(lái)擴(kuò)展表格視圖的功能。除了特別標(biāo)明外，這些元素只適用于表格視圖。

iOS 定義了在平鋪型表格和分組型表格中最常用到的四種單元格布局樣式。每種單元格樣式都有最適合展示的信息類型。

重要

從編程角度來(lái)說(shuō)，這些樣式應(yīng)用于單元格中，用以控制表格里每一列的繪制方式。

默認(rèn)型（Default）(UITableViewCellStyleDefault)。默認(rèn)型樣式包括左側(cè)的圖標(biāo)（可選），和圖標(biāo)右邊左對(duì)齊的文字標(biāo)題。

默認(rèn)型樣式適合展示一系列無(wú)須通過(guò)附加信息便可以區(qū)分的項(xiàng)。

副標(biāo)題型（Subtitled）(UITableViewCellStyleSubtitle)。副標(biāo)題型包括左側(cè)圖標(biāo)（可選），圖標(biāo)右邊左對(duì)齊展示的文字標(biāo)題，以及在標(biāo)題下方同樣左對(duì)齊展示的副標(biāo)題。

左對(duì)齊的文本標(biāo)簽讓用戶可以更快速地掃視表格。這種樣式適用于列表各項(xiàng)較為相似的情況，用戶可以通過(guò)副標(biāo)題中的詳細(xì)信息來(lái)區(qū)分列表中的各項(xiàng)。 (UITableViewCellStyleSubtitle)。副標(biāo)題型包括左側(cè)圖標(biāo)（可選），圖標(biāo)右邊左對(duì)齊展示的文字標(biāo)題，以及在標(biāo)題下方同樣左對(duì)齊展示的副標(biāo)題。

Value 1 (UITableViewCellStyleValue1).在 Value 1 樣式下，標(biāo)題左對(duì)齊，副標(biāo)題用較細(xì)的字體右對(duì)齊。

Value 2 (UITableViewCellStyleValue2).Value 2 樣式藍(lán)色字體標(biāo)題右對(duì)齊，黑色字體的副標(biāo)題左對(duì)齊，混排在同一行中。這種樣式通常不包含圖片。

Value 2 的布局中，文本和副標(biāo)題中間的垂直間距會(huì)讓用戶專注于副標(biāo)題的第一個(gè)單詞。

重要

以上四種單元格樣式均支持添加表格視圖元素，如勾選或展開(kāi)標(biāo)志。添加這些元素會(huì)縮小標(biāo)題以及副標(biāo)題單元格的可用寬度。

使用表格視圖可以簡(jiǎn)潔而高效地展示少量或者大量信息。舉例來(lái)說(shuō)，你可以通過(guò)表格視圖來(lái)：

• 展示用戶可選的選項(xiàng)列表。你可以使用選中標(biāo)記來(lái)告知用戶當(dāng)前選中了哪些項(xiàng)。 無(wú)論是平鋪型還是分組性，用戶點(diǎn)擊某一行中的某一項(xiàng)時(shí)都可以顯示一個(gè)選項(xiàng)列表。當(dāng)用戶點(diǎn)選了一個(gè)不屬于表格行的按鈕或者其他 UI 元素的時(shí)候，可以使用平鋪型表格視圖來(lái)展示喚起的選項(xiàng)列表。

• 展示層級(jí)信息。平鋪型表格樣式非常適合展示層級(jí)信息。表格中的每項(xiàng)都指向承載于另一個(gè)列表中的不同子信息。用戶可以沿著這些層級(jí)結(jié)構(gòu)的路徑來(lái)點(diǎn)擊每一層列表中的項(xiàng)。以展開(kāi)標(biāo)志告知用戶點(diǎn)擊這一列中的任何位置，都將展開(kāi)新的列表以展示其子類信息。
• 展示可以在概念上進(jìn)行分組的信息。平鋪型和分組型列表都允許你通過(guò)提供頁(yè)眉和頁(yè)腳來(lái)對(duì)信息進(jìn)行分組和分段。 你可以用頁(yè)眉頁(yè)腳視圖(header-footer view)——即 UITableViewHearderFooterView 中的一個(gè)實(shí)例——來(lái)展示頁(yè)眉和頁(yè)腳的文字，或圖片。想要了解如何在代碼中定義頁(yè)眉頁(yè)腳視圖，請(qǐng)參考 UITableViewHeaderFooterView Class Reference.

使用表格視圖時(shí)，可遵循以下這些指引：

用戶選擇列表項(xiàng)時(shí)，始終給與反饋。當(dāng)用戶點(diǎn)擊可選的列表項(xiàng)時(shí)會(huì)認(rèn)為被點(diǎn)擊的項(xiàng)都應(yīng)短暫地高亮一下。在點(diǎn)擊后，用戶期望出現(xiàn)新的視圖，或者出現(xiàn)一個(gè)復(fù)選標(biāo)記以表明先前點(diǎn)擊的項(xiàng)已經(jīng)被選中或激活。

如果表格的內(nèi)容龐大而且復(fù)雜，不要在所有數(shù)據(jù)都加載完之后才一起顯示出來(lái)。可以首先展示文本信息，圖片等較為復(fù)雜的內(nèi)容則在加載完后再顯示。這樣可以將有用的信息立即傳達(dá)給用戶，同時(shí)也提高了應(yīng)用的響應(yīng)能力。

在等待信息加載的時(shí)候，可以考慮展示“過(guò)期”信息。盡管我們并不推薦在數(shù)據(jù)頻繁變化的應(yīng)用中這樣做，它還是可以幫助更多的靜態(tài)應(yīng)用程序立即給到用戶有用的信息。當(dāng)然在你這么做之前，請(qǐng)認(rèn)真衡量你應(yīng)用中數(shù)據(jù)的變化頻率，并弄清楚你的目標(biāo)用戶有多需要立即獲取最新的信息。

如果信息加載速度很慢或者非常復(fù)雜，你需要告訴用戶加載正在進(jìn)行中。如果表格中所有內(nèi)容都很復(fù)雜，我們很難即時(shí)地給用戶展示任何內(nèi)容。在這種極端情況下，切勿顯示空白的表格，因?yàn)檫@會(huì)讓用戶以為應(yīng)用掛了。此時(shí)應(yīng)當(dāng)在屏幕中央展示一個(gè)活動(dòng)指示器(activity indicator)和一個(gè)信息標(biāo)簽(information label)，比如“加載中…”，讓用戶知道加載仍然在進(jìn)行。

如果合適的話，為刪除按鈕自定義一個(gè)名稱。如果這能讓用戶更好地理解應(yīng)用的相關(guān)功能的話，你可以創(chuàng)建一個(gè)合適的標(biāo)題，來(lái)取代“刪除”這個(gè)字樣。

盡量使用簡(jiǎn)潔的文字標(biāo)簽，以避免被截?cái)唷?/strong>繁冗的文字和詞組不方便用戶瀏覽和理解。以上所有單元格樣式均會(huì)自動(dòng)截?cái)辔谋?，而文本截?cái)嗨斐傻膯?wèn)題可大可小，取決于你采用的單元格樣式，以及被截?cái)嗔四囊徊糠治淖帧?/p>

如果你想以一種非標(biāo)準(zhǔn)的形式來(lái)布局你的表格，最好是自定義一種單元格樣式，而不是在現(xiàn)有的表格樣式上進(jìn)行改動(dòng)。如何創(chuàng)建自定義單元格樣式，請(qǐng)參考 Table View Programming Guide for iOS 中的 Customizing Cells 部分。