SnapKit 키워드 정리 - equalTo, offset, inset 등

equalTo, lessThanOrEqualTo, greaterThanOrEqualTo, 상수 값 부여

 

① 여러 경우

 

- 동일한 경우 : .equalTo

- 작거나 동일한 경우 : .lessThanOrEqualTo

- 크거나 동일한 경우 : .greaterThanOrEqualTo

 

 

② 상수값 부여

 

또한 다른 뷰들의 비교 뿐만이 아니라 상수 값을 부여할 수 있다.

button.snp.makeConstraints {
    $0.height.equalTo(30)
}

 

## 이때 left, right, centerX, centerY 등등과 같은 alignment 설정에서는 constant value 를 부여할 수 없다. 만약 부여한다면 SuperView 에 대한 설정으로 인식된다.

 

 

inset, offset, multipliedBy, dividedBy

 

inset 과 offset 을 비교하기 위해 하나의 예시를 들어 설명한다.

superView 로부터 top, leading, trailing, bottom 이 각각 100의 padding 값을 준 myView 라는 컴포넌트를 배치하고자 한다. inset 과 offset 을 통해 다음과 같이 구현할 수 있다.

 

① inset

 

superView 와의 간격을 설정할 때 사용된다.

// top, left, bottom, right
myView.snp.makeConstraints { $0 in
    $0.edges.equalToSuperview().inset(UIEdgeInsets(top: 100, left: 100, bottom: 100, right: 100))
}

// 동일 
myView.snp.makeConstraints { $0 in
    $0.edges.equalToSuperview().inset(100)
}

// 만약 top: 50, left: 50 을 줄 경우
myView.snp.makeConstraints { $0 in
    $0.edges.equalToSuperview().inset(UIEdgeInsets(top: 50, left: 50, bottom: 100, right: 100))
}

 

② offset

 

offset 공식

## 현재 view constraints = superView constraint + offset 값

myView.snp.makeConstraints { 
    $0.top.equalToSuperview().offset(100)
    $0.left.equalToSuperview().offset(100)
    $0.right.equalToSuperview().offset(-100)
    $0.bottom.equalToSuperview().offset(-100)
}

right 와 bottom 에는 - 부호를 붙여서 constraints 를 부여한다.

 

 

③ multipliedBy

button.snp.makeConstraints {
    $0.width.equalToSuperview().multipliedBy(0.5)
}

 

④ dividedBy

button.snp.makeConstraints {
    $0.width.equalToSuperview().dividedBy(2)
}