共用方式為


清單檢視

注意

此設計指南已針對 Windows 7 建立,但尚未更新較新版本的 Windows。 大部分指引仍適用原則,但簡報和範例不會反映我們 目前的設計指導方針

透過清單檢視,使用者可以使用單一選取專案或多重選取專案,檢視數據物件集合並與其互動。

具有數據行標頭的清單檢視螢幕快照

一般清單檢視表。

清單檢視比清單框更有彈性和功能。 與清單框不同,它們支援變更檢視、分組、具有標題的多個數據行、依數據行排序、變更數據行寬度和順序、成為拖曳來源或置放目標,以及將數據複製到剪貼簿或從剪貼簿複製數據。

注意

版面配置清單框 相關的指導方針會顯示在不同的文章中。

這是正確的控制項嗎?

清單檢視不只是更有彈性且功能更實用的清單框:其額外功能會導致不同的使用方式。 下表顯示比較。

使用方式 清單方塊 清單檢視
資料類型
數據和程序選項。
僅限數據。
Contents
僅限標籤。
標籤和輔助數據,可能位於多個資料行中。
互動
用於進行選取。
可用於進行選取,但通常用於顯示及與數據互動。 可以是拖曳來源或置放目標。
展示
固定。
用戶可以變更檢視、群組、依數據行排序,以及變更數據行寬度和順序。

若要決定這是正確的控件,請考慮下列問題:

  • 清單是否呈現數據,而不是程序選項? 如果沒有,請考慮改用清單框。
  • 使用者是否需要變更檢視、群組、依數據行排序,或變更數據行寬度和順序? 如果沒有,請改用清單框。
  • 控件是否需要是拖曳來源或置放目標? 如果是,請使用清單檢視。
  • 清單專案是否需要從剪貼簿複製到或貼上? 如果是,請使用清單檢視。

選取框清單檢視

  • 控件是用來從數據清單中選擇零個或多個專案嗎? 若要選擇一個專案,請改用單一選取專案。
  • 多重選取對工作或常用而言是不可或缺的嗎? 如果是,請使用複選框清單檢視讓多個選取專案變得明顯,特別是目標使用者未進階時。 如果沒有,請使用標準多重選取清單檢視,如果複選框會對多個選取範圍引起太多關注,或導致螢幕雜亂太多。
  • 多重選擇的穩定性很重要嗎? 如果是,請使用 複選框清單、清單產生器或新增/移除清單,因為按兩下一次只會變更單一專案。 使用標準多重選取清單,即使意外清除所有選取專案也很容易。

注意

有時候清單檢視看起來像是使用清單框實作的控件,反之亦然。 在這種情況下,請根據使用方式套用指導方針,而不是根據實作來套用指導方針。

使用模式

所有檢視都支援單一選取專案,使用者一次只能選取一個專案,以及多個選取專案,用戶可以選取任意數目的專案,包括無專案。 清單檢視支援 延伸選取模式,可藉由拖曳或 Shift+按兩下或 Ctrl+按兩下來分別選取連續或非相鄰值的群組來擴充選取範圍。 與清單框不同,它們不支援 多個選取模式,無論 Shift 和 Ctrl 鍵為何,按兩下任何項目都會切換其選取狀態。

標準清單檢視

清單檢視控制項支援五個標準檢視:

使用方式 範例
圖標
每個項目都會以中等圖示顯示,右側有標籤和選擇性詳細數據。
具有標題和詳細數據的縮圖螢幕快照
磚檢視會顯示右側具有標籤和選擇性詳細數據的中型圖示。
大型圖示
每個項目都會以超大型、大或中型圖示的形式顯示,其下方有標籤。
大型縮圖清單檢視的螢幕快照
大型圖示檢視會以大型圖示顯示每個專案,其下方有標籤。
小型圖示
每個項目都會以小型圖示顯示,右側有標籤。
小型縮圖清單檢視的螢幕快照
小型圖示檢視會將每個項目顯示為小型圖示,其標籤位於右側。
清單​​
每個項目都會以小型圖示顯示,右側有標籤。
在清單模式中,此檢視會排序數據行中的專案,並使用水平滾動條。 相反地,圖示檢視會依數據列排序專案,並使用垂直滾動條。
清單模式中清單檢視的螢幕快照
清單模式會將每個項目顯示為小型圖示,其標籤位於右側。
詳細資料
每個項目都會以表格式格式顯示為數據列。 最左邊的數據行同時包含專案的選擇性圖示和標籤,而後續的數據行則包含其他資訊,例如項目屬性。
此外,可以新增或移除數據行,並重新排序和重設大小。 數據列可以分組,依數據行排序。
詳細數據模式中清單檢視的螢幕快照
詳細數據檢視會以表格格式顯示每個專案。

清單檢視變化

標籤
數據列選擇器
清單檢視有時有許多數據行,因此顯示全部數據行並不實用。 在此情況下,最佳方法是預設顯示最有用的數據行,並允許用戶視需要新增或移除數據行。
[資料行選擇] 選單的清單檢視螢幕快照
以滑鼠右鍵按下資料列標題會顯示可讓使用者新增或移除資料行的操作功能表。
[選擇詳細資料] 對話框的螢幕快照
按兩下資料列標頭操作選單中的 [更多] 會顯示 [選擇資料行] 對話框,讓使用者新增或移除資料行,以及重新排序數據行。
選取框清單檢視
允許用戶選取多個專案。
多重選取範圍清單檢視的外觀與單一選取清單檢視完全相同,因此沒有視覺線索可支援多重選取。 選取專案清單檢視可用來清楚指出多個選取專案是可行的。 因此,此模式應該用於多個選取是必要或常用的工作。
含有數個複選框的對話框螢幕快照
在此範例中,小型圖示檢視會使用複選框,因為多重選取對工作而言很重要。
列出具有群組的檢視
將數據組織成群組。
雖然 Details 檢視通常支援依任何數據行排序數據,但清單檢視可進一步允許使用者將項目組織成群組。 群組的一些優點包括:
  • 群組適用於所有檢視(清單除外),因此,例如,使用者可以依藝術家將專輯的額外大型圖示檢視分組。
  • 群組可以是高階集合,通常比直接分組數據更有意義。 例如,Windows 檔案總管會將日期分組為今日、昨天、上周、今年早些時候和 A 很久以前。
包含數個數據群組的清單檢視螢幕快照
在此範例中,Windows 歡迎中心會顯示清單檢視中的群組專案。

指導方針

簡報

  • 以邏輯順序排序列表專案。 依字母順序排序名稱、數值順序的數位,並以時間順序排序日期。

  • 如果適用,允許使用者變更排序順序。 如果清單有許多專案,或者在某些情況下,使用預設以外的排序順序更有效率地找到專案,則使用者排序很重要。

  • 使用Always Show Selection屬性 ,讓使用者可以輕鬆地判斷選取的專案,即使控件沒有焦點也一樣。

  • 避免呈現空的清單檢視。 如果使用者建立清單,請使用使用者可能需要的指示或範例專案來初始化清單。

    包含指示的搜尋對話框螢幕快照

    在此範例中,搜尋清單檢視一開始會顯示指示。

  • 如果使用者可以變更檢視、分組、依數據行排序,或變更數據行及其寬度和順序,請保留這些設定,以便在下次顯示清單檢視時生效。 讓他們以個別清單檢視為基礎保存。

互動

  • 使用單鍵來選取使用者所指向的清單專案。例外狀況: 針對命令連結清單模式,按下即可選取專案,並關閉視窗或流覽至下一頁。

  • 請考慮提供按兩下行為。 按兩下應該與選取項目並執行其預設命令相同。

  • 請讓雙擊行為備援。 應該一律會有具有相同效果的命令按鈕或操作功能表命令。

  • 如果清單專案需要進一步的說明,請在資訊提示中提供說明。 使用完整的句子和結尾標點符號。

    使用鍵盤資訊提示的清單檢視螢幕快照

    在此範例中,資訊提示可用來提供進一步的資訊。

  • 提供相關命令的內容功能表。 這類命令包括剪下、複製、貼上、移除或刪除、重新命名和屬性。

  • 如果使用者可以變更排序順序和群組,請提供 [排序依據] 和 [群組依據] 操作功能表。 第一次按兩下資料行名稱會以該資料行的遞增順序排序或分組清單,第二次按兩下會以遞減順序排序或群組。 使用上一個順序 (從另一個數據行) 作為次要索引鍵。

    具有 [排序依據] 功能表的清單檢視螢幕快照

    在此範例中,[排序依據] 操作功能表會變更排序順序。 按兩下 [名稱] 一次,依名稱以遞增順序排序。 按兩下 [名稱] 會以遞減順序再次依名稱排序。

  • 使用鍵盤讓清單檢視數據行行首可供存取。

    • 開發人員: 您可以藉由將焦點設定為數據行標頭控件來執行此動作。 這項功能是 Windows Vista 的新功能。
  • 停用清單檢視時,也停用任何相關聯的標籤和命令按鈕。

  • 避免水平捲動。 清單模式使用水平捲動。 此模式通常是最精簡的,但水平捲動通常比垂直捲動更難使用。 如果精簡不重要,請考慮改用小型圖示檢視。 不過,當有許多依字母順序排序的專案和足夠的螢幕空間可供寬控件使用時,清單模式是不錯的選擇。

    可以接受:

    寬清單模式控制件的螢幕快照

    在此範例中,會使用清單模式,因為有許多專案和大量的可用螢幕空間可供寬控件使用。

多重選取清單

  • 請考慮顯示清單下方選取的項目數目,特別是如果使用者可能選取數個專案。 這項信息不僅提供有用的意見反應,而且清楚指出清單檢視支援多重選取。

    五個選取縮圖清單的螢幕快照

    在此範例中,選取的項目數目會顯示在清單下方。

  • 或者,除了選取的項目數目之外,您也可以提供其他可能更有意義的選取計量,例如選取專案所需的資源。

    顯示磁碟空間的對話框螢幕快照

    在此範例中,安裝元件所需的磁碟空間比選取的元件數目更有意義。

  • 針對複選框清單檢視,如果可能有許多項目並選取或清除所有專案,請新增 [全部選取] 和 [清除所有命令] 按鈕。

  • 使用混合狀態複選框來指出容器中專案的部分選取專案。 混合狀態不會作為個別專案的第三個狀態。

變更檢視

如果使用者可以變更檢視:

  • 根據預設,選擇最方便的檢視。 使用者所做的任何變更都應該以個別清單檢視為基礎,持續進行。

  • 使用分割按鈕、功能表按鈕或下拉式清單來變更檢視。 只要可行,請在 工具列上使用分割按鈕 ,並變更按鈕標籤以反映目前的檢視。

    具有分割 [檢視] 按鈕的清單螢幕快照

    在此範例中,工具列上的分割按鈕可用來變更檢視。

  • 提供 [檢視] 操作功能表。

    具有 [檢視] 操作功能表的清單螢幕快照

在此範例中,會使用 [檢視] 操作功能表來變更檢視。

詳細數據檢視

  • 請考慮使用磚檢視來改善可讀性。

    可以接受:

    具有窄數據行的詳細數據清單螢幕快照

    在此範例中,數據太多,而視窗、清單和數據行太小,使得清單專案難以讀取。

    更好:

    詳細數據清單的螢幕快照,其中包含群組中的數據

    在此範例中,磚檢視會顯示數據而不截斷。

  • 選擇適合最長數據的預設數據行寬度。 清單檢視會自動截斷具有省略號的長數據,因此,如果預設顯示少數省略號,數據行寬度就會適當。 雖然使用者可以調整數據行的大小,但偏好其他解決方案:

    • 調整每個數據行寬度以符合其數據的大小。
    • 調整控件寬度,使其數據行加上任何可能滾動條的大小。
    • 如有必要,請使用水平捲動。
    • 只有奇數大小的項目或最後手段才截斷數據。

    如果預設必須截斷一般大小的數據,請讓視窗和清單檢視重新重設大小。 針對任何將本地化的文字(但不包含數字)額外 30%(短文字最多 200%)。

    不正確:

    具有截斷數據的清單數據行螢幕快照

    在此範例中,大部分的數據都會被截斷。 許多省略號清楚地指出控件和數據行寬度對數據而言太小。

    不正確:

    具有截斷數據的一欄清單螢幕快照

    在此範例中,數據會在沒有理由的情況下被截斷。

  • 選擇適當的預設數據行順序。 一般而言,依下列方式排序數據行:

    • 首先,專案名稱或識別數據。
    • 接下來,用於區分清單專案的其他數據。
    • 接下來,最有用的 (最好是短或固定長度) 數據。
    • 接下來,較不有用(最好是簡短或固定長度)的數據。
    • 最後、長、可變長度的數據。

    長長度數據會放在最後一個數據行中,以減少水準捲動的需求。 在這些類別中,將相關信息放在邏輯序列中。

  • 適當時,允許使用者新增和移除數據行,以及變更順序。 根據預設,顯示最有用的數據行。 這可透過 [標頭拖放] 屬性來達成。

  • 選擇適合數據的對齊方式。 使用下列規則:

    • 以滑鼠右鍵按兩下數位、貨幣和時間。
    • 靠左對齊的文字、標識碼(即使數值),以及日期。
  • 對於可排序的數據行標題, 第一次按兩下標題會依數據行的遞增順序排序列表,第二次按兩下會以遞減順序排序。 使用上一個排序順序(從另一個數據行)作為次要排序索引鍵。

    詳細數據清單的螢幕快照,其中包含已排序的數據

    在此範例中,先按兩下 [名稱] 資料行,再按下 [類型] 資料行。 因此,以遞增順序輸入 是主要排序索引鍵,而以遞增順序命名為次要。

  • 使用 [完整數據列選取] 屬性 ,讓使用者可以輕鬆地判斷所有數據行中選取的專案。

  • 除非可以排序數據,否則請勿使用可排序的數據行首。

  • 如果只有一個數據行,而且不需要反向排序,請勿使用數據行標頭。 請改用標籤來識別數據。

    不正確:

    數據行標頭中有標籤的清單螢幕快照

    正確

    在控件上方加上標籤的清單螢幕快照

    在正確的範例中,會使用標籤,而不是數據行標頭。

清單重設大小和間距的螢幕快照

建議的清單檢視大小和間距。

  • 選擇顯示整數項目數的清單檢視高度。 避免垂直截斷專案。
  • 選擇清單檢視大小,排除所有支持檢視中不必要的垂直和水平卷動。 清單檢視應該會顯示在 3 到 20 個項目之間。 如果這樣做會排除滾動條,請考慮讓清單檢視稍微大一點。 可能有許多專案的清單應該顯示至少五個專案,以便捲動,方法是一次顯示更多專案,並讓滾動條更容易定位。
  • 如果使用者受益於讓清單檢視變大,請讓清單檢視及其父視窗重設大小。 這麼做可讓用戶視需要調整清單檢視大小。 不過,可重設大小的清單檢視應該不會顯示少於三個專案。

標籤

控件標籤

  • 所有清單檢視都需要標籤。 將卷標撰寫為單字或詞組,而非句子,以冒號結尾,使用靜態文字。

  • 為每個標籤指派唯 一的存取金鑰 。 如需指導方針,請參閱 鍵盤

  • 使用 句子樣子大寫

  • 將標籤放置在控件上方,並將標籤對齊控件的左邊緣。

  • 若為多重選取範圍清單檢視,請撰寫清楚指出多個選取範圍的標籤。 複選框清單檢視標籤可能較不明確。

    正確

    卷標的螢幕快照:選取一或多個附加元件

    在此範例中,標籤清楚地指出多個選取專案是可能的。

    不正確:

    卷標的螢幕快照:附加元件

    在此範例中,標籤不會提供多個選取範圍的相關信息。

    可以接受:

    選取框清單標籤的螢幕快照:附加元件

    在此範例中,複選框會清楚指出有多個選取專案,因此標籤不一定明確。

  • 您可以在標籤之後的括弧中指定單位(秒、連接等等)。

標題標籤

  • 讓標題標籤保持簡短(三個字或更少)。
  • 使用沒有結束標點符號的單一名詞或名詞片語。
  • 使用 句子樣子大寫
  • 以與數據相同的方式對齊標題。

群組標籤

  • 針對高階集合使用下列群組標籤:
    • 名稱:使用名字或字母範圍的第一個字母。
    • 大小:未指定、0 KB、0-10 KB、10-100 KB、100 KB - 1 MB、1-16 MB、16-128 MB
    • 日期:今天、昨天、上周、今年早些時候和很久以前。
  • 否則,群組標籤會使用所分組數據的確切文字,包括大寫和標點符號。

數據文字

指示文字

  • 如果您需要新增清單檢視的相關指示文字,請將它新增至卷標上方。 使用完整的句子搭配結尾標點符號。
  • 使用 句子樣子大寫
  • 其他有助於但不需要的信息應該保持簡短。 請將這項資訊放在標籤和冒號之間的括弧中,或控件下方沒有括號。

文件集

參考清單檢視時:

  • 使用確切的標籤文字,包括其大寫,但不包含訪問鍵底線或冒號,並包含字組清單。 請勿將清單框稱為清單框、清單檢視或欄位。
  • 針對清單數據,請使用確切的數據文字,包括其大寫。
  • 只有在程序設計和其他技術檔中,才能將清單檢視視為清單檢視。 其他地方都會使用清單。
  • 若要描述用戶互動,請針對數據使用 select,然後按兩下標題。
  • 可能的話,請使用粗體文字來格式化標籤和清單選項。 否則,只有在需要防止混淆時,才將標籤和選項放在引號中。

範例:在 [ 程序和服務 ] 列表中,選取 [ 檔案和印表機共用]。

在清單檢視中參考複選框時:

  • 使用確切的標籤文字,包括其大寫,並包含單字複選框。 請勿包含訪問鍵底線。
  • 若要描述用戶互動,請使用 select 和 clear。
  • 可能的話,請使用粗體文字格式化標籤。 否則,只有在需要防止混淆時,才將標籤放在引號中。

範例:選取 [ 底線] 複選框。