본문 바로가기
FE 공부/Swift

Swift _ StackView

by 꼬질꼬질두부 2022. 11. 15.
반응형
A streamlined interface for laying out a collection of views in either a column or a row.
: 열이나 행에 view들을 배치하기 위한 인터페이스

 

 

 

Horizontal Stack View : View 가로 배치


Vertical Stack View : View 세로 배치

 

 

 


Manage the stack view’s appearance

 

Axis

>> 스택의 방향을 결정; horizontal or vertical

 

Alignment

>> 스택의 axis에 수직으로 배열된 레이아웃 결정

 

<Axis Horizontal의 경우>

Fill

subView들의 height를 stackView의 height와 맞춤

Top

subView들을 StackView의 위에 정렬

Center

subView들을 StackView 중앙에 정렬

Bottom

subView들을 StackView 아래에 정렬

 

 

<Axis Vertical의 경우>

Fill

subView들의 width를 stackView의 width와 맞춤

Leading

subView들을 StackView의 왼쪽에 정렬

Center

subView들을 StackView 중앙에 정렬

Trailing

subView들을 StackView 오른쪽에 정렬

 

 

Distribution

>> axis에 따라 정렬된 뷰의 레이아웃 결정

사진의 axis는 vertical이지만 아래 설명은 horizontal을 기준으로 함

 

1. Fill

나머지 View들이 자신의 크기를 갖고, 크기가 설정되지 않은 마지막 View는 StackView의 남은 공간에 꽉 채워지게 됩니다.

 

 

2. Fill Equally

StackView의 축을 따라 모든 View가 같은 크기로 채워지도록 합니다.

 

 

 

3. Fill Proportionally

비율에 맞춰 StackView를 채웁니다.

 

 

 

4. Equal Spacing

모든 View 들이 일정한 간격으로 배치되어 StackView를 채웁니다.

 

 

 

 

5. Equal Centering

모든 View가 일정한 Center to Center 간격으로 배치됩니다.

 

 

자료 참고: https://worldseawater.tistory.com/92

 

Spacing

>> 정렬된 뷰들 사이의 최소 간격 설정

 


Managing arranged subviews

 

func addArrangedSubview(UIView)
Adds a view to the end of the arranged subviews array.
: 정렬된 서브뷰 배열의 끝에 새로운 뷰를 추가
 
var arrangedSubviews: [UIView]
The list of views arranged by the stack view.
: stack view에 정렬된 view 목록
 
func insertArrangedSubview(UIView, at: Int)
Adds the provided view to the array of arranged subviews at the specified index.
: 원하는 인덱스에 뷰 추가
parameter >> UIView = 넣을 UIview, at: Int = 뷰를 넣을 인덱스 번호
 
func removeArrangedSubview(UIView)
Removes the provided view from the stack’s array of arranged subviews.
: 원하는 뷰 빼기
parameter >> UIView = 없애고자하는 UIview

 


Configuring the layout

 

var axis: NSLayoutConstraint.Axis
The axis along which the arranged views lay out.
 
var alignment: UIStackView.Alignment
The alignment of the arranged subviews perpendicular to the stack view’s axis.
 
var distribution: UIStackView.Distribution
The distribution of the arranged views along the stack view’s axis.
 
var spacing: CGFloat
The distance in points between the adjacent edges of the stack view’s arranged views.
 
var isBaselineRelativeArrangement: Bool
A Boolean value that determines whether the vertical spacing between views is measured from their baselines.
: view 간의 vertical 간격이 baseline에서 측정되는지 여부
 
var isLayoutMarginsRelativeArrangement: Bool
A Boolean value that determines whether the stack view lays out its arranged views relative to its layout margins.
: UIStackView가 arranged view를 위치 시킬때, layout margin을 사용할지 안할지 결정하는 값(기본값은 false)

>> 위에서 설명함


Adding space between items

 

func customSpacing(after: UIView) -> CGFloat
Returns the custom spacing after the specified view.
: 지정한 보기 뒤에 사용자 지정 간격을 반환
 
func setCustomSpacing(CGFloat, after: UIView)
Applies custom spacing after the specified view.
: 지정한 보기 뒤에 사용자 지정 간격을 적용
 
class let spacingUseDefault: CGFloat
The default spacing for subviews within a stack view.
: stack view 내의 subviews에 대한 기본 간격
 
class let spacingUseSystem: CGFloat
The system-defined spacing to the neighboring view.
: 인접한 view에 대한 시스템 정의 간격
반응형

'FE 공부 > Swift' 카테고리의 다른 글

Swift - TableView Section  (0) 2022.11.22
Swift - Alert Controller  (0) 2022.11.22
Swift _ ProgressView  (0) 2022.11.15
Swift _ Activity Indicator View  (0) 2022.11.15
Swift _ Stepper  (0) 2022.11.15

댓글