對iOS 9 新增的控件 UIStackView 官方文檔的翻譯

UIStackView

繼承結構

繼承結構

基本介紹

The UIStackView class provides a streamlined interface for laying out a collection of views in either a column or a row. Stack views let you leverage the power of Auto Layout, creating user interfaces that can dynamically adapt to the device’s orientation, screen size, and any changes in the available space. The stack view manages the layout of all the views in its arrangedSubviews property. These views are arranged along the stack view’s axis, based on their order in the arrangedSubviews array. The exact layout varies depending on the stack view’s axis, distribution, alignment, spacing, and other properties.

UIStackView 類提供了一個高效的接口用於平鋪一行或一列的視圖組合。Stack視圖使你依靠自動佈局的能力,創建用戶接口使得可以動態的調整設備朝向、屏幕尺寸及任何可用範圍內的變化。Stack視圖管理着所有在它的 arrangedSubviews 屬性中的視圖的佈局。這些視圖根據它們在 arrangedSubviews 數組中的順序沿着 Stack 視圖的軸向排列。精確的佈局變量根據 Stack 視圖的 axis, distribution, alignment, spacing, 和其它屬性共同決定。

這裏寫圖片描述

To use a stack view, open the Storyboard you wish to edit. Drag either a Horizontal Stack View or a Vertical Stack View out from the Object library, and position the stack view where desired. Next, drag out the stack’s content, dropping the view or control into the stack. You can continue to add views and controls to your stack, as needed. Interface Builder resizes the stack based on its content. You can also adjust the appearance of the stack’s content by modifying the Stack View’s properties in the Attributes inspector.
使用 stack 視圖,打開一個你希望編輯的 Storyboard,從對象庫中拖拽出一個 Horizontal Stack View 或者一個 Vertical Stack View,並放置到你希望的位置上。下一步,將控件或視圖拖拽放置到 stack 中,如果需要你可以繼續添加視圖或者控件給指定的 stack。Interface Builder 將根據 stack 的內容自動調節尺寸。你也可以通過修改屬性面板中 Stack視圖的屬性調整 stack 內容的外觀。

You are responsible for defining the position and (optionally) the size of the stack view. The stack view then manages the layout and size of its content.
你需要負責指定 stack 視圖的位置和尺寸(可選的)。然後 stack 視圖將管理其內容的佈局和尺寸。

Stack的視圖與自動佈局Stack View and Auto Layout

The stack view uses Auto Layout to position and size its arranged views. The stack view aligns the first and last arranged view with its edges along the stack’s axis. In a horizontal stack, this means the first arranged view’s leading edge is pinned to the stack’s leading edge, and the last arranged view’s trailing edge is pinned to the stack’s trailing edge. In vertical stacks, the top and bottom edges are pinned, to the stack’s top and bottom edges respectively. If you set the stack view’s layoutMarginsRelativeArrangement property to YES, the stack view pins its content to the relevant margin instead of its edge.
Stack 視圖使用自動佈局來定位和控制其管理的視圖的尺寸。stack 視圖沿着它的軸向拼湊第一個和最後一個被管理視圖,使其邊界平齊。對於一個水平 stack 視圖,這意味着第一個被管理視圖的左邊界是與 stack 的左邊界平齊的,並且最後一個被管理視圖右邊界與 stack的右邊界平齊。對於垂直 stack,上邊界和下邊界是各自平齊的。如果你設置了 stack 視圖的 layoutMarginsRelativeArrangement 屬性爲 YES,stack 視圖將使用相關的邊距與其內容對齊,而不是邊界。

For all distributions except the UIStackViewDistributionFillEqually distribution,the stack view uses each arranged view’sintrinsicContentSize property when calculating its size along the stack’s axis. UIStackViewDistributionFillEqually resizes all the arranged views so they are the same size, filling the stack view along its axis. If possible, the stack view stretches all the arranged views to match the view with the longest intrinsic size along the stack’s axis.
對於除去 UIStackViewDistributionFillEqually 分佈以外的分佈方式,stack 視圖使用被管理視圖的 intrinsicContentSize 屬性來計算沿着 stack 軸向的視圖尺寸。UIStackViewDistributionFillEqually 分佈將調節所有被管理視圖的在 stack 軸向上擁有相同尺寸,以填充 stack 視圖。如果可能,stack 視圖將保證長寬比的情況下根據 stack 軸向長度拉伸視圖)。

For all alignments except the UIStackViewAlignmentFill alignment, the stack view uses each arranged view’s intrinsicContentSize property when calculating its size perpendicular to the stack’s axis. UIStackViewAlignmentFill resizes all the arranged views so that they fill the stack view perpendicularly to its axis. If possible, the stack view stretches all the arranged views to match the view with the largest intrinsic size perpendicular to the stack’s axis.
對於除去 UIStackViewAlignmentFill 對齊方式以外的對齊方式,stack 視圖使用其管理的視圖的 intrinsicContentSize 屬性來計算視圖垂直於 stack 軸向的尺寸。 UIStackViewAlignmentFill 重新調節了所有其管理的視圖,使這些視圖填充 stack 視圖垂直於其軸向空間。如果可能,stack 視圖將拉伸其所有管理的視圖來匹配其垂直於 stack 軸向的最大固有尺寸。

定位和調整Stack視圖的尺寸Positioning and Sizing the Stack View

Although a stack view allows you to layout its contents without using Auto Layout directly, you still need to use Auto Layout to position the stack view, itself. In general, this means pinning at least two, adjacent edges of the stack view to define its position. Without additional constraints, the system calculates the size of the stack view based on its contents.

  1. Along the stack view’s axis, its fitting size is equal to the sum of the sizes of all the arranged views plus the space between views.

  2. Perpendicular to the stack view’s axis, its fitting size is equal to the size of the largest arranged view.

  3. If the stack view’s layoutMarginsRelativeArrangement property is set to YES, the stack view’s fitting size is increased to include space for the margins.

You can provide additional constraints to specify the stack view’s height, width, or both. In these cases, the stack view adjusts the layout and size of its arranged views to fill the specified area. The exact layout varies based on the stack view’s properties. See the UIStackViewDistribution and UIStackViewAlignment enums for a complete description on how the stack view handles having either extra space or insufficient space for its content.
當 Stack 視圖允許你佈局其內容而不直接使用自動佈局,你將仍然需要使用自動佈局來定位 stack 視圖。通常情況下,這意味着需要拼湊至少兩個邊界相鄰的stack來定義它的位置。沒有額外約束的情況下,系統會爲 stack 視圖計算一個尺寸來適應其內容:

  1. 沿着 stack 視圖軸向,其適應尺寸等於其管理的視圖尺寸與間距的和;
  2. 垂直於 stack 視圖軸向,其適應尺寸等於其管理的視圖中最大的視圖的尺寸;
  3. 如果 stack 視圖的 layoutMarginsRelativeArrangement 屬性設置爲 YES,stack 視圖的適應尺寸會包括邊距空間。
    你可以提供額外的約束來具體說明 stack 視圖的高度、寬度或者兩者兼有。在這些情況下,stack 視圖調整了其管理的視圖的佈局和尺寸來填充指定區域。精確的佈局變量根據 stack 視圖的屬性獲得。可以通過查看 UIStackViewDistribution 和 UIStackViewAlignment 枚舉,以獲得一個完整的 stack 視圖在其內容空間多餘或空間不足情況下的處理描述。

You can also position a stack view based on its first or last baseline, instead of using the top, bottom, or center Y position. Like the stack view’s fitting size, these baselines are calculated based on the stack view’s content.

  1. A horizontal stack view returns its tallest view for both the viewForFirstBaselineLayout and viewForLastBaselineLayout methods. If the tallest view is also a stack view, it returns the result of calling viewForFirstBaselineLayout or viewForLastBaselineLayout on the nested stack view.

  2. A vertical stack view returns its first arranged view for viewForFirstBaselineLayout and its last arranged view for viewForLastBaselineLayout. If either of these views are also stack views, then it returns the result of calling viewForFirstBaselineLayout or viewForLastBaselineLayout on the nested stack view.
    你也可以根據 stack 視圖的第一條或最後一條基線定位它,而不是使用頂部、底部或者中心的Y值。類似於 stack 視圖的適應尺寸,這些基線都是基於 stack 視圖的內容計算得到的。

一個水平的 stack 視圖調用 viewForFirstBaselineLayout 方法或 viewForLastBaselineLayout 方法時返回它最高的視圖。如果最高的視圖也是一個 stack 視圖,那麼其返回的將是在嵌套的 stack 視圖上調用 viewForFirstBaselineLayout 方法或 viewForLastBaselineLayout 方法的結果。
1. 一個垂直的 stack 視圖當調用 viewForFirstBaselineLayout 方法時返回的是其管理的第一個視圖,當調用 2. viewForLastBaselineLayout 方法時返回的是其管理的最後一個視圖。如果這兩個視圖之一也是 stack 視圖,那麼其返回的將是在嵌套的 stack 視圖上對應調用 viewForFirstBaselineLayout 方法或 viewForLastBaselineLayout 方法的結果。

Baseline alignment only works on views whose height matches their intrinsic content size’s height. If the view is stretched or compressed, the baseline appears in the wrong location.
基線對齊方式只作用於那些高度匹配其原本內容高度的視圖。如果視圖被拉伸或壓縮過,那麼基線將出現在錯誤的位置上。

最近纔開始往github上放東西 在公司寫的又不能放= = 大家姑且看看吧

github地址: https://github.com/FuThD

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章