아는 것을 남에게 설명해 주는 것은 좋은 학습법입니다. 내일배움캠프 iOS 트랙에서는 수강생이 돌아가며 학습에 개발 공부에 도움 되는 주제를 선정해 발표합니다. [초보자의 코딩 공부]에서는 내일배움캠프 수강생들이 공유한 코딩 지식과 학습법을 알려드립니다.
Auto layout을 쉽게 만들기 위한 라이브러리, Snapkit에 대해 알아보도록 하자.
왜 Snapkit을 사용할까?
다른 라이브러리에 비해 훨씬 코드 길이가 짧아지고 가독성이 좋아진 것을 확인할 수 있다.
equalTo() & equalToSuperview()
equalTo()메서드는 특정 뷰의 제약 조건을 다른 뷰와 같게 설정할 때 사용한다. 예제를 통해 알아보면 다음과 같다.
화면 속에 0으로 보이는 numberLable의 width는 80과 같다. incrementBtn의 left는 numberLabel의 right와 같은 위치에 있고 32만큼의 offset(거리)을 가진다. 그와 같이 incrementBtn의 left도 numberLabel의 right와 같은 위치에 있고 32만큼의 offset(거리)을 가진다.
equalToSuperview()도 화면 속 코드에서 확인할 수 있다. 코드 중 superview란, 특정 뷰의 상위 뷰를 말한다. numberLabel은 superview로서 기본 view를 가지게 된다. 위 예제에서 numberLabel은 centerX와 centerY를 Superview와 같게 한다는 것을 볼 수 있다.offset & inset
offset과 inset은 Auto Layout 제약 조건을 설정할 때 뷰 간의 거리를 지정하는 데 사용되는 메서드이다.
offset은 양수로 조건을 줄 시 가로는 왼쪽으로 움직이고 세로는 아래쪽으로
움직이게 된다. 즉, 양수로 네 방향에 constraint를 준다면 아래 사진처럼 뷰가 위치하게 되는 것이다.
inset은 constraint 관계를 가지는 다른 뷰와의 거리를 말한다. 양수로 각 방향에 constraint를 준다면 사진처럼 뷰가 위치하게 된다. padding과 비슷하다고 생각하면 좋다.
활용하면 좋은 메서드
SnapKit에서는 여러 가지 constraint들을 한 번에 설정해 주는 몇 가지 메서드를 제공한다.
edges
edges는 특정 뷰의 네 모서리(top, left, bottom, right)를 다른 뷰나 상위 뷰의 모서리와 동일하게 설정하는 메서드다. 위 예제처럼 inset을 모두 20씩 한 번에 줄 수 있다.
위처럼 top, left, bottom, right를 각각 지정하는 것도 물론 가능하다.
size
size는 특정 뷰의 너비와 높이를 한 번에 설정하는 메서드다. size를 80으로 지정해주게 된다면 width와 height 모두 80만큼 길이를 가지게 된다.
혹은 CGSize를 사용하여 width와 height를 각각 원하는 크기로 설정할 수도 있다.
center
center는 특정 뷰의 중심을 다른 뷰나 상위 뷰의 중심과 동일하게 설정하는 메서드다. centerX와 centerY를 함께 지정해주고 싶다면 center attribute를 사용할 수 있다.글 | 장수빈 내배캠 수강생
편집 | 김진원 팀스파르타 객원 에디터
취업 준비, 어디서부터 시작해야 할지 모르겠다면?
🧐비전공자인데 IT 업계 취업할 수 있을까?
😟프로젝트 경험이 부족한데, 어떻게 준비해야 할까?
🥺IT 기업으로 이직하고 싶은데 뭐부터 시작해야 할까?
이런 고민을 하고 있다면, 내일배움캠프의 IT 취업 컨설팅을 받아보세요.
취업 코칭 전문가들이 여러분의 고민을 해결해 드립니다.
다음 링크에 이메일을 입력하시면 메일로 1:1 커리어 상담권과 취준 자료집을 보내드릴게요.
Share article
Subscribe to our newsletter