[swift] QuickLayout을 사용하여 헬스 트래킹 앱의 레이아웃 설정하기

17 Nov 2023

swift

이번 블로그 포스트에서는 QuickLayout라는 라이브러리를 사용하여 헬스 트래킹 앱의 레이아웃을 설정하는 방법을 알아보겠습니다. QuickLayout은 iOS 앱의 레이아웃을 간편하게 설정할 수 있는 도구입니다.

QuickLayout이란?

QuickLayout는 iOS 개발을 위한 오픈 소스 라이브러리로, 레이아웃을 설정하는데 필요한 코드의 양을 크게 줄여줍니다. 주로 Swift 언어로 개발된 iOS 앱에 사용되며, Auto Layout을 대체하여 빠르고 간편한 레이아웃 설정을 가능하게 해줍니다.

QuickLayout 설치하기

먼저, Cocoapods을 사용하여 QuickLayout을 설치해야 합니다. Podfile에 다음과 같이 라이브러리를 추가합니다.

pod 'QuickLayout'

그리고 터미널에서 다음 명령어를 실행하여 QuickLayout을 설치합니다.

pod install

QuickLayout 사용하기

QuickLayout을 설치한 후, 다음과 같이 코드에서 사용할 수 있습니다.

import QuickLayout

class ViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad()
        
        // 뷰 생성
        let containerView = UIView()
        containerView.backgroundColor = .white
        view.addSubview(containerView)
        
        // 컨스트레인트 설정
        containerView.layout.center(.both)
        containerView.layout.width(constant: 200)
        containerView.layout.height(constant: 300)
    }
}

위의 코드에서는 UIView를 생성하고, 해당 뷰를 UIViewController의 서브뷰로 추가하고 있습니다. containerView의 레이아웃을 설정할 때는 .layout 속성을 사용하며, 여러가지 편리한 메서드를 사용할 수 있습니다. 예를 들어, containerView.layout.center(.both)는 containerView를 부모 뷰의 가운데로 정렬하라는 뜻입니다.

QuickLayout의 다양한 기능

QuickLayout은 다양한 기능을 제공합니다. 아래는 QuickLayout의 몇가지 유용한 기능들입니다.

containerView.layout.top() : containerView를 부모 뷰의 상단에 맞춥니다.
containerView.layout.bottom(constant: 50) : containerView를 부모 뷰의 하단에 50포인트 간격을 둡니다.
containerView.layout.trailing(constant: -20) : containerView를 부모 뷰의 오른쪽에 20포인트 간격을 둡니다.
containerView.layout.leadingToSuperviewSafeArea() : containerView를 부모 뷰의 Safe Area의 왼쪽에 맞춥니다.
containerView.layout.aspectRatio(1) : containerView의 가로 세로 비율을 1:1로 유지합니다.
containerView.layout.edgesToSuperview() : containerView를 부모 뷰의 모든 가장자리에 맞춥니다.

더 많은 기능과 사용법은 QuickLayout GitHub 페이지를 참조해주세요.

마무리

이번 포스트에서는 QuickLayout을 사용하여 헬스 트래킹 앱의 레이아웃을 설정하는 방법에 대해 알아보았습니다. QuickLayout은 iOS 앱 개발을 편리하게 해주는 강력한 툴이므로, 다음번에는 실제 앱에 적용해보는 것을 추천합니다. 번거로운 Auto Layout 코드 작성을 줄이고, 코드 구조를 더 간결하게 유지할 수 있습니다.