[iOS/Swift] SnapKit inset() 기본 사용법 설명

 snapkit에서는 inset과 offset이 있습니다. 둘은 비슷하면서도 많이 헷갈리기도 합니다. 저는 offset을 자주 사용하고 있긴 한데 둘의 차이점은 적용 대상의 안을 기준으로 하느냐 바깥을 기준으로 하느냐의 따라서 양수와 음수가 달라집니다. 사실 사용하다 보면서 그냥 익혀가는 게 더 빠르긴 합니다. 

 

// UI
private func setUI() {
    // 슈퍼 View에 파랑색 View 추가
    self.view.addSubview(self.myView)
    self.view.addSubview(self.secondView)

    // SnapKit 적용
    self.myView.snp.makeConstraints { make in
        make.top.equalToSuperview()
        make.leading.equalToSuperview()
        make.trailing.equalToSuperview()
        make.height.equalTo(200)
    }

    // SnapKit 적용
    self.secondView.snp.makeConstraints { make in
        make.top.equalTo(self.myView.snp.bottom)
        make.leading.equalToSuperview()
        make.trailing.equalToSuperview()
        make.bottom.equalToSuperview()
    }
}

 우선 서로 맞이한 View 두 개를 만들었습니다. 실행하면 세로로 나뉜 모습이 나옵니다. 그리고 각 View들은 맞이한 부분이 아닌 곳들은 상위 View에 밀착시켜 두었습니다. 여기서 아래에 위치한 View에 모든 면에 inSet을 주도록 하겠습니다.

 

// SnapKit 적용
self.secondView.snp.makeConstraints { make in
    make.top.equalTo(self.myView.snp.bottom).inset(50)
    make.leading.equalToSuperview().inset(50)
    make.trailing.equalToSuperview().inset(50)
    make.bottom.equalToSuperview().inset(50)
}

 위에 보시면 모두 inset을 적용했습니다.

 보시면 top은 상단 View와 맞닿게 했기 때문에 그 기준?으로 안쪽으로 50이 적용된 모습입니다. 다른 면은 superView를 기준으로 안쪽으로 말려 적용된 모습입니다. 

 

make.top.equalTo(self.myView.snp.bottom).inset(-50)

 위 코드에서 top은 inset을 마이너스로 주면 바깥으로 밀려납니다. offSet은 top, leading, trailing, bottom 기준으로 +와 -가 결정된다면 inset은 맞닿아있는 면을 기준으로 안쪽으로 할지 말지 결정됩니다.