第 20 章
使用 UITraitCollection 與構圖佈局來設計自適應集合視圖

前面兩章，你學到使用集合視圖建構範例 App 的方法。在本章中，我們將更深入地研究集合視圖。 我想和你討論兩個核心話題。

首先，它是關於一個名為自適應用戶界面（Adaptive User Interfaces）的概念。 我們將利用 Size Classes 和 UITraitCollection 來使集合視圖適應特定的設備和設備方向。 至於第二部分，我們將介紹一個更強大的功能，稱為組合佈局（Compositional Layout）。 你將學習如何使用組合佈局和差異性資料源構建集合視圖的複雜佈局。 圖 20.1 應該讓你了解我們即將創建的複雜佈局。 可能你還未發覺，這個範例可以讓使用者垂直滾動整個內容，但辦公室部分下的所有照片則可以水平滾動。 看起來很棒，對吧？

注意：倘若你還沒有閱讀過第一章，我建議到這裡暫停一下，先回到第一章。此處所介紹的部分是依照本書最前面的內容延伸而來。

依照慣例，我們會建立一個範例 App，讓你逐步了解這個觀念。準備要建立的 App 與我們前面所建的類似，不過有幾個地方做了變更：

• Cell 為自適應式 – 集合視圖 Cell 的大小會依照裝置類型及其方向做調整。你將會學到如何使用 尺寸類別 與 UITraitCollection 來讓集合視圖有自適應功能。
• 我們將使用 UICollectionView– 這裏會使用 UICollectionView 來代替 UICollectionViewController 建立相似的 UI。

一旦我們構建了第一個範例App，我們將繼續構建另一個範例程式。 這個App的 UI 佈局將更加複雜，如圖 20.1 所示。我們將應用一種新的佈局技術方式，稱為組合佈局。它是自 iOS 13 引入的，用來創建複雜佈局的 UI。 一旦你了解了合成佈局的工作原理，將能夠為集合視圖構建更精美的佈局。

本文摘自《iOS 17 App程式設計進階攻略》一書。如果你想繼續閱讀和下載完整程式碼，你可以從AppCoda網站購買完整電子版，全書範例檔皆可下載。