資料結構
網路
關係資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理
化學
生物
數學
英語
經濟學
心理學
社會學
時尚研究
法律研究在 Swift 和 iOS 中使用 Xcode 自動佈局
自動佈局是基於約束的佈局系統，用於開發 iOS 裝置的使用者介面。這種基於約束的佈局系統也稱為自動佈局，基本上是一個自適應 UI，可以適應不同尺寸和方向的螢幕。
自動佈局完全依賴於約束，開發人員在其中定義相鄰元素或父元素之間的關係以確定其位置。
為什麼要使用自動佈局？
在設計 iOS 應用程式時，您需要確保您正在開發的 UI 與所有螢幕尺寸和方向都相容。當您希望這樣做時，自動佈局非常方便。
考慮以下影像。在 iPhone 6 中居中的按鈕在其他裝置上未居中對齊，這是因為不同的 iOS 裝置具有不同的尺寸。在這篇文章中，我們將重點關注約束，因此如果您想了解更多關於尺寸的資訊，可以檢視 http://iosres.com/
為了確保我們開發的 UI 在所有裝置和方向上都保持一致，我們將使用自動佈局。所以，讓我們開始吧。
步驟 1 - 開啟 Xcode → 新建專案 → 單檢視應用程式 → 讓我們將其命名為“AutoLayout”
步驟 2 - 開啟 Main.storyboard，新增按鈕，如下所示，以供參考，選擇 iPhone 7Plus 作為裝置。
在這裡您可以看到我們在隨機位置添加了一個按鈕，沒有任何約束。我們的目標是將此按鈕放置在中心，並與所有裝置和方向相容。在進入步驟 3 之前，讓我們瞭解我們需要做什麼以及我們將如何實現。
Xcode 提供了兩種定義自動佈局約束的方法 - 自動佈局欄和 Control-drag。雖然我們將非常頻繁地使用自動佈局欄，並且在本博文中也是如此，但我將確保也告訴您如何使用 Control-drag。在您的 Xcode 中，在介面構建器的右下角，您可能會看到 5 個按鈕，這些按鈕稱為佈局按鈕，用於定義約束。
所以，現在我們將使用自動佈局欄為這兩個按鈕提供約束。
整個約束系統工作的核心理論是 4 個引數（前導、尾隨、頂部和底部），以及高度、寬度以及垂直和水平中心。
步驟 3 - 點選按鈕並點選“對齊”，啟用容器中的水平和垂直對齊，如下所示。
新增這兩個約束後，您可以看到您的按鈕已對齊到螢幕中心。
或者，您也可以透過控制拖動功能實現相同的效果，如下所示，選擇 UI 元件，點選控制按鈕並拖動以提供約束，提供水平和垂直居中。
步驟 4 - 現在我們將定義按鈕的寬度和高度。選擇新增新約束選項，如下所示，並新增高度和寬度。
或者，如果您不希望向容器提供水平和垂直約束，則可以提供前導約束、尾隨約束、頂部邊距和底部邊距。
步驟 5 - 所以，我們提供了所有必要的約束，我們應該始終記住 4 個邊緣，對齊到 X 軸，對齊到 Y 軸，寬度和高度我們需要確定 UI 元件的位置。
現在讓我們在不同的裝置上執行並檢視結果。我們將執行不同的裝置和方向。
您甚至可以編輯約束，如果您希望修改或刪除相同的約束，請在右側窗格的實用程式區域中選擇編號 5 選項並向下滾動，如影像所示。
因此，本教程旨在向您簡要介紹如何使用自動佈局和約束來開發自適應 UI。您可以使用上述基本概念嘗試多個元件。
2K+ 閱讀量
